Android中如何实现多行、水平滚动的分页的Gridview？ |
您所在的位置：网站首页 › android水平滚动 › Android中如何实现多行、水平滚动的分页的Gridview？ |
|
功能要求： (1)比如每页显示2X2，总共2XN，每个item显示图片+文字（点击有链接）。 如果单行水平滚动，可以用Horizontalscrollview实现。 如果是多行水平滚动，则结合Gridview（一般是垂直滚动的）和Horizontalscrollview实现。 (2)水平滚动翻页，下面有显示当前页的icon。
1. 实现自定义的HorizontalScrollView（HorizontalScrollView.java）： 因为要翻页时需要传当前页给调用者，所以fling函数中自己实现而不要调用父类的fling。 public class DrawerHScrollView extends HorizontalScrollView { private static final String TAG = "DrawerHScrollView"; private IDrawerPresenter drawerPresenter = null; private int currentPage = 0; private int totalPages = 1; private static Hashtable positionLeftTopOfPages = new Hashtable(); public DrawerHScrollView(Context context) { super(context); } public DrawerHScrollView(Context context, AttributeSet attrs) { super(context, attrs); } public DrawerHScrollView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public void cleanup(){ currentPage = 0; totalPages = 1; drawerPresenter = null; if(positionLeftTopOfPages != null){ positionLeftTopOfPages.clear(); } } public void setParameters(int totalPages, int currentPage, int scrollDisX) { Log.d(TAG, "~~~~~setParameters totalPages:"+totalPages +",currentPage:"+ currentPage +",scrollDisX:"+scrollDisX); this.totalPages = totalPages; this.currentPage = currentPage; positionLeftTopOfPages.clear(); for (int i = 0;i 0 && (currentPage < totalPages - 1)){ currentPage++; change_flag = true; } else if (velocityX < 0 && (currentPage > 0)){ currentPage--; change_flag = true; } if (change_flag){ int postionTo = (Integer)positionLeftTopOfPages.get(new Integer(currentPage)).intValue(); Log.v(TAG, "------smoothScrollTo posx:"+postionTo); smoothScrollTo(postionTo, 0); drawerPresenter.dispatchEvent(totalPages, currentPage); } //super.fling(velocityX); } }
2. 布局文件Activity_main.xml:
3. IDrawerPresenter接口（IDrawerPresenter.java）： public interface IDrawerPresenter { IDrawerPresenter getInstance(); void dispatchEvent(int totalPages, int currentPage); }
4. DrawerItem 5. MainActivity.java (1)实现IDrawerPresenter接口，在HorizontalScrollView里通过IDrawerPresenter接口来返回当前页，从而更新pageindicator。 @Override public IDrawerPresenter getInstance() { return this; } @Override public void dispatchEvent(int totalPages, int currentPage) { Log.v(TAG, "~~~~dispatchEvent currentPage:" + currentPage); Message msg = Message.obtain(); msg.what = MSG_DRAWER_UPDATE_PAGE_LAYOUT; msg.arg1 = totalPages; msg.arg2 = currentPage; handler.sendMessage(msg); }(2)PageItemImageView和page indicator的更新 PageItemImageView显示normal的page indicator，之后再将当前页的图片换成selected。 protected class PageItemImageView extends ImageView { public PageItemImageView(Context context) { super(context); Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon_page_normal); this.setImageBitmap(bitmap); } } public void updateDrawerPageLayout(int total_pages, int sel_page) { Log.e(TAG, "~~~updateBooksPageLayout total_pages:"+total_pages+",sel_page:"+sel_page); layout_pagenumber.removeAllViews(); if (total_pages = total_pages){ Log.e(TAG, "total_pages or sel_page is outofrange."); return; } for (int i = 0;i< total_pages;i++){ if (i != 0){ LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); params.setMargins(5, 0, 0, 0); layout_pagenumber.addView(new PageItemImageView(this), params); } else { layout_pagenumber.addView(new PageItemImageView(this)); } } PageItemImageView selItem = (PageItemImageView) layout_pagenumber.getChildAt(sel_page); Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon_page_selected); selItem.setImageBitmap(bitmap); } (3)DrawerListAdapter private class DrawerListAdapter extends BaseAdapter { private final String TAG = "MyListAdapter"; private LayoutInflater mInflater; private LinearLayout layout_item; private TextView tvTitle; private ImageView ivIcon; private final Context context; private int colWid; private int colHei; public DrawerListAdapter(Context context, int colWid, int colHei) { this.context = context; this.colWid = colWid; this.colHei = colHei; mInflater = (LayoutInflater) context .getSystemService(Context.LAYOUT_INFLATER_SERVICE); } public int getCount() { return drawerItemList.size(); } public Object getItem(int position) { return drawerItemList.get(position); } public long getItemId(int position) { return position; } public View getView(int position, View convertView, ViewGroup parent) { DrawerItem item = drawerItemList.get(position); if (convertView == null) { convertView = mInflater.inflate(R.layout.drawer_item, null); layout_item = (LinearLayout) convertView .findViewById(R.id.layout_item); ivIcon = (ImageView) convertView.findViewById(R.id.ivIcon); tvTitle = (TextView) convertView.findViewById(R.id.tvTitle); if (colHei != 0 && colWid != 0) { LinearLayout.LayoutParams params = new LinearLayout.LayoutParams( colWid, colHei - 30); ivIcon.setLayoutParams(params); } convertView.setTag(layout_item); } else { layout_item = (LinearLayout) convertView.getTag(); } ivIcon.setImageResource(R.drawable.ic_launcher); tvTitle.setText(String.valueOf(position)); return convertView; } }(4)DrawerItemClickListener: 实现OnItemClickListener。
(5) updateDrawerLayout 获得data的size后，可以算出列数来得到固定行。 intnumCols = (drawerItemList.size() - 1) / 2 + 1 再算出gridview的width。因每页可显示2列，最后一页可能右侧没有，为了翻页顺滑，可以给gridview增加一列空白。 intgridViewWid = numCols * colWid + (numCols + 1) * spaceing; if(numCols % 2 == 1){ gridViewWid+= colWid + spaceing; } public void updateDrawerLayout() { if ((drawerItemList == null) || (drawerItemList.size() == 0)) { Log.d(TAG, "itemList is null or empty"); return; } if (!hasMeasured){ Log.d(TAG, "hasMeasured is false"); return; } int scrollWid = hscrollview.getWidth(); int scrollHei = hscrollview.getHeight(); if (scrollWid |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |