Android 控件GridView的使用

GridView

在安卓开发中如果是列表的形式（单列多行形式）则使用ListView，如果是多行多列网状形式的则优先使用GridView。

简介

GridView(网格视图)是按照行列的方式来显示内容的，一般用于显示图片，图片等内容，比如实现九宫格图，用GridView是首选，也是最简单的。主要用于设置Adapter。

GridView常用的XML属性：
 

属性名称	描述
android:columnWidth	设置列的宽度。
android:gravity	设置此组件中的内容在组件中的位置。可选的值有：top、bottom、left、right、center_vertical、fill_vertical、center_horizontal、fill_horizontal、center、fill、clip_vertical可以多选，用“|”分开。
android:horizontalSpacing	两列之间的间距。
android:numColumns	设置列数。
android:stretchMode	缩放模式。
android:verticalSpacing	两行之间的间距。

实现效果

效果实现过程：三行三列，每一小格显示一张图片和一个文本框显示内容

主布局Activity_main.XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <GridView

        android:id="@+id/mygrid"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:horizontalSpacing="10dp"//列之间的距离
        android:numColumns="3"//指定列数
        android:verticalSpacing="10dp"//行之间的距离
    >

    </GridView>


</LinearLayout>

每一小格显示内容的XML（这里是gg.xml）布局

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


    <ImageView
        android:id="@+id/ima"
        android:layout_width="40dp"
        android:layout_height="40dp" />

    <TextView
        android:id="@+id/te"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center" />


</LinearLayout>

Java代码

package com.contentprovide.liuliu.gg;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.TextView;

import com.squareup.picasso.Picasso;

public class MainActivity extends AppCompatActivity {
    GridView mygrid;
    String ss[] = {"丑八怪", "丑八怪", "丑八怪", "丑八怪", "丑八怪", "丑八怪", "丑八怪", "丑八怪", "丑八怪"};
    String url[] = {"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515660988987&di=b9ae17ac1359c69aeebb9c8c36978505&imgtype=0&src=http%3A%2F%2Fpic21.photophoto.cn%2F20111213%2F0039038644865585_b.jpg",
            "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515661089422&di=009d5fef082c415433f11a55993fa66c&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimage%2Fc0%253Dshijue1%252C0%252C0%252C294%252C40%2Fsign%3Dc46d33efb8119313d34ef7f30d5166a2%2Fb17eca8065380cd7060d5fc0ab44ad3459828188.jpg",
            "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515661089422&di=f192dbc90776d9a72e521e04c452d6c8&imgtype=0&src=http%3A%2F%2Fpic27.nipic.com%2F20130305%2F668573_103326330156_2.jpg",
            "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515661089422&di=20ce7a986e67ca201885aa18d5ec3a7d&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimage%2Fc0%253Dpixel_huitu%252C0%252C0%252C294%252C40%2Fsign%3D1d39feb8c01349546a13e0243f36f734%2Fc83d70cf3bc79f3dbb3aa209b1a1cd11728b292b.jpg",
            "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515661089422&di=44b4dceefaf6321832a20e3fdb9f989b&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01b05955499b850000019ae960554b.jpg",
            "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1515661089422&di=5e566f01a694c856b16b6e850781ac55&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimage%2Fc0%253Dshijue1%252C0%252C0%252C294%252C40%2Fsign%3Dabb5bafdab44ad343ab28fc4b8cb6681%2F5882b2b7d0a20cf40b3be6cf7c094b36acaf9972.jpg"
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mygrid = (GridView) findViewById(R.id.mygrid);

        MyAdapter myAdapter = new MyAdapter();
        mygrid.setAdapter(myAdapter);


    }


//　　自定义适配器
    class MyAdapter extends BaseAdapter {

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

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

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

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {
            Myholeder myholeder;

            if (view == null) {
                view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.gg, null);
                myholeder = new Myholeder();

                myholeder.ima = view.findViewById(R.id.ima);
                myholeder.te = view.findViewById(R.id.te);

                view.setTag(myholeder);

            } else {
                myholeder = (Myholeder) view.getTag();
            }
            for (int a = 0; a < url.length; a++) {
                Picasso.with(getApplicationContext()).load(url[a]).into(myholeder.ima);//使用毕加索包引用网络资源图片
                myholeder.te.setText(ss[a]);
            }

            return view;
        }


        class Myholeder {
            ImageView ima;
            TextView te;
        }


    }


}

 

 这里使用毕加索包引用网络资源图片给指定的控件需要导入picasso.jar　　链接:https://pan.baidu.com/s/1kVXgFqf 密码:1src