Android零基礎入門第45節：GridView簡單使用

標籤：大全   list   dap   items   相關   toc   textview   .com   private   

   前面一共用了8期來學習ListView列表的相關操作，其實學習的ListView的知識完全適用於AdapterView的其他子類，如GridView、Spinner、AutoCompleteTextView等組件，那麼接下來分別來學習一下這些列表組件，本期先學習GridView的使用。

 

 

一、認識GridView

 

    前面學的ListView是列表， 這裡的GridView就是顯示網格，用於在介面上按行、列分布的方式來顯示多個組件。

    GridView 和 ListView 有共同的父類：AbsListView，因此 GridView和ListView具有很高的相似性，它們都是清單項目。GridView與ListView的唯一區別在於：ListView只顯示一列；而GridView可以顯示多列。從這個角度來看，ListView相當於一種特殊的GridView，如果讓 GridView只顯示一列，那麼該GridView就變成了 ListView。 與ListView類似的是，GridView也需要通過Adapter來提供顯示的資料：開發人員可以採用上面介紹的幾種方式中的任意一種來建立Adapter。不管使用哪種方式，GridView與ListView 的用法是基本一致的。 

    GridView提供的常用XML屬性及相關方法如下表所示。

    上表中android:stretchMode屬性支援如下幾個屬性值。

• NO_STRETCH：不展開。

• STRETCH_SPACING:僅展開元素之間的間距。

• STRETCH_SPACING_UNIFORM：表格元素本身、元素之間的間距一起展開。

• STRETCH_COLUMN_WIDTH：僅展開表格元素本身。

    另外需要注意的是使用GridView時一般都應該指定numColumns大於1；否則該屬性的預設值為1。如果將該屬性設為1，則意味著該GridView只有一列，那麼GridView 就變成了 ListView。

 

 

二、GridView樣本

 

    接下來通過一個簡單的樣本程式來學習GridView的使用方法。

    繼續使用WidgetSample工程的listviewsample模組，在app/main/res/layout/目錄下建立gridview_layout.xml檔案，在其中填充如下程式碼片段：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:orientation="vertical"              android:layout_width="match_parent"              android:layout_height="match_parent"              android:gravity="center_horizontal">    <!-- 定義一個GridView組件 -->    <GridView        android:id="@+id/gridview"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:horizontalSpacing="1dp"        android:verticalSpacing="1dp"        android:numColumns="4"        android:gravity="center"/></LinearLayout>

    定義GridView時指定了 android:numColumns="4"，這意味著該網格包含4列。該GridView包含的行是動態改變的——正如ListView到底包含多少行是由該ListView對應的Adapter所決定的，GridView到底包含多少行也是由Adapter決定的。

    在res/layout/目錄下建立一個gridview_item.xml的清單項目布局檔案，其代碼如下：

<?xml version="1.0" encoding="UTF-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:layout_width="match_parent"              android:layout_height="match_parent"              android:gravity="center_horizontal"              android:orientation="vertical"              android:padding="5dp" >    <ImageView        android:id="@+id/icon_img"        android:layout_width="48dp"        android:layout_height="48dp" />    <TextView        android:id="@+id/name_tv"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"/></LinearLayout>

    接下來為GridView提供Adapter，具體實現方式有多種，這裡使用SimpleAdapter決定GridView所要顯示的內容。建立GridViewActivity.java檔案，載入上面建立的布局檔案，具體代碼如下：

package com.jinyu.cqkxzsxy.android.listviewsample;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.view.View;import android.widget.AdapterView;import android.widget.GridView;import android.widget.SimpleAdapter;import android.widget.Toast;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;public class GridViewActivity extends AppCompatActivity {    private GridView mAppGridView = null;    // 應用表徵圖    private int[] mAppIcons = {            R.drawable.app_1, R.drawable.app_2, R.drawable.app_3,            R.drawable.app_4, R.drawable.app_5, R.drawable.app_6,            R.drawable.app_7, R.drawable.app_8, R.drawable.app_9    };    // 應用程式名稱    private String[] mAppNames = {            "魔法棒", "點贊社群", "購物街區","螞蟻社區","鑫鱻地圖",            "鑫鱻訊息", "房品彙","商城","模型盒子"    };    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.gridview_layout);        // 擷取介面組件        mAppGridView = (GridView) findViewById(R.id.gridview);        // 初始化資料，建立一個List對象，List對象的元素是Map        List<Map<String, Object>> listItems =                new ArrayList<Map<String, Object>>();        for (int i = 0; i < mAppIcons.length; i++) {            Map<String, Object> listItem = new HashMap<String, Object>();            listItem.put("icon", mAppIcons[i]);            listItem.put("name",mAppNames[i]);            listItems.add(listItem);        }        // 建立一個SimpleAdapter        SimpleAdapter simpleAdapter = new SimpleAdapter(this,                listItems,                R.layout.gridview_item,                new String[]{"icon", "name"},                new int[]{R.id.icon_img, R.id.name_tv});        // 為GridView設定Adapter        mAppGridView.setAdapter(simpleAdapter);        // 添加清單項目被單擊的監聽器        mAppGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {            @Override            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {                // 顯示被單擊的圖片                Toast.makeText(GridViewActivity.this, mAppNames[position],                        Toast.LENGTH_SHORT).show();            }        });    }}

    上面的程式同樣使用了 SimpleAdapter對象作為GridView的Adapter，這個SimpleAdapter底層保證了一個長度為9的List集合這意味著該GridView —共需要顯示9個組件，GridView總共有4 列，因此該GridView —共包含3行。

    修改程式啟動的Activity，運行程式，可以看到左側所示介面效果。

    單擊介面中的表徵圖，可以看到訊息提示，如右側所示。

    至此，GridView的簡單使用學習完畢，更多屬性和方法建議多加練習並掌握。

 

 

    今天就先到這裡，如果有問題歡迎留言一起探討，也歡迎加入Android零基礎入門技術討論群，共同成長！

   此文章著作權為公眾號分享達人秀（ShareExpert）——鑫鱻所有，若需轉載請聯絡作者授權，特此聲明！

 

往期總結分享：

Android零基礎入門第1節：Android的前世今生

Android零基礎入門第2節：Android 系統架構和應用組件那些事

Android零基礎入門第3節：帶你一起來聊一聊Android開發環境

Android零基礎入門第4節：正確安裝和配置JDK, 高富帥養成第一招

Android零基礎入門第5節：善用ADT Bundle, 輕鬆邂逅女神

Android零基礎入門第6節：配置最佳化SDK Manager, 正式約會女神

Android零基礎入門第7節：搞定Android模擬器，開啟甜蜜之旅

Android零基礎入門第8節：HelloWorld，我的第一趟旅程出發點

Android零基礎入門第9節：Android應用實戰，不懂代碼也可以開發

Android零基礎入門第10節：開發IDE大升級，終於迎來了Android Studio

Android零基礎入門第11節：簡單幾步帶你飛，運行Android Studio工程

Android零基礎入門第12節：熟悉Android Studio介面，開始裝逼賣萌

Android零基礎入門第13節：Android Studio配置最佳化，打造開發利器

Android零基礎入門第14節：使用高速Genymotion，跨入火箭時代

Android零基礎入門第15節：掌握Android Studio項目結構，揚帆起航

Android零基礎入門第16節：Android使用者介面開發概述

Android零基礎入門第17節：TextView屬性和方法大全

Android零基礎入門第18節：EditText的屬性和使用方法

Android零基礎入門第19節：Button使用詳解

Android零基礎入門第20節：CheckBox和RadioButton使用大全

Android零基礎入門第21節：ToggleButton和Switch使用大全

Android零基礎入門第22節：ImageView的屬性和方法大全

Android零基礎入門第23節：ImageButton和ZoomButton使用大全

Android零基礎入門第24節：自訂View簡單使用，打造屬於你的控制項

Android零基礎入門第25節：簡單且最常用的LinearLayout線性布局

Android零基礎入門第26節：兩種對齊，layout_gravity和gravity大不同

Android零基礎入門第27節：正確使用padding和margin

Android零基礎入門第28節：輕鬆掌握RelativeLayout相對布局

Android零基礎入門第29節：善用TableLayout表格版面配置

Android零基礎入門第30節：兩分鐘掌握FrameLayout幀布局

Android零基礎入門第31節：少用的AbsoluteLayout絕對布局

Android零基礎入門第32節：新推出的GridLayout網格布局

Android零基礎入門第33節：Android事件處理概述

Android零基礎入門第34節：Android中基於監聽的事件處理

Android零基礎入門第35節：Android中基於回調的事件處理

Android零基礎入門第36節：Android系統事件的處理

Android零基礎入門第37節：初識ListView

Android零基礎入門第38節：初識Adapter

Android零基礎入門第39節：ListActivity和自訂欄表項

Android零基礎入門第40節：自訂ArrayAdapter

Android零基礎入門第41節：使用SimpleAdapter

Android零基礎入門第42節：自訂BaseAdapter

Android零基礎入門第43節：ListView最佳化和列表首尾使用

Android零基礎入門第44節：ListView資料動態更新

Android零基礎入門第45節：GridView簡單使用