最近做一個專案時遇到一點問題，在這裡分享一下解決思路。

首先看效果圖：

這裡的需求是實現介面中的六個圖示，博主後來和同事討論過這個問題，用 GridView 實現費時費力好嘛，同事認為做6個 Button 就

好了，可能博主就愛鑽牛角尖吧，一開始認為怎麼辦只要還有辦法那就按自己想的去做出來，好了不多廢話了，下面來講思路。

首先是分割線的問題，我們都知道 ListView 中有

分割線顏色  
android:divider="#FFFFFF"
分割線高度
android:dividerHeight="1px"

通過這兩個屬性可以輕鬆給 ListView 新增分隔線，於是博主也查了查文件，發現 GridView 中沒有類似的屬性，那怎麼辦好呢，繼續

翻翻文件吧，發現在 GriView 中有這兩個屬性：

垂直間距
android:verticalSpacing="10dp"
水平間距
android:horizontalSpacing="10dp"

那麼想法就來了，用一個 LinearLayout 佈局包裹 GridView ，將 LinearLayout 的背景色設為分隔線的顏色，然後給GridView 設定垂

直和水平間距，那麼不就達到分隔線的效果了嘛，那說幹就幹，首先是 GridView 佈局檔案：

    <LinearLayout
        android:id="@+id/gridViewLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/color3"
        android:orientation="vertical">

        <GridView
            android:id="@+id/gridView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:horizontalSpacing="1dp"
            android:listSelector="@android:color/transparent"
            android:numColumns="3"
            android:stretchMode="columnWidth"
            android:verticalSpacing="1dp" />

    </LinearLayout>
 

然後是 item 的佈局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    android:background="@color/color1">

    <ImageView
        android:id="@+id/image"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:adjustViewBounds="true"
        android:scaleType="fitXY" />

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="3dp"
        android:textColor="@color/color2"
        android:textSize="13sp" />

</LinearLayout>
 

接下來是介面卡：

public class GridAdapter extends BaseAdapter {

    private Context context = null;
    private int[] image;
    private String[] text;

    public GridAdapter(Context context, int[] image, String[] text) {
        this.context = context;
        this.image = image;
        this.text = text;
    }

    @Override
    public int getCount() {
        return image.length;
    }

    @Override
    public Object getItem(int position) {
        return position;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        final ViewHolder viewHolder;
        if (convertView == null) {
            viewHolder = new ViewHolder();
            convertView = LayoutInflater.from(context).inflate(R.layout.gridview_item, parent, false);
            viewHolder.imageView = (ImageView) convertView.findViewById(R.id.image);
            viewHolder.textView = (TextView) convertView.findViewById(R.id.text);
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
        }
        viewHolder.imageView.setImageResource(image[position]);
        viewHolder.textView.setText(text[position]);
        return convertView;
    }

    public class ViewHolder {
        ImageView imageView;
        TextView textView;
    }
}

GridView 的高度並沒有填充整個 LinearLayout ，可以看到下面灰色的空白處都是LinearLayout 的空間，而 GridView 只是剛剛好包

裹了內容。於是想了想，是不是因為載入介面卡的時候，item 的屬性被重畫了，那就先試試在介面卡中動態設定 item 的高度看看，

於是在 item 載入後新增如下的程式碼，同時在構造器中將 LinearLayout 傳入：

convertView.setLayoutParams(new AbsListView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                    gridViewLayout.getHeight() / 2));

第一個 item 去哪裡了，就這樣被吃掉了嘛，查了查資料，說是 GridView 在繪畫時是根據第一個 item 定位其餘 item 的，動態設定

item 高度，會導致第一個 item 丟失。解決方法呢，其實也不難，如果湊巧你可能還不會發現這個問題。方法是不要用ViewHolder 寫

法，刪除 item 佈局，改成每次 getView 時建立新的 View 。

修改後程式碼如下：

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        LinearLayout item = new LinearLayout(context);
        item.setLayoutParams(new AbsListView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                gridViewLayout.getHeight() / (image.length / COL_NUMBER)));
        item.setOrientation(LinearLayout.VERTICAL);
        item.setBackgroundColor(ContextCompat.getColor(context, R.color.color1));
        item.setGravity(Gravity.CENTER);

        ImageView imageView = new ImageView(context);
        imageView.setLayoutParams(new AbsListView.LayoutParams(120, 120));
        imageView.setAdjustViewBounds(true);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        imageView.setImageResource(image[position]);
        item.addView(imageView);

        TextView textView = new TextView(context);
        LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT);
        lp.setMargins(0, 15, 0, 0);
        textView.setLayoutParams(lp);
        textView.setTextSize(13);
        textView.setTextColor(ContextCompat.getColor(context, R.color.color2));
        textView.setText(text[position]);
        item.addView(textView);

        return item;
    }

到這裡總算是大功告成了：

這邊經別人提點，還有一種解決方法，不需要每次 new 一個 View ，依然採用 ViewHolder 寫法：

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        final ViewHolder viewHolder;
        if (convertView == null) {
            Log.i("convertView","null");
            viewHolder = new ViewHolder();
            convertView = LayoutInflater.from(context).inflate(R.layout.gridview_item, parent, false);
            convertView.setLayoutParams(new AbsListView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                    gridViewLayout.getHeight() / 2));
            viewHolder.imageView = (ImageView) convertView.findViewById(R.id.image);
            viewHolder.textView = (TextView) convertView.findViewById(R.id.text);
            convertView.setTag(viewHolder);
        } else {
            Log.i("convertView","not null");
            convertView.setLayoutParams(new AbsListView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                    gridViewLayout.getHeight() / 2));
            viewHolder = (ViewHolder) convertView.getTag();
        }
        viewHolder.imageView.setImageResource(image[position]);
        viewHolder.textView.setText(text[position]);
        return convertView;
    }

但是這裡博主也不是很明白，第一次已經為 convertView 設定了 LayoutParams ，在後面 LayoutParams 的資訊就丟失了，控制檯打

印的資訊如下：

10-30 15:42:23.387 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.407 4158-4158/com.liuwan.mydesign.activity I/convertView: not null
10-30 15:42:23.450 4158-4158/com.liuwan.mydesign.activity I/convertView: not null
10-30 15:42:23.452 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.465 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.475 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.489 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.502 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.515 4158-4158/com.liuwan.mydesign.activity I/convertView: null
10-30 15:42:23.520 4158-4158/com.liuwan.mydesign.activity I/convertView: not null
10-30 15:42:23.666 4158-4158/com.liuwan.mydesign.activity I/convertView: not null
10-30 15:42:23.674 4158-4158/com.liuwan.mydesign.activity I/convertView: not null

解答。

最後，博主還是想說一下，這個問題前前後後花了我兩個小時解決，要是用 Button 就是幾分鐘的事，但是我覺得值得，我多學會了

一種設計思路，以後遇到更復雜的設計，以至於 Button 不能解決的時候，那麼收效就有了。

原始碼下載