Android之ViewPager+GridView實現GridView介面滑動

先上效果圖：

專案地址： github.com/crazyqiang/… 歡迎star！☺

直接上程式碼 : #####MainActivity .java:

public class MainActivity extends AppCompatActivity {    
    public static int item_grid_num = 12;//每一頁中GridView中item的數量
    public static int number_columns = 4;//gridview一行展示的數目    
    private ViewPager view_pager;    
    private ViewPagerAdapter mAdapter;    
    private List<DataBean> dataList;    
    private List<GridView> gridList = new ArrayList<>();    
    private CirclePageIndicator indicator;    
   
  @Override    
  protected void onCreate(Bundle savedInstanceState) { 
          super.onCreate(savedInstanceState); 
          setContentView(R.layout.activity_main);       
          initViews();        
          initDatas();    
       }   
    
  private void initViews() {        
      //初始化ViewPager        
     view_pager = (ViewPager) findViewById(R.id.view_pager);        
     mAdapter = new ViewPagerAdapter(); 
     view_pager.setAdapter(mAdapter);        
     dataList = new ArrayList<>();       
     //圓點指示器        
     indicator = (CirclePageIndicator) findViewById(R.id.indicator); 
     indicator.setVisibility(View.VISIBLE); 
     indicator.setViewPager(view_pager);   
    }    

  private void initDatas() {        
     if (dataList.size() > 0) {            
        dataList.clear();       
      }       
     if (gridList.size() > 0) {            
        gridList.clear();       
      }       
    //初始化資料       
 for (int i = 0; i < 60; i++) {            
     DataBean bean = new DataBean();            
     bean.name = "第" + (i + 1) + "條資料";            
     dataList.add(bean);       
  }        
 //計算viewpager一共顯示幾頁       
 int pageSize = dataList.size() % item_grid_num == 0               
                   ? dataList.size() / item_grid_num               
                   : dataList.size() / item_grid_num + 1;       
  for (int i = 0; i < pageSize; i++) {            
          GridView gridView = new GridView(this);            
          GridViewAdapter adapter = new GridViewAdapter(dataList, i); 
          gridView.setNumColumns(number_columns);  
          gridView.setAdapter(adapter);            
          gridList.add(gridView);     
     }        
    mAdapter.add(gridList);   
 }   
複製程式碼

首先是確定顯示幾頁的資料，用總條數dataList.size() 和每頁item的數目item_grid_num取餘數，若能除盡，dataList.size() / item_grid_num的結果就是總頁數；若除不盡，則總頁數+1，即dataList.size() / item_grid_num+1. new GridViewAdapter(dataList, i)初始化將總資料dataList的引用和要顯示第幾頁通過構造方法傳過去. #####ViewPagerAdapter.java

class ViewPagerAdapter extends PagerAdapter {    
   private List<GridView> gridList;    
   
   ViewPagerAdapter() {        
      gridList = new ArrayList<>();    
    }    
  
    void add(List<GridView> datas) {       
        if (gridList.size() > 0) {            
        gridList.clear();       
     }        
       gridList.addAll(datas);        
       notifyDataSetChanged();  
     }    
  @Override    
    public int getCount() {       
      return gridList.size();   
     }    
  @Override   
    public int getItemPosition(Object object) {      
      return POSITION_NONE;   
    }   
   @Override   
    public boolean isViewFromObject(View view, Object object) {      
      return view == object;   
    }   
   @Override   
    public Object instantiateItem(ViewGroup container, int position) { 
       container.addView(gridList.get(position));       
       return gridList.get(position);  
    }   
   @Override    
    public void destroyItem(ViewGroup container, int position, Object object) {        
    container.removeView((View) object);   
    }
  }
複製程式碼

#####GridViewAdapter.java

class GridViewAdapter extends BaseAdapter {   
   private List<DataBean> dataList;    

  GridViewAdapter(List<DataBean> datas, int page) {       
     dataList = new ArrayList<>();        
     //start end分別代表要顯示的陣列在總資料List中的開始和結束位置       
     int start = page * MainActivity.item_grid_num;        
     int end = start + MainActivity.item_grid_num;        
     while ((start < datas.size()) && (start < end)) { 
           dataList.add(datas.get(start));            
           start++;      
         }   
      }   
  @Override    
   public int getCount() {        
      return dataList.size();   
   }   
  @Override    
   public Object getItem(int i) {      
      return dataList.get(i);   
    }   
  @Override   
   public long getItemId(int i) {     
     return i;  
    }    
  @Override  
   public View getView(int i, View itemView, ViewGroup viewGroup) {   
      ViewHolder mHolder;  
      if (itemView == null) {       
         mHolder = new ViewHolder();                         
         itemView=LayoutInflater.from(viewGroup.getContext())
                           .inflate(R.layout.item_gridview, viewGroup, false);       
         mHolder.iv_img = (ImageView) itemView.findViewById(R.id.iv_img);  
         mHolder.tv_text = (TextView) itemView.findViewById(R.id.tv_text);    
         itemView.setTag(mHolder);                            
          } 
       else {           
          mHolder = (ViewHolder) itemView.getTag();      
          }      
          DataBean bean = dataList.get(i);      
       if (bean != null) {        
           mHolder.iv_img.setImageResource(R.mipmap.group_icon);   
           mHolder.tv_text.setText(bean.name);     
         }      
          return itemView;  
         }   
      private class ViewHolder {     
          private ImageView iv_img;     
          private TextView tv_text; 
          }
       }
複製程式碼

通過start end確定要顯示的陣列在總資料List中的開始和結束位置 ，然後while迴圈在總資料List中拿到在start和end之間的資料，並把資料新增到新建立的ArrayList dataList中即可.

如有錯誤，歡迎批評指正！覺得文章對您有幫助，隨手點個讚唄！

最後貼下專案地址： https://github.com/crazyqiang/SlidePager 歡迎star！☺