gridview九宫图+textview文字+点击事件
时间: 2023-07-31 12:08:35 浏览: 91
要实现GridView九宫图加TextView文字以及点击事件,可以按照以下步骤:
1. 在布局文件中添加GridView控件以及TextView控件,设置相应的属性,如下所示:
```
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<GridView
android:id="@+id/grid_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="3"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:padding="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/grid_view"
android:padding="10dp"
android:text="点击图片查看详情"
android:textSize="18sp"/>
</RelativeLayout>
```
2. 在Activity中获取GridView控件以及TextView控件,并为GridView设置适配器,适配器中设置每个Item的布局以及数据,在布局中添加ImageView和TextView控件,如下所示:
```
public class MainActivity extends AppCompatActivity {
private GridView mGridView;
private TextView mTextView;
private List<GridItem> mDataList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
}
private void initView() {
mGridView = findViewById(R.id.grid_view);
mTextView = findViewById(R.id.text_view);
}
private void initData() {
// 初始化数据
mDataList.add(new GridItem(R.drawable.image1, "图片1"));
mDataList.add(new GridItem(R.drawable.image2, "图片2"));
mDataList.add(new GridItem(R.drawable.image3, "图片3"));
mDataList.add(new GridItem(R.drawable.image4, "图片4"));
mDataList.add(new GridItem(R.drawable.image5, "图片5"));
mDataList.add(new GridItem(R.drawable.image6, "图片6"));
mDataList.add(new GridItem(R.drawable.image7, "图片7"));
mDataList.add(new GridItem(R.drawable.image8, "图片8"));
mDataList.add(new GridItem(R.drawable.image9, "图片9"));
// 设置适配器
mGridView.setAdapter(new GridAdapter(this, mDataList));
// 设置GridView的Item点击事件
mGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
// 处理Item点击事件
Toast.makeText(MainActivity.this, mDataList.get(position).getName(), Toast.LENGTH_SHORT).show();
}
});
}
}
class GridAdapter extends BaseAdapter {
private Context mContext;
private List<GridItem> mDataList;
public GridAdapter(Context context, List<GridItem> dataList) {
mContext = context;
mDataList = dataList;
}
@Override
public int getCount() {
return mDataList.size();
}
@Override
public Object getItem(int position) {
return mDataList.get(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(mContext).inflate(R.layout.grid_item_layout, parent, false);
holder = new ViewHolder();
holder.imageView = convertView.findViewById(R.id.image_view);
holder.textView = convertView.findViewById(R.id.text_view);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
// 设置Item的数据
GridItem item = mDataList.get(position);
holder.imageView.setImageResource(item.getImageId());
holder.textView.setText(item.getName());
return convertView;
}
static class ViewHolder {
ImageView imageView;
TextView textView;
}
}
class GridItem {
private int imageId;
private String name;
public GridItem(int imageId, String name) {
this.imageId = imageId;
this.name = name;
}
public int getImageId() {
return imageId;
}
public void setImageId(int imageId) {
this.imageId = imageId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
```
3. 在布局文件中添加GridItem的布局文件grid_item_layout.xml,如下所示:
```
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:id="@+id/image_view"
android:layout_width="match_parent"
android:layout_height="120dp"
android:scaleType="centerCrop"/>
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="16sp"
android:textColor="@android:color/black"
android:padding="5dp"
android:gravity="center"/>
</LinearLayout>
```
这样就实现了GridView九宫图加TextView文字以及点击事件。
阅读全文