Android商城开发系列(十)—— 活动广告布局实现

  在上一篇博客当中,我们讲了频道布局的实现,接下来我们讲解一下活动广告布局的实现,效果如下图:  

  

  这个是用viewpager去实现的,新建一个act_item.xml,代码如下所示:

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <FrameLayout
 3     xmlns:android="http://schemas.android.com/apk/res/android"
 4     android:layout_width="match_parent"
 5     android:layout_height="match_parent"
 6     android:clipChildren="false">
 7
 8     <android.support.v4.view.ViewPager
 9         android:id="@+id/act_viewpager"
10         android:layout_width="match_parent"
11         android:layout_height="120dp"
12         android:layout_gravity="center"
13         android:layout_marginRight="20dp"
14         android:layout_marginLeft="20dp"
15         android:clipChildren="false"/>
16
17 </FrameLayout>

  在HomeFragmentAdapter类中继续完善活动的适配器,在onCreateViewHolder方法中创建ActViewHolder,接着在onBindViewHolder方法中绑定ActViewHolder数据,代码如下所示:

  1 package com.nyl.shoppingmall.home.adapter;
  2
  3 import android.content.Context;
  4 import android.support.v4.view.PagerAdapter;
  5 import android.support.v4.view.ViewPager;
  6 import android.support.v7.widget.RecyclerView;
  7 import android.view.LayoutInflater;
  8 import android.view.View;
  9 import android.view.ViewGroup;
 10 import android.widget.AdapterView;
 11 import android.widget.GridView;
 12 import android.widget.ImageView;
 13 import android.widget.Toast;
 14
 15 import com.bumptech.glide.Glide;
 16 import com.nyl.shoppingmall.R;
 17 import com.nyl.shoppingmall.home.bean.ResultBeanData;
 18 import com.nyl.shoppingmall.utils.Constants;
 19 import com.youth.banner.Banner;
 20 import com.youth.banner.BannerConfig;
 21 import com.youth.banner.Transformer;
 22 import com.youth.banner.listener.OnBannerClickListener;
 23 import com.youth.banner.listener.OnLoadImageListener;
 24
 25 import java.util.ArrayList;
 26 import java.util.List;
 27
 28 /**
 29  * 首页适配器
 30  */
 31
 32 public class HomeFragmentAdapter extends RecyclerView.Adapter{
 33
 34     /**
 35      * 广告幅类型
 36      */
 37     public static final int BANNER = 0;
 38
 39     /**
 40      * 频道类型
 41      */
 42     public static final int CHANNEL = 1;
 43
 44     /**
 45      * 活动类型
 46      */
 47     public static final int ACT = 2;
 48
 49     /**
 50      * 秒杀类型
 51      */
 52     public static final int SECKILL = 3;
 53
 54     /**
 55      * 推荐类型
 56      */
 57     public static final int RECOMMEND = 4;
 58
 59     /**
 60      * 热卖类型
 61      */
 62     public static final int HOT = 5;
 63
 64     /**
 65      * 初始化布局
 66      */
 67     private LayoutInflater mLayoutInflater;
 68
 69     /**
 70      * 数据
 71      */
 72     private ResultBeanData.ResultBean resultBean;
 73     private Context mContext;
 74
 75     /**
 76      * 当前类型
 77      */
 78     private int currenType = BANNER;
 79
 80     public HomeFragmentAdapter(Context mContext, ResultBeanData.ResultBean resultBean) {
 81         this.mContext = mContext;
 82         this.resultBean = resultBean;
 83         mLayoutInflater = LayoutInflater.from(mContext);
 84     }
 85
 86     /**
 87      * 相当于getView创建ViewHolder部分代码
 88      * @param parent
 89      * @param viewType 当前的类型
 90      * @return
 91      */
 92     @Override
 93     public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
 94         //广告福
 95         if (viewType == BANNER){
 96             //创建BannerViewHolder,Banner里面传布局文件
 97             return new BannerViewHolder(mContext,mLayoutInflater.inflate(R.layout.banner_viewpager,null));
 98             //频道
 99         }else if (viewType == CHANNEL){
100             return new ChannelViewHolder(mContext,mLayoutInflater.inflate(R.layout.channel_item,null));
101             //活动
102         }else if (viewType == ACT){
103             return new ActViewHolder(mContext,mLayoutInflater.inflate(R.layout.act_item,null));
104         }
105         return null;
106     }
107
108     /**
109      * 相当于getView中绑定数据模块
110      * @param holder
111      * @param position
112      */
113     @Override
114     public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
115         //轮循广告
116         if (getItemViewType(position) == BANNER){
117             BannerViewHolder bannerViewHolder = (BannerViewHolder) holder;
118             bannerViewHolder.setData(resultBean.getBanner_info());
119             /**
120              * 频道
121              */
122         }else if (getItemViewType(position) == CHANNEL){
123             ChannelViewHolder channelViewHolder = (ChannelViewHolder) holder;
124             channelViewHolder.setData(resultBean.getChannel_info());
125             /**
126              * 活动
127              */
128         }else if (getItemViewType(position) == ACT){
129             ActViewHolder actViewHolder = (ActViewHolder) holder;
130             actViewHolder.setData(resultBean.getAct_info());
131         }
132     }
133
134     /**
135      * 广告幅
136      */
137     class BannerViewHolder extends RecyclerView.ViewHolder{
138
139         private Context mContext;
140         private Banner banner;
141
142         public BannerViewHolder(Context mContext, View itemView) {
143             super(itemView);
144             this.mContext = mContext;
145             this.banner = (Banner) itemView.findViewById(R.id.banner);
146         }
147
148         public void setData(List<ResultBeanData.ResultBean.BannerInfoEntity> banner_info) {
149             //得到图片集合地址
150             List<String> imagesUrl = new ArrayList<>();
151             for (int i = 0;i<banner_info.size();i++){
152                 String imageUrl = banner_info.get(i).getImage();
153                 imagesUrl.add(imageUrl);
154             }
155             //设置循环指示点
156             banner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR);
157             //设置手风琴效果
158             banner.setBannerAnimation(Transformer.Accordion);
159             //设置Banner图片数据
160             banner.setImages(imagesUrl, new OnLoadImageListener() {
161                 @Override
162                 public void OnLoadImage(ImageView view, Object url) {
163                     //联网请求图片-Glide
164                     Glide.with(mContext).load(Constants.BASE_URL_IMAGE + url).into(view);
165                 }
166             });
167             //设置点击事件
168             banner.setOnBannerClickListener(new OnBannerClickListener() {
169                 @Override
170                 public void OnBannerClick(int position) {
171                     Toast.makeText(mContext,"position=="+position,Toast.LENGTH_SHORT).show();
172                 }
173             });
174         }
175     }
176
177     /**
178      * 频道
179      */
180     class ChannelViewHolder extends RecyclerView.ViewHolder{
181
182         private Context mContext;
183         private GridView gv_channel;
184         private ChannelAdapter adapter;
185
186         public ChannelViewHolder(Context mContext, View itemView) {
187             super(itemView);
188             this.mContext = mContext;
189             gv_channel = (GridView) itemView.findViewById(R.id.gv_channel);
190         }
191
192         public void setData(List<ResultBeanData.ResultBean.ChannelInfoBean> channel_info) {
193             //得到数据后,就设置GridView的适配器
194             adapter = new ChannelAdapter(mContext,channel_info);
195             gv_channel.setAdapter(adapter);
196
197             //设置item的点击事件
198             gv_channel.setOnItemClickListener(new AdapterView.OnItemClickListener() {
199                 @Override
200                 public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) {
201                     Toast.makeText(mContext,"position"+position,Toast.LENGTH_SHORT).show();
202                 }
203             });
204         }
205     }
206
207     /**
208      * 活动
209      */
210     class ActViewHolder extends RecyclerView.ViewHolder{
211
212         private Context mContext;
213         private ViewPager act_viewpager;
214
215         public ActViewHolder(Context mContext,View itemView) {
216             super(itemView);
217             this.mContext = mContext;
218             act_viewpager = (ViewPager) itemView.findViewById(R.id.act_viewpager);
219         }
220
221         public void setData(final List<ResultBeanData.ResultBean.ActInfoEntity> act_info) {
222             //设置间距
223             act_viewpager.setPageMargin(20);
224             //有数据后,就设置数据适配器
225             act_viewpager.setAdapter(new PagerAdapter() {
226                 @Override
227                 public int getCount() {
228                     return act_info.size();
229                 }
230
231                 /**
232                  *
233                  * @param view 页面
234                  * @param object instantiateItem方法返回的值
235                  * @return
236                  */
237                 @Override
238                 public boolean isViewFromObject(View view, Object object) {
239                     return view == object;
240                 }
241
242                 /**
243                  *
244                  * @param container ViewPager
245                  * @param position 对应页面的位置
246                  * @return
247                  */
248                 @Override
249                 public Object instantiateItem(ViewGroup container, final int position) {
250                     //实例化ImageView
251                     ImageView imageView = new ImageView(mContext);
252                     //设置ImageView的拉伸
253                     imageView.setScaleType(ImageView.ScaleType.FIT_XY);
254                     //根据Glide设置图片
255                     Glide.with(mContext).load(Constants.BASE_URL_IMAGE+act_info.get(position).getIcon_url()).into(imageView);
256                     //添加到容器中
257                     container.addView(imageView);
258
259                     //设置点击事件
260                     imageView.setOnClickListener(new View.OnClickListener() {
261                         @Override
262                         public void onClick(View view) {
263                             Toast.makeText(mContext,"position=="+position,Toast.LENGTH_SHORT).show();
264                         }
265                     });
266                     return imageView;
267                 }
268
269                 @Override
270                 public void destroyItem(ViewGroup container, int position, Object object) {
271                     container.removeView((View) object);
272                 }
273             });
274         }
275     }
276
277     /**
278      * 得到不同的类型
279      * @param position
280      * @return
281      */
282     @Override
283     public int getItemViewType(int position) {
284         switch (position){
285             case BANNER: //广告幅
286                 currenType = BANNER;
287                 break;
288             case CHANNEL: //频道
289                 currenType = CHANNEL;
290                 break;
291             case ACT: //活动
292                 currenType = ACT;
293                 break;
294             case SECKILL: //秒杀
295                 currenType = SECKILL;
296                 break;
297             case RECOMMEND: //推荐
298                 currenType = RECOMMEND;
299                 break;
300             case HOT: //热卖
301                 currenType = HOT;
302                 break;
303         }
304         return currenType;
305     }
306
307     /**
308      * 总共有多少个item
309      * @return
310      */
311     @Override
312     public int getItemCount() {
313         return 3;
314     }
315
316
317 }

  我们还可以让ViewPager切换效果更加炫酷,这里介绍一个第三方库,下载地址:https://github.com/hongyangAndroid/MagicViewPager,接着去引入compile ‘com.zhy:magic-viewpager:1.0.1‘,将切换动画进行美化,代码如下图:

  

  效果图就无法截图展现出来了,有兴趣的朋友,可以动手去操作。好了,关于活动广告布局的内容就介绍这么多。

时间: 2024-10-13 14:40:15

Android商城开发系列(十)—— 活动广告布局实现的相关文章

Android商城开发系列(七)—— 使用RecyclerView展示首页数据

前面我们讲到了使用OkHttp请求网络和FastJson解析数据了,接下来我们就开始把获取到的数据通过数据适配器展示在页面上了.Adapter是用来帮助填充数据的中间桥梁,简单点说就是:将各种数据以合适的形式显示到view上,提供给用户看! 商城首页的数据是使用RecyclerView进行展示的,下面我们来讲讲如何将获取到的数据通过RecyclerView展示. 首先看一下HomeFragment的布局代码,代码如下: 1 <?xml version="1.0" encoding

Android商城开发系列(十二)—— 首页推荐布局实现

首页新品推荐的布局效果如下图: 这块布局是使用LinearLayout和GridView去实现,新建recommend_item.xml,代码如下所示: 1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout 3 xmlns:android="http://schemas.android.com/apk/res/android" 4 android:orientation

Android商城开发系列(十三)—— 首页热卖商品布局实现

热卖商品布局效果如下图: 这个布局跟我们上节做的推荐是一样的,也是用LinearLayout和GridView去实现的,新建一个hot_item.xml,代码如下所示: 1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout 3 xmlns:android="http://schemas.android.com/apk/res/android" 4 android:ori

Android 快速开发系列 打造万能的ListView GridView 适配器

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38902805 ,本文出自[张鸿洋的博客] 1.概述 相信做Android开发的写得最多的就是ListView,GridView的适配器吧,记得以前开发一同事开发项目,一个项目下来基本就一直在写ListView的Adapter都快吐了~~~对于Adapter一般都继承BaseAdapter复写几个方法,getView里面使用ViewHolder模式,其实大部分的代码基本都是类似的

Android四大组件之Activity(活动)及其布局的创建与加载布局

Android四大组件之Activity(活动)及其布局的创建与加载布局 什么是Activity ? 活动(Activity)是包含用户界面的组件,主要用于和用户进行交互的,一个应用程序中可以包含零个或多个活动. 手动创建Activity的过程详解 到现在为止,你还没有手动创建过活动呢,在第一个安卓工程中,HelloWorldActivity是ADT帮我们创建的,手动创建活动可以加深我们的理解,因此现在是时候应该自己动手了. 首先,你需要再新建一个 Android 项目,项目名可以叫做 Acti

S3C2416裸机开发系列十五_GCC下uCOS的移植(1)

S3C2416裸机开发系列十五 GCC下uCOS的移植(1) 象棋小子    1048272975 操作系统是用来管理系统硬件.软件及数据资源,控制程序运行,并为其它应用软件提供支持的一种系统软件.根据不同的种类,又可分为实时操作系统.桌面操作系统.服务器操作系统等.对于一些小型的应用,对系统实时性要求高,硬件资源有限等的情况下,应尽量避免使用复杂庞大的操作系统(如Linux),使用小型的实时操作系统(如uCOS)更能满足应用的需求.笔者此处就uCOS-II的移植作一个简单的介绍. 1. 代码准

S3C2416裸机开发系列十五_GCC下uCOS的移植(2)

S3C2416裸机开发系列十五 GCC下uCOS的移植(2) 象棋小子    1048272975 4. uCOS配置 uCOS是可裁减实时操作系统,可以根据实际的应用对内核未使用到的功能进行裁减,以进一步节省系统宝贵的硬件资源,通常可用的uCOS-II内核代码在6K~26K,这在uCOS-II配置文件os_cfg.h中进行配置,这个配置文件在源码目录为os_cfg_r.h,从目录中拷贝添加到uCOS/uCOS-II/Cfg目录中,并重命名为os_cfg.h. #ifndef OS_CFG_H

S3C2416裸机开发系列十四_GCC下UCGUI的移植(2)

S3C2416裸机开发系列十四 GCC下UCGUI的移植(2) 象棋小子    1048272975 现在主要讲解一下在GCC移植UCGUI,Makefile工程如何加入目录,加入源码,c标准库,编译选项的设置. 笔者的Makefile模板提取自uboot,工程中加入目录,加入源码都是很简单的,详细的介绍请参考前面章节" GCC启动代码工程应用实例".下面主要介绍UCGUI目录下很多的源码文件Makefile的编写,一种可行的方式就是把GUI目录上所有的c文件,不管有无用到,均加入工程

S3C2416裸机开发系列十八_音频驱动实现(1)

S3C2416裸机开发系列十八 音频驱动实现(1) 象棋小子    1048272975 在消费电子产品中,往往都会用到音频系统来播放音乐.进行通话等多媒体应用,此外,对于一些需语音提示的产品,音频部分都是不可或缺的功能.笔者此处就s3c2416的音频驱动实现作一个简单的介绍. 1. IIS音频总线 s3c2416支持IIS.PCM.AC97这三种音频接口,此处只分析IIS音频接口.IIS接口(Inter-IC Sound)在20世纪80年代首先被飞利浦公司用于消费音频,为数字音频设备之间的音频