领购物优惠券9块9包邮
首页 > 移动开发 > Android开发

Android中实现多行、水平滚动的分页的Gridview实例源码

   2015-08-10 0
核心提示：如果单行水平滚动，可以用Horizontalscrollview实现。如果是多行水平滚动，则结合Gridview（一般是垂直滚动的）和Horizontalscrollview实现
功能要求：
(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<Integer, Integer> 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<totalPages;i++){
int posx = (scrollDisX) * i;
positionLeftTopOfPages.put(i, posx);
Log.d(TAG, "~~~~~setParameters i:"+i +",posx:"+posx);
}
smoothScrollTo(0, 0);
}

public void setPresenter(IDrawerPresenter drawerPresenter ) {
this.drawerPresenter = drawerPresenter;
}

@Override
public void fling(int velocityX) {
Log.v(TAG, "-->fling velocityX:"+velocityX);
boolean change_flag = false;
if (velocityX > 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：
复制代码 代码如下:

<com.example.multilinegridview.DrawerHScrollView
android:id="@+id/hscrollview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:scrollbars="none"
android:layout_below="@id/layout_drawer_top"
android:layout_above="@id/layout_pagenumber"
android:background="#CCCCCC" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridView
android:id="@+id/gridView"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</com.example.multilinegridview.DrawerHScrollView>

3.IDrawerPresenter接口(IDrawerPresenter.java)：
复制代码 代码如下:

public interface IDrawerPresenter {
IDrawerPresenter getInstance();
void dispatchEvent(int totalPages, int currentPage);
}

4.DrawerItem
复制代码 代码如下:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout_item"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_gravity="center"
android:background="#FFFFFF">
<ImageView
android:id="@+id/ivIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/tvTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="优惠券1"
android:textColor="#000000"
android:textStyle="bold"/>
</LinearLayout>

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 <= 0 || sel_page < 0 || sel_page >= 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 <= 0 || scrollHei <= 0){
Log.d(TAG, "scrollWid or scrollHei is less than 0");
return;
}

int spaceing = 10;
int colWid = (scrollWid - spaceing * 3) / 2;
int colHei = (scrollHei - spaceing * 3) / 2;
int numCols = (drawerItemList.size() - 1) / 2 + 1;
int gridViewWid = numCols * colWid + (numCols + 1) * spaceing;
// if numCols is odd (like 5), add blank space
if (numCols % 2 == 1){
gridViewWid += colWid + spaceing;
}

LayoutParams params = new LayoutParams(gridViewWid, scrollHei);
gridView.setLayoutParams(params);
gridView.setColumnWidth(colWid);
gridView.setHorizontalSpacing(spaceing);
gridView.setVerticalSpacing(spaceing);
gridView.setStretchMode(GridView.NO_STRETCH);
gridView.setNumColumns(numCols);
adapter = new DrawerListAdapter(this, colWid, colHei);
listener = new DrawerItemClickListener();
gridView.setAdapter(adapter);
gridView.setOnItemClickListener(listener);
int pageNum = (drawerItemList.size() - 1) / 4 + 1;
hscrollview.setParameters(pageNum, 0, scrollWid - spaceing);
updateDrawerPageLayout(pageNum, 0);
}

效果图：
Android中实现多行、水平滚动的分页的Gridview实例源码
 
标签： Android 滚动 分页 Gridview
反对 0举报 0 评论 0
 

免责声明：本文仅代表作者个人观点，与乐学笔记（本网）无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体，转载目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责，若因作品内容、知识产权、版权和其他问题，请及时提供相关证明等材料并与我们留言联系，本网站将在规定时间内给予删除等相关处理.

  • 说一说Android Studio和IDEA中一个很有用的内存调试插件
    说一说Android Studio和IDEA中一个很有用的内存
    JetBrains JVM Debugger Memory View plugin 在我最近的研发活动期间寻找新的工具，以提高我的开发经验，使Android Studio的生活更轻松，我发现一个有用的插件，我从来没有听说过。 这就是为什么，我决定写这个强大的工具，它如何帮助我与内存调试我的应用程
    02-05 AndroidStudio
  • 安卓中通知功能的具体实现
    安卓中通知功能的具体实现
    通知[Notification]是Android中比较有特色的功能，当某个应用程序希望给用户发出一些提示信息，而该应用程序又不在前台运行时，就可以借助通知实现。使用通知的步骤1、需要一个NotificationManager来获得NotificationManager manager = （NotificationManager
    02-05 安卓开发
  • Android view系统分析-setContentView
    Android view系统分析-setContentView
    第一天上班，列了一下今年要学习的东西。主要就是深入学习Android相关的系统源代码，夯实基础。对于学习Android系统源代码，也没什么大概，就从我们平常使用最基础的东西学起，也就是从view这个切入点开始学习Android的源码，在没分析源码之前，我们有的时候
    02-05 安卓开发
  • 如何进行网络视频截图/获取视频的缩略图
    如何进行网络视频截图/获取视频的缩略图
    小编导读：获取视频的缩略图，截图正在播放的视频某一帧，是在音视频开发中，常遇到的问题。本文是主要用于点播中截图视频，同时还可以获取点播视频的缩略图进行显示，留下一个问题，如下图所示， 如果要获取直播中节目视频缩略图，该怎么做呢？（ps:直播是直
    02-05 Bitmap安卓开发
  • Android NDK 层发起 HTTP 请求的问题及解决
    Android NDK 层发起 HTTP 请求的问题及解决
    前言新的一年，大家新年快乐~~鸡年大吉！本次给大家带来何老师的最新文章~虽然何老师还在过节，但依然放心不下广大开发者，在此佳节还未结束之际，给大家带来最新的技术分享~ 事件的起因不说了，总之是需要实现一个 NDK 层的网络请求。为了多端适用，还是选择
    02-05 HTTP安卓开发
  • SDK热更之如何在SDK代码中自动插桩及如何生成补
    写在前面本文是SDKHotfix相关的SDK热更系列文章中的一篇，以下为项目及系列文章相关链接：SDKHotfix整体介绍：http://blog.bihe0832.com/sdk_hotfix_project.htmlSDKHotfix对应github地址：https://github.com/bihe0832/SDKHoxFix这篇文章主要介绍一下SDK热更
    02-05 加密解密Java
  • 安装量破千万的第一个产品，我总结了3句话
    安装量破千万的第一个产品，我总结了3句话
    在今天的文章中，作者回顾了自己的第一个产品，他说“我做的第一款产品，是我的一块里程碑。”一起来看看~背景老牌大型互联网公司，部门内部创业的一个项目。我作为产品经理，也是第一次做产品经理，主导产品项目。实际上，项目初期包括我和安卓开发2个人。开
    02-05 互联网产品经理
  • 移动周刊第 176 期：Android 知识梳理
    移动周刊第 176 期：Android 知识梳理
    写在前面 本期移动周刊第 176 期如约而至，聚焦 Android、iOS、VR/AR/MR、直播等前沿移动开发技术，收录一周最热点，解读开发技巧，每周三移动周刊抢先看，我们希望从中能够让你有一些收获，如果你有好的文章以及优化建议，请发送邮件至mobilehub@csdn.net，
    02-05 安卓热修复
  • Android插件化（六）: OpenAtlasの改写aapt以防止资源ID冲突
    Android插件化（六）: OpenAtlasの改写aapt以防
    引言Android应用程序的编译中，负责资源打包的是aapt,如果不对打包后的资源ID进行控制，就会导致插件中的资源ID冲突。所以，我们需要改写aapt的源码，以达到通过某种方式传递资源ID的Package ID,通过aapt打包时获取到这个Package ID并且应用才插件资源的命名
    02-05 安卓开发
  • Android架构（一）MVP架构在Android中的实践
    Android架构（一）MVP架构在Android中的实践
    为什么要重视程序的架构设计 对程序进行架构设计的原因，归根结底是为了 提高生产力 。通过设计是程序模块化，做到模块内部的 高聚合 和模块之间的 低耦合 (如依赖注入就是低耦合的集中体现)。 这样做的好处是使得程序开发过程中，开发人员主需要专注于一点，
    02-05 安卓开发
更多>其他开发
KendoUI2014移动调查报告：HTML5vs原生之辩 WebComponents-面向未来的组件标准
更多>Android开发
说一说Android Studio和IDEA中一个很有用的内存调试插件 安卓中通知功能的具体实现
更多>IOS开发
详解iOS开发中的转场动画和组动画以及UIView封装动画 iOS开发基础之C语言
更多>WP开发
微软官方公布Win10家庭版欧美地区零售价 Win10 Mobile预览版10149已知问题与解决办法汇总
点击排行
网站首页  |  关于我们  |  联系方式  |  使用协议  |  版权隐私  |  网站地图  |  网站留言  |  违规举报