一、GridView概述
GridView是一个以表格形式显示多张图片等组件。它是按照行列的方式来显示内容的,比如实现九宫格图,用GridView是首选。
二、GridView常用属性
属性名称 | 描述 |
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 | 两行之间的间距。
|
三、GridView的使用
1.准备数据源(图片和文字)
2.新建适配器(设置自定义的单元格布局和数据源)
3.GridView加载适配器
4.GridView配置事件监听
Activity代码
public class GridActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_grid); GridView gridView = (GridView) findViewById(R.id.app_gv); //加载适配器 gridView.setAdapter(new GridAdapter(GridActivity.this,initData())); } //数据源准备 private List<AppInfo> initData(){ List<AppInfo> appList = new ArrayList<>(); appList.add(new AppInfo(R.drawable.wx_01,"wx01")); appList.add(new AppInfo(R.drawable.wx_02,"wx01")); appList.add(new AppInfo(R.drawable.wx_03,"wx01")); appList.add(new AppInfo(R.drawable.wx_04,"wx01")); appList.add(new AppInfo(R.drawable.wx_05,"wx01")); return appList; } }
GridView布局代码
<?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/app_gv" android:layout_width="match_parent" android:layout_height="match_parent" android:numColumns="auto_fit" android:columnWidth="90dp" android:stretchMode="columnWidth" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:gravity="center" />
适配器代码
public class GridAdapter extends BaseAdapter { private Context context; private List<AppInfo> appList; private ImageView imageView; private TextView textView; public GridAdapter(Context context,List<AppInfo> appList){ this.context = context; this.appList = appList; } @Override public int getCount() { return appList.size(); } @Override public Object getItem(int position) { return appList.get(position); } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { AppInfo app = appList.get(position); convertView = View.inflate(context, R.layout.item_grid,null); imageView = (ImageView) convertView.findViewById(R.id.appImg); textView = (TextView) convertView.findViewById(R.id.appName); imageView.setImageResource(app.getAppImg()); textView.setText(app.getAppName()); return convertView; } }
单元格布局代码
<?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"> <ImageView android:id="@+id/appImg" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:src="@mipmap/ic_launcher"/> <TextView android:id="@+id/appName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:text="ItemName"/> </LinearLayout>