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