android之GridView實現九宮格布局

效果圖：

　　　　

 

代碼如下：

MyGridView.java

/**
 * 自定義GridView 解決在scrollview中只顯示第一行數據的問題
 * Created by Spring on 2015/11/28.
 */
public class MyGridView extends GridView {
    public MyGridView(Context context) {
        super(context);
    }

    public MyGridView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyGridView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    /**
     * 這兩個參數指明控件可獲得的空間以及關於這個空間描述的元數據.
     * @param widthMeasureSpec 此控件獲得的寬度
     * @param heightMeasureSpec 此控件獲得的高度
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        /**
         * >> 表示右移 ，如：int i=15; i>>2的結果是3，移出的部分將被拋棄。
         *轉為二進制的形式可能更好理解，0000 1111(15)右移2位的結果是0000 0011(3)，0001 1010(18)右移3位的結果是0000 0011(3)。
         *
         * 最大模式（MeasureSpec.AT_MOST）
           這個也就是父組件，能夠給出的最大的空間，當前組件的長或寬最大只能為這么大，當然也可以比這個小。

         MeasureSpec.AT_MOST是最大尺寸，當控件的layout_width或layout_height指定為WRAP_CONTENT時，
         控件大小一般隨着控件的子空間或內容進行變化，此時控件尺寸只要不超過父控件允許的最大尺寸即可。
         因此，此時的mode是AT_MOST，size給出了父控件允許的最大尺寸。


         static int makeMeasureSpec(int size,int mode):根據提供的大小值和模式創建一個測量值(格式)
         */
        int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2 ,MeasureSpec.AT_MOST);
        super.onMeasure(widthMeasureSpec, expandSpec);

    }
}

 

MyGridViewAdapter.java

/**
 * 自定義Adapter
 * Created by Spring on 2015/11/28.
 */
public class MyGridViewAdapter extends BaseAdapter {
    private Context context;
    //12星座圖片
    private int [] imgs = {R.drawable.baiyang,R.drawable.jinniu,R.drawable.shuangzi,
            R.drawable.juxie,R.drawable.shizi,R.drawable.chunv,R.drawable.tiancheng,
            R.drawable.tianxie,R.drawable.sheshou,R.drawable.mojie,R.drawable.shuipin,
            R.drawable.shuangyu
    };

    //12星座文字
    private  String [] strs = {"白羊座","金牛座","雙子座","巨蟹座","獅子座",
            "處女座","天秤座","天蠍座","射手座","摩羯座","水瓶座","雙魚座",
    };


    public MyGridViewAdapter(Context context) {
        super();
        this.context = context;
    }

    @Override
    public int getCount() {
        return imgs.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) {
        ViewHolder holder;
        if (convertView == null){
            convertView = LayoutInflater.from(context).inflate(R.layout.main_item,parent,false);
            holder = new ViewHolder();
            holder.imageView = (ImageView)convertView.findViewById(R.id.item_img);
            holder.textView = (TextView)convertView.findViewById(R.id.item_txt);
            convertView.setTag(holder);
        }else {
            holder = (ViewHolder)convertView.getTag();
        }
        holder.imageView.setBackgroundResource(imgs[position]);
        holder.textView.setText(strs[position]);

        return convertView;
    }
    class ViewHolder{
        ImageView imageView;
        TextView textView;
    }
}

 

MainActivity.java

public class MainActivity extends AtySupport {
    private final String TAG = "TAG";
    private MyGridView gridView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        gridView = (MyGridView)this.findViewById(R.id.main_gridview);

        gridView.setAdapter(new MyGridViewAdapter(this));

    }


}

 

 

activity_main.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:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@color/title">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:layout_centerInParent="true"
            android:background="@drawable/xuanzhexingzuo"/>

    </RelativeLayout>
    <!-- fillViewport = true 可以解決android布局不能撐滿全屏的問題-->
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true"
        android:scrollbars="none">

        <custom.MyGridView
            android:id="@+id/main_gridview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:horizontalSpacing="0.0dip"
            android:listSelector="@null"
            android:numColumns="3"
            android:scrollbars="none"
            android:stretchMode="columnWidth"
            android:verticalSpacing="0.0dip">

        </custom.MyGridView>

    </ScrollView>


</LinearLayout>

 

main_item.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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="12dp"
        android:layout_gravity="center"
        android:background="@drawable/bg_gridview_item">

    <ImageView
        android:id="@+id/item_img"
        android:layout_width="58dp"
        android:layout_height="58dp"
        android:layout_gravity="center_horizontal"
        />
    <TextView
        android:id="@+id/item_txt"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="2dp"
        android:textSize="14sp"
        android:layout_gravity="center_horizontal"/>
    </LinearLayout>
</LinearLayout>

 

項目資源還未上傳（PS：我還沒寫好呢- -），有不懂的歡迎來詢問~！