Source code of the Gridview instance that implements multi-row and horizontal scrolling paging in Android

Functional requirements:
(1) For example, 2X2 is displayed on each page, 2XN in total, and image + text is displayed on each item (click a link ).
If a single row is horizontally rolled, you can use Horizontalscrollview.
For multi-row horizontal scrolling, it is implemented in combination with the Gridview (usually vertical scrolling) and Horizontalscrollview.
(2) scroll through the page horizontally. the icon of the current page is displayed below.

1. Implement custom HorizontalScrollView (HorizontalScrollView. java ):
Because the current page needs to be passed to the caller when turning pages, the fling function should implement it by itself instead of calling the fling of the parent class.Copy codeThe Code is as follows: 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. layout file Activity_main.xml: Copy codeThe Code is as follows: <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 interface (IDrawerPresenter. java ): Copy codeThe Code is as follows: public interface IDrawerPresenter {
IDrawerPresenter getInstance ();
Void dispatchEvent (int totalPages, int currentPage );
}

4. DrawerItem Copy codeThe Code is as follows: <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 = "coupon 1"
Android: textColor = "#000000"
Android: textStyle = "bold"/>
</LinearLayout>

5. MainActivity. java
(1) Implement the IDrawerPresenter interface. In HorizontalScrollView, The IDrawerPresenter interface is used to return the current page and update pageindicator.Copy codeThe Code is as follows: @ 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) Update PageItemImageView and page indicator
PageItemImageView displays the normal page indicator, and then changes the image of the current page to selected.Copy codeThe Code is as follows: 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) DrawerListAdapterCopy codeThe Code is as follows: 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:
Implement OnItemClickListener.
(5) updateDrawerLayout
After obtaining the data size, you can calculate the number of columns to get a fixed row.
IntnumCols = (drawerItemList. size ()-1)/2 + 1
Then calculate the width of the gridview. Because two columns are displayed on each page, the last page may not be displayed on the right. to smooth the page, you can add a blank column to the gridview.
IntgridViewWid = numCols * colWid + (numCols + 1) * spaceing;
If (numCols % 2 = 1 ){
GridViewWid + = colWid + spaceing;
}Copy codeThe Code is as follows: 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 );
}

: