大佬教程收集整理的这篇文章主要介绍了Android 利用ViewPager+GridView实现首页导航栏布局分页效果,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
最近我尝试使用ViewPager+GridView实现的,看起来一切正常,废话不多说,具体代码如下:
如图是效果图
首先分析下思路
1.首先是怎么布局:整体是一个ViewPager将GridView作为一个View添加到ViewPager的adapter中,下方是圆点
2.接下来时作为ViewPager的item布局文件GridView,(如果最外层是RelativeLayout或线型布局等,会转换异常)
3.是GridView适配器的编写,主要是注意数量如果一共有all=10条数据,每页最多max=8条的话,第一个页面就是个数是max=8,第二个就2个all-max
package com.item.jiejie.adapter; import java.util.List; import com.item.jiejie.ProdctBean; import com.item.jiejie.R; import android.content.Context; import android.view.View; import android.view.ViewGroup; import android.widget.baseAdapter; import android.widget.ImageView; import android.widget.TextView; import android.widget.Toast; /** * GridView加载数据的适配器 * @author Administrator * */ public class MyGridViewAdpter extends BaseAdapter{ private Context context; private List<ProdctBean> lists;//数据源 privatE int mIndex; // 页数下标,标示第几页,从0开始 privatE int mPargerSize;// 每页显示的最大的数量 public MyGridViewAdpter(Context context,List<ProdctBean> lists,int mIndex,int mPargerSizE) { this.context = context; this.lists = lists; this.mIndex = mIndex; this.mPargerSize = mPargerSize; } /** * 先判断数据及的大小是否显示满本页lists.size() > (mIndex + 1)*mPagerSize * 如果满足,则此页就显示最大数量lists的个数 * 如果不够显示每页的最大数量,那么剩下几个就显示几个 */ @Override public int getCount() { // TODO Auto-generated method stub return lists.size() > (mIndex + 1) * mPargerSize ? mPargerSize : (lists.size() - mIndex*mPargerSizE); } @Override public ProdctBean getItem(int arg0) { // TODO Auto-generated method stub return lists.get(arg0 + mIndex * mPargerSizE); } @Override public long getItemId(int arg0) { // TODO Auto-generated method stub return arg0 + mIndex * mPargerSize; } @Override public View getView(int position,View convertView,ViewGroup parent) { // TODO Auto-generated method stub ViewHolder holder = null; if(convertView == null){ holder = new ViewHolder(); convertView = View.inflate(context,R.layout.item_view,null); holder.tv_name = (TextView)convertView.findViewById(R.id.item_Name); holder.iv_nul = (ImageView)convertView.findViewById(R.id.item_imagE); convertView.setTag(holder); }else { holder = (ViewHolder)convertView.getTag(); } //重新确定position因为拿到的总是数据源,数据源是分页加载到每页的GridView上的 final int pos = position + mIndex * mPargerSize;//假设mPageSiez //假设mPagerSize=8,假如点击的是第二页(即mIndex=1)上的第二个位置item(position=1),那么这个item的实际位置就是pos=9 holder.tv_name.setText(lists.get(pos).getName() + ""); holder.iv_nul.setImageresource(lists.get(pos).getUrl()); //添加item监听 // convertView.setOnClickListener(new View.onClickListener() { // // @Override // public void onClick(View arg0) { // // TODO Auto-generated method stub // Toast.makeText(context,"您点击了" + lists.get(pos).getName(),Toast.LENGTH_SHORT).show(); // } // }); return convertView; } static class ViewHolder{ private TextView tv_name; private ImageView iv_nul; } }
4.GridView的点击事件这里提供2种方法一种是在适配器用布局的点击事件来处理;第二种是Object obj = gridView.getItemAtPosition(position);来处理。
5.主程序将GridView作为View添加到ViewPager中 代码如下
package com.item.jiejie; import java.util.ArrayList; import java.util.List; import com.item.jiejie.adapter.MyGridViewAdpter; import com.item.jiejie.adapter.MyViewPagerAdapter; import android.app.Activity; import android.os.bundle; import android.support.v4.view.ViewPager; import android.view.View; import android.widget.AdapterView; import android.widget.AdapterView.onItemClickListener; import android.widget.GridView; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.Toast; /** * 实现仿@L_489_22@@L_944_23@导航栏布局分页效果 * @author Administrator * */ public class MyActivity extends Activity { private ViewPager viewPager; private LinearLayout group;//圆点指示器 private ImageView[] ivPoints;//小圆点图片的集合 privatE int @R_137_10586@lPage; //总的页数 privatE int mPageSize = 8; //每页显示的最大的数量 private List<ProdctBean> listDatas;//总的数据源 private List<View> viewPagerList;//GridView作为一个View对象添加到ViewPager集合中 //privatE int currentPage;//当前页 private String[] proName = {"名称0","名称1","名称2","名称3","名称4","名称5","名称6","名称7","名称8","名称9","名称10","名称11","名称12","名称13","名称14","名称15","名称16","名称17","名称18","名称19"}; @Override protected void onCreate(Bundle savedInstanceStatE) { // TODO Auto-generated method stub super.onCreate(savedInstanceStatE); setContentView(R.layout.activity_my); //初始化控件 initView(); //添加业务逻辑 initData(); } private void initView() { // TODO Auto-generated method stub viewPager = (ViewPager)findViewById(R.id.viewpager); group = (LinearLayout)findViewById(R.id.points); listDatas = new ArrayList<ProdctBean>(); for(int i =0 ; i < proName.length; i++){ listDatas.add(new ProdctBean(proName[i],R.drawable.iv_driving)); } } private void initData() { // TODO Auto-generated method stub //总的页数向上取整 @R_137_10586@lPage = (int) Math.ceil(listDatas.size() * 1.0 / mPageSizE); viewPagerList = new ArrayList<View>(); for(int i = 0; i < @R_137_10586@lPage; i++){ //每个页面都是inflate出一个新实例 final GridView gridView = (GridView)View.inflate(this,R.layout.item_gridview,null); gridView.setAdapter(new MyGridViewAdpter(this,listDatas,i,mPageSizE)); //添加item点击监听 gridView.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> arg0,View arg1,int position,long arg3) { // TODO Auto-generated method stub Object obj = gridView.getItemAtPosition(position); if(obj != null && obj instanceof ProdctBean){ System.out.println(obj); Toast.makeText(MyActivity.this,((ProdctBean)obj).getName(),Toast.LENGTH_SHORT).show(); } } }); //每一个GridView作为一个View对象添加到ViewPager集合中 viewPagerList.add(gridView); } //设置ViewPager适配器 viewPager.setAdapter(new MyViewPagerAdapter(viewPagerList)); //添加小圆点 ivPoints = new ImageView[@R_137_10586@lPage]; for(int i = 0; i < @R_137_10586@lPage; i++){ //循坏加入点点图片组 ivPoints[i] = new ImageView(this); if(i==0){ ivPoints[i].setImageresource(R.drawable.page_focuesE); }else { ivPoints[i].setImageresource(R.drawable.page_unfocused); } ivPoints[i].setPadding(8,8,8); group.addView(ivPoints[i]); } //设置ViewPager的滑动监听,主要是设置点点的背景颜色的改变 viewPager.setOnPagechangelistener(new ViewPager.SimpLeonPagechangelistener(){ @Override public void onPageSELEcted(int position) { // TODO Auto-generated method stub //currentPage = position; for(int i=0 ; i < @R_137_10586@lPage; i++){ if(i == position){ ivPoints[i].setImageresource(R.drawable.page_focuesE); }else { ivPoints[i].setImageresource(R.drawable.page_unfocused); } } } }); } }
6.ViewPage的适配器代码
package com.item.jiejie.adapter; import java.util.List; import android.support.v4.view.PagerAdapter; import android.view.View; import android.view.ViewGroup; /** * ViewPage的适配器 * @author Administrator * */ public class MyViewPagerAdapter extends PagerAdapter{ private List<View> viewList;//View就二十GridView public MyViewPagerAdapter(List<View> viewList) { this.viewList = viewList; } @Override public int getCount() { // TODO Auto-generated method stub return viewList!=null ? viewList.size() : 0; } @Override public Boolean isViewFromObject(View arg0,Object arg1) { // TODO Auto-generated method stub return arg0 == arg1; } /** * 将当前的View添加到ViewGroup容器中 * 这个方法,return一个对象,这个对象表明了PagerAdapter适配器选择哪个对象放在当前的ViewPage上 */ @Override public Object instantiateItem(ViewGroup container,int position) { // TODO Auto-generated method stub container.addView(viewList.get(position)); return viewList.get(position); } @Override public void destroyItem(ViewGroup container,Object object) { // TODO Auto-generated method stub container.removeView((View) object); } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。
以上是大佬教程为你收集整理的Android 利用ViewPager+GridView实现首页导航栏布局分页效果全部内容,希望文章能够帮你解决Android 利用ViewPager+GridView实现首页导航栏布局分页效果所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。