Android Studio gridview 控件使用自定義Adapter, 九宮格items自適應全屏顯示

時間 2019-12-12

標籤 android studio gridview 控件使用自定義 adapter 九宮 items 自適應全屏顯示欄目 Android 简体版

原文原文鏈接

先看效果圖，相似於支付寶首頁的效果。因爲九宮格顯示的帖子網上已經不少，可是像這樣九宮格全屏顯示的例子還不是太多。本實例的需求是九宮格全屏顯示，每一個子view的高度是根據全屏高度三等分以後自適應高度，每行散列是固定的，經過本身重寫adapter實現功能需求。java

代碼結構以下圖框中標圖部分：android

佈局文件test_gridview.xml:api

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:app="http://schemas.android.com/apk/res-auto"
 3     xmlns:tools="http://schemas.android.com/tools"
 4     android:layout_width="match_parent"
 5     android:layout_height="match_parent"
 6     android:orientation="vertical"
 7     tools:context=".SimpleGridViewTest">
 8 
 9     <android.support.v7.widget.Toolbar
10         android:id="@+id/grid_view_all_toolbar"
11         android:layout_height="48sp"
12         android:layout_width="match_parent"
13         android:background="@color/allApp_toolbar_bg"
14         app:popupTheme="@style/MyTheme">
15 
16         <TextView
17             android:id="@+id/grid_view_allApp_toolbar_title"
18             android:layout_width="wrap_content"
19             android:layout_height="wrap_content"
20             android:text="所有應用"
21             android:textStyle="bold"
22             android:layout_gravity="center"
23             android:textSize="16sp" />
24     </android.support.v7.widget.Toolbar>
25 
26     <com.view.JuheGridView
27         android:id="@+id/juhe_gridview"
28         android:layout_width="match_parent"
29         android:layout_height="match_parent"
30         android:horizontalSpacing="0.0dip"
31         android:listSelector="@null"
32         android:numColumns="3"
33         android:scrollbars="none"
34         android:stretchMode="columnWidth"
35         android:verticalSpacing="0.0dip"
36         android:layout_weight="1" />
37 </LinearLayout>

子view佈局文件test_gridview_item.xml:app

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6     android:layout_margin="0.0dip"
 7     android:background="@color/grid_view_item_bg">
 8 
 9     <RelativeLayout
10         android:layout_width="match_parent"
11         android:layout_height="match_parent"
12         android:layout_centerInParent="true"
13         android:background="@drawable/gridview_selector"
14         android:padding="12.0dip">
15 
16         <ImageView
17             android:id="@+id/iv_item"
18             android:layout_width="24dp"
19             android:layout_height="24dp"
20             android:layout_marginTop="40dp"
21             android:layout_centerHorizontal="true" />
22 
23         <TextView
24             android:id="@+id/tv_item"
25             android:layout_width="wrap_content"
26             android:layout_height="wrap_content"
27             android:layout_below="@id/iv_item"
28             android:layout_centerHorizontal="true"
29             android:layout_marginTop="90px"
30             android:maxLines="1"
31             android:textColor="@color/allApp_btn_text"
32             android:textSize="38px" />
33     </RelativeLayout>
34 
35 </FrameLayout>

java 代碼 view 層 JuheGridView.java:ide

 1 package com.view;
 2 
 3 import android.content.Context;
 4 import android.util.AttributeSet;
 5 import android.widget.GridView;
 6 
 7 /**
 8  * Created by jihe on 16/8/22.
 9  */
10 public class JuheGridView extends GridView {
11     private final int ROW_NUMBER = 3;
12 
13     public JuheGridView(Context context, AttributeSet attrs) {
14         super(context, attrs);
15     }
16 
17     public JuheGridView(Context context) {
18         super(context);
19     }
20 
21     public JuheGridView(Context context, AttributeSet attrs, int defStyleAttr) {
22         super(context, attrs, defStyleAttr);
23     }
24 
25     /**
26      * 計算控件的大小
27      */
28     @Override
29     public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
30         super.onMeasure(widthMeasureSpec, heightMeasureSpec);
31         int measureWidth = measureWidth(widthMeasureSpec);
32         int measureHeight = measureHeight(heightMeasureSpec);
33 
34         // 計算自定義的ViewGroup中全部子控件的大小
35         measureChildren(widthMeasureSpec, heightMeasureSpec);
36 
37         // 設置自定義的控件MyViewGroup的大小
38         setMeasuredDimension(measureWidth, measureHeight);
39 
40     }
41 
42     private int measureWidth(int pWidthMeasureSpec) {
43         int result = 0;
44         int widthMode = MeasureSpec.getMode(pWidthMeasureSpec);// 獲得模式
45         int widthSize = MeasureSpec.getSize(pWidthMeasureSpec);// 獲得尺寸
46 
47         switch (widthMode) {
48             case MeasureSpec.AT_MOST:
49             case MeasureSpec.EXACTLY:
50                 result = widthSize;
51                 break;
52         }
53         return result;
54     }
55 
56     private int measureHeight(int pHeightMeasureSpec) {
57         int result = 0;
58 
59         int heightMode = MeasureSpec.getMode(pHeightMeasureSpec);
60         int heightSize = MeasureSpec.getSize(pHeightMeasureSpec);
61 
62         switch (heightMode) {
63             case MeasureSpec.AT_MOST:
64             case MeasureSpec.EXACTLY:
65                 result = heightSize;
66                 break;
67         }
68         return result;
69     }
70 }

model層 picture.java:佈局

 1 package com.model;
 2 
 3 /**
 4  * Created by jihe on 16/8/22.
 5  */
 6 public class Picture {
 7     private String title;
 8     private Integer imageId;
 9 
10     public Picture() {
11         super();
12     }
13 
14     public Picture(String title, Integer imageId) {
15         super();
16         this.title = title;
17         this.imageId = imageId;
18     }
19 
20     public String getTitle() {
21         return title;
22     }
23 
24     public void setTitle(String title) {
25         this.title = title;
26     }
27 
28     public Integer getImageId() {
29         return imageId;
30     }
31 
32     public void setImageId(Integer imageId) {
33         this.imageId = imageId;
34     }
35 }

重寫adapter, MyAdapter.java，這裏須要提早準備9張圖片:this

  1 package com.adapter;
  2 
  3 import android.content.Context;
  4 import android.view.LayoutInflater;
  5 import android.view.View;
  6 import android.view.ViewGroup;
  7 import android.widget.AbsListView;
  8 import android.widget.BaseAdapter;
  9 import android.widget.GridView;
 10 import android.widget.ImageView;
 11 import android.widget.TextView;
 12 
 13 import com.dev.jh.juhedidi.R;
 14 import com.model.Picture;
 15 
 16 import java.util.ArrayList;
 17 import java.util.List;
 18 
 19 /**
 20  * Created by jihe on 16/8/23.
 21  */
 22 public class MyAdapter extends BaseAdapter {
 23     private Context context;
 24     private GridView mGv;
 25     private List<Picture> pictures;
 26     private static int ROW_NUMBER = 3;
 27 
 28     /**
 29      * 數據資源：標題 ＋ 圖片
 30      * */
 31     private String[] arrText = new String[]{
 32             "京東商品", "滴滴出行", "話費流量",
 33             "油卡充值", "火車票", "飛機票",
 34             "京東優選", "遊戲卡", "Q幣"
 35     };
 36     private int[] arrImages = new int[]{
 37             R.mipmap.jd_before_click, R.mipmap.didi_before_click, R.mipmap.phone_before_click,
 38             R.mipmap.oil_before_click, R.mipmap.train_before_click, R.mipmap.plane_before_click,
 39             R.mipmap.gift_before_click, R.mipmap.game_before_click, R.mipmap.qq_before_click
 40     };
 41 
 42     public MyAdapter(Context context, GridView gv) {
 43         this.context = context;
 44         this.mGv = gv;
 45         pictures = new ArrayList<>();
 46         for (int i = 0; i < 9; i++) {
 47             Picture pt = new Picture(arrText[i], arrImages[i]);
 48             pictures.add(pt);
 49         }
 50 
 51     }
 52 
 53     @Override
 54     public int getCount() {
 55         if (null != pictures) {
 56             return pictures.size();
 57         } else {
 58             return 0;
 59         }
 60     }
 61 
 62     @Override
 63     public Object getItem(int position) {
 64         return pictures.get(position);
 65     }
 66 
 67     @Override
 68     public long getItemId(int position) {
 69         return position;
 70     }
 71 
 72     @Override
 73     public View getView(int position, View convertView, ViewGroup parent) {
 74 
 75         Holder holder;
 76         if (convertView == null) {
 77             holder = new Holder();
 78             convertView = LayoutInflater.from(context).inflate(R.layout.test_gridview_item, null);
 79             holder.iv = (ImageView) convertView.findViewById(R.id.iv_item);
 80             //設置顯示圖片
 81             holder.iv.setBackgroundResource(arrImages[position]);
 82             holder.tv = (TextView) convertView.findViewById(R.id.tv_item);
 83             //設置標題
 84             holder.tv.setText(arrText[position]);
 85             convertView.setTag(holder);
 86         } else {
 87             holder = (Holder) convertView.getTag();
 88         }
 89 
 90         //高度計算
 91         AbsListView.LayoutParams param = new AbsListView.LayoutParams(
 92                 ViewGroup.LayoutParams.MATCH_PARENT,
 93                 mGv.getHeight() / ROW_NUMBER);
 94 
 95         convertView.setLayoutParams(param);
 96         return convertView;
 97     }
 98 
 99     class Holder {
100         ImageView iv;
101         TextView tv;
102     }
103 }

主界面， SimpleGridViewTest.java:spa

  1 package com.dev.jh.juhedidi;
  2 
  3 import android.content.Intent;
  4 import android.os.Bundle;
  5 import android.support.v7.widget.Toolbar;
  6 import android.view.View;
  7 import android.widget.AdapterView;
  8 import android.widget.GridView;
  9 
 10 import com.adapter.MyAdapter;
 11 import com.kepler.jd.login.KeplerApiManager;
 12 import com.model.Picture;
 13 import com.sdu.didi.openapi.DiDiWebActivity;
 14 
 15 import java.util.HashMap;
 16 
 17 import cn.juhe.sdk.JHAppMgr;
 18 
 19 /**
 20  * Created by jihe on 16/8/16.
 21  */
 22 public class SimpleGridViewTest extends BaseActivity implements AdapterView.OnItemClickListener {
 23 
 24     /**
 25      * 京東相關信息
 26      */
 27     public final static String oneDealUrl = "http://union.click.jd.com/jdc?p=AyIOZRprFQoSAlcZWCVGTV8LRGtMR1dGXgVFSR1JUkpJBUkcU0QLTh"
 28             + "9HRwwHXRteFwARGAxeB0gMVQsQDAFBSkVEC0dXZUNTcRFFBEFaakIBR2tOX1RkHUU5XWFuVyIYC00AZFsJXidlDh43VhleHAYSB1UfaxUFF"
 29             + "jdlfSYlVHwHVBpaFAMTBFASaxQyEgJRHV4cBBoFVBNfEjIVNwpPHkFSUFMdRR9AUkw3ZRo%3D&t=W1dCFBBFC14NXAAECUteDEYWRQ5RUFc"
 30             + "ZVRNbEAAQBEpCHklfHEBZXkxPVlpQFkUHGXJTRiNfBUpWSn8QTwc%3D&e=25840255236224";
 31     public final static String listJson = "{\"type\": \"3\",\"blockId\":\"0\"}";//導航頁
 32 
 33 
 34     /**
 35      * 新版界面相關信息：九宮格風格
 36      */
 37     private GridView mGridView;
 38     private String IMAGE_ITEM = "imgage_item";
 39     private String TEXT_ITEM = "text_item";
 40 
 41 
 42     @Override
 43     protected void onCreate(Bundle savedInstanceState) {
 44         super.onCreate(savedInstanceState);
 45         setContentView(R.layout.test_gridview);
 46 　　　　 　
 47         Toolbar toolbar = (Toolbar) findViewById(R.id.grid_view_all_toolbar);
 48         toolbar.setTitle("");
 49 
 50 
 51         mGridView = (GridView) findViewById(R.id.juhe_gridview);
 52 
 53 
 54         MyAdapter saImageItems = new MyAdapter(this, mGridView);
 55 
 56         // 設置GridView的adapter。GridView繼承於AbsListView。
 57         mGridView.setAdapter(saImageItems);
 58         mGridView.setOnItemClickListener(this);
 59     }
 60 
 61     /**
 62      * 重寫點擊事件
 63      * */
 64     @Override
 65     public void onItemClick(AdapterView<?> adapter, View view, int position, long rowid) {
 66 
 67         // 根據元素位置獲取對應的值
 68         Picture textView = (Picture) adapter.getItemAtPosition(position);
 69         String itemText = textView.getTitle();
 70 
 71         //京東商品
 72         if ("京東商品".equals(itemText)) {
 73             //sdk1.3
 74             try {
 75                 JHAppMgr.initialize(this);
 76                 KeplerApiManager.getWebViewService().openNavigationWebViewPage(listJson);
 77             } catch (Exception ex) {
 78                 ex.printStackTrace();
 79             }
 80         }
 81 
 82         //滴滴出行
 83         if ("滴滴出行".equals(itemText)) {
 84             HashMap<String, String> map = new HashMap<String, String>();
 85             map.put("maptype", "wgs84");
 86 
 87             DiDiWebActivity.showDDPage(SimpleGridViewTest.this, map);
 88         }
 89 
 90         //京東優選
 91         if ("京東優選".equals(itemText)) {
 92             JHAppMgr.initialize(this);
 93             // 跳轉到京東
 94             JHAppMgr.getInstance().getJHApi().openJingXunActivity(SimpleGridViewTest.this);
 95         }
 96 
 97         //話費流量
 98         if ("話費流量".equals(itemText)) {
 99             Intent intent = new Intent(this.getApplicationContext(), PhoneActivity.class);
100             startActivity(intent);
101         }
102 
103         //油卡充值
104         if ("油卡充值".equals(itemText)) {
105             Intent intent = new Intent(this.getApplicationContext(), OilActivity.class);
106             startActivity(intent);
107         }
108 
109         //火車票
110         if ("火車票".equals(itemText)) {
111             Intent intent = new Intent(this.getApplicationContext(), TicketActivity.class);
112             startActivity(intent);
113         }
114 
115         //飛機票
116         if ("飛機票".equals(itemText)) {
117             Intent intent = new Intent(this.getApplicationContext(), PlaneTicketActivity.class);
118             startActivity(intent);
119         }
120 
121         //遊戲卡
122         if ("遊戲卡".equals(itemText)) {
123             Intent intent = new Intent(this.getApplicationContext(), GameCardActivity.class);
124             startActivity(intent);
125         }
126 
127         //Q幣
128         if ("Q幣".equals(itemText)) {
129             Intent intent = new Intent(this.getApplicationContext(), QMoneyActivity.class);
130             startActivity(intent);
131         }
132 
133     }
134 }

注：在第一張效果圖中的頂部，加了一個toolbar，在代碼中也有體現，惟一沒有貼出的代碼就是在BaseActivity.java中，能夠在SimpleGridViewTest.java中加上， supportRequestWindowFeature(Window.FEATURE_NO_TITLE);code