Android中在自定义适配器中使用多个item展示在ListView中，附带代码实现、框架模板

已于 2024-12-07 10:26:20 修改
阅读量444 收藏 3
点赞数 16
分类专栏： Android 开发 文章标签： android
于 2024-12-06 11:07:03 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/rawmeat/article/details/144284315
版权

          本代码使用的Android版本：android-studio-2024.2.1.11-windows

        本篇文章在上一篇自定义适配器后的续写，实现多个item展示在页面

一、实现效果

         废话不多说，先看效果图：

二、层级信息

三、主要实现和区别

        实现多个item实际上只是在适配器中getView()中，使用了不一样的converview的模板，从而实现在一个ListView展现多个item。

注意：本篇文章的其他item的控件名是一致的。所以如果读者想要绑定其他多出来的控件，请在后面自己额外的绑定。

部分代码如下：

@Override
    public View getView(int position, View convertView, ViewGroup parent) {
        //position是选中的ViewList中list的列中的索引
        //convertView是用于展示在页面中空白item，最后需要返回一个已填充的convertView返回
        //定义一个ViewHolder类
        ViewHolder holder;
        //根据点击获取的list索引寻找对应的Map
        Map<String, Object> product = productData.get(position);
        Log.d("Code", "getView: "+product.get("flag"));
        if (convertView == null) {
            //根据你的flag获取不一样的item创建一个视图
            if(product.get("flag").equals("1")){
                convertView = inflater.inflate(R.layout.item_commodity1, parent, false);
            }else if(product.get("flag").equals("2")){
                convertView = inflater.inflate(R.layout.item_commodity2, parent, false);
            }else{
                convertView = inflater.inflate(R.layout.item_commodity3, parent, false);
            }
            //绑定item中的控件到ViewHolder身上
            //如果你的item的控件名不一致，可以在下面的控件绑定代码中，使用else if再判断一遍flag，根据的flag来绑定你的控件
            holder = new ViewHolder();
            holder.productName = convertView.findViewById(R.id.productName);
            holder.productDescription = convertView.findViewById(R.id.productDescription);
            holder.productImage = convertView.findViewById(R.id.productImage);
            convertView.setTag(holder);
        } else {
            //如果已经存在视图
            holder = (ViewHolder) convertView.getTag();
        }
        //根据Map中的信息，以键找值的形式一一赋值給每一个控件，以做到对控件的数据的填充
        holder.productName.setText((String) product.get("name"));
        holder.productDescription.setText((String) product.get("description"));
        int imageResId = (int) product.get("image"); // 图片资源ID是以整型存储的
        holder.productImage.setImageResource(imageResId);
        return convertView;
    }

四、完整代码

1.Store界面：

页面代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".Store">

    <ListView
        android:id="@+id/listView"
        android:layout_width="409dp"
        android:layout_height="729dp"
        tools:layout_editor_absoluteX="1dp"
        tools:layout_editor_absoluteY="1dp"
        tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>

Java代码：

package com.example.test03;

import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.Toast;
import androidx.activity.EdgeToEdge;
import androidx.appcompat.app.AppCompatActivity;
import com.example.test03.AllAdapter.ProductAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class Store extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_store);
        //获取数据
        List<Map<String, Object>> productData = GetDate();
//        //装配适配器
//        SimpleAdapter adapter = new SimpleAdapter(
//                this, // 上下文
//                productData, // 数据源
//                R.layout.item_commodity, // 自定义布局资源 item
//                new String[]{"name", "description", "image"}, // 数据源中的键数组
//                new int[]{R.id.productName, R.id.productDescription, R.id.productImage} // 布局文件中的视图 ID 数组
//        );
        ProductAdapter productAdapter = new ProductAdapter(this,productData);
        ListView listView = findViewById(R.id.listView);
        listView.setAdapter(productAdapter);
        //如果想要得到效果图中的功能的话，需要为他设置一个监听器，如下
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                // 获取被点击项目的数据
                Map<String, Object> clickedItem = (Map<String, Object>) parent.getItemAtPosition(position);
                String productName = (String) clickedItem.get("name");
                String productDescription = (String) clickedItem.get("description");
                // 在这里处理点击事件，比如显示一个 Toast 消息
                Toast.makeText(Store.this, "你点击了 " + productName + "\n" + productDescription, Toast.LENGTH_LONG).show();
            }
        });
    }

    private List<Map<String, Object>> GetDate() {
        List<Map<String, Object>> productData = new ArrayList<>();
        //根据数据源中的键数组来填充数据
        //new String[]{"name", "description", "image"},
        // 创建巧克力商品数据
        Map<String, Object> chocolate = new HashMap<>();
        chocolate.put("name", "巧克力");
        chocolate.put("description", "好吃的巧克力");
        chocolate.put("image", R.drawable.chocolate);
        chocolate.put("flag", "1");
        productData.add(chocolate);

        // 创建薯片商品数据
        Map<String, Object> chips = new HashMap<>();
        chips.put("name", "薯片");
        chips.put("description", "薯片真好吃");
        chips.put("image", R.drawable.chips);
        chips.put("flag", "2");
        productData.add(chips);

        // 创建饼干商品数据
        Map<String, Object> cookies = new HashMap<>();
        cookies.put("name", "曲奇");
        cookies.put("description", "哪里有曲奇");
        cookies.put("image", R.drawable.cookies);
        cookies.put("flag", "3");
        productData.add(cookies);

        // 可以继续添加更多商品数据...
        return productData;
    }

}
2.ProductAdapter适配器部分
package com.example.test03.AllAdapter;

import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import com.example.test03.R;
import java.util.List;
import java.util.Map;

public class ProductAdapter extends BaseAdapter {
    private Context context;
    private List<Map<String, Object>> productData;
    private LayoutInflater inflater;
    //初始化
    public ProductAdapter(Context context, List<Map<String, Object>> productData) {
        this.context = context;
        this.productData = productData;
        this.inflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        //获取数量
        return productData.size();
    }

    @Override
    public Object getItem(int position) {
        //获取对象
        return productData.get(position);
    }

    @Override
    public long getItemId(int position) {
        //获取Item模板
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        //position是选中的ViewList中list的列中的索引
        //convertView是用于展示在页面中空白item，最后需要返回一个已填充的convertView返回
        //定义一个ViewHolder类
        ViewHolder holder;
        //根据点击获取的list索引寻找对应的Map
        Map<String, Object> product = productData.get(position);
        Log.d("Code", "getView: "+product.get("flag"));
        if (convertView == null) {
            //根据你的flag获取不一样的item创建一个视图
            if(product.get("flag").equals("1")){
                convertView = inflater.inflate(R.layout.item_commodity1, parent, false);
            }else if(product.get("flag").equals("2")){
                convertView = inflater.inflate(R.layout.item_commodity2, parent, false);
            }else{
                convertView = inflater.inflate(R.layout.item_commodity3, parent, false);
            }
            //绑定item中的控件到ViewHolder身上
            holder = new ViewHolder();
            holder.productName = convertView.findViewById(R.id.productName);
            holder.productDescription = convertView.findViewById(R.id.productDescription);
            holder.productImage = convertView.findViewById(R.id.productImage);
            convertView.setTag(holder);
        } else {
            //如果已经存在视图
            holder = (ViewHolder) convertView.getTag();
        }
        //根据Map中的信息，以键找值的形式一一赋值給每一个控件，以做到对控件的数据的填充
        holder.productName.setText((String) product.get("name"));
        holder.productDescription.setText((String) product.get("description"));
        int imageResId = (int) product.get("image"); // 图片资源ID是以整型存储的
        holder.productImage.setImageResource(imageResId);
        return convertView;
    }
    //定义ViewHolder，将item中所有的控件都列一个变量
    private static class ViewHolder {
        TextView productName;
        TextView productDescription;
        ImageView productImage;
    }
}
3.item部件

        item_commodity1:

<?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="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">

    <ImageView
        android:id="@+id/productImage"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/ic_launcher_foreground" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:gravity="center_vertical">

        <TextView
            android:id="@+id/productName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="商品名"
            android:textSize="18sp"
            android:textColor="@android:color/black" />

        <TextView
            android:id="@+id/productDescription"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="描述"
            android:textSize="14sp"
            android:textColor="@android:color/darker_gray" />
    </LinearLayout>
</LinearLayout>

        item_commodity2:

<?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="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:gravity="center_vertical">

        <TextView
            android:id="@+id/productName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="商品名"
            android:textSize="18sp"
            android:textColor="@android:color/black" />

        <ImageView
            android:id="@+id/productImage"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:src="@drawable/ic_launcher_foreground" />

        <TextView
            android:id="@+id/productDescription"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="描述"
            android:textSize="14sp"
            android:textColor="@android:color/darker_gray" />
    </LinearLayout>
</LinearLayout>

        item_commodity3:

<?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="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">

    <ImageView
        android:id="@+id/productImage"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/ic_launcher_foreground" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:gravity="center_vertical">

        <TextView
            android:id="@+id/productName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="商品名"
            android:textColor="@android:color/black"
            android:textSize="18sp" />

    </LinearLayout>

    <TextView
        android:id="@+id/productDescription"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="描述"
        android:textColor="@android:color/darker_gray"
        android:textSize="14sp" />
</LinearLayout>

五、结语

         本账号共为介绍适配器写了4篇文章（包括本文在内），相信你看完这几篇文章，你基本学会了适配器90%的使用了。其余三篇文章链接如下：

Android基础的ListView适配器SimpleAdapter的使用方法，附带可修改模板icon-default.png?t=O83Ahttps://blog.youkuaiyun.com/rawmeat/article/details/144249899?sharetype=blogdetail&sharerId=144249899&sharerefer=PC&sharesource=rawmeat&spm=1011.2480.3001.8118

Android中使用自定义适配器完成对ListView的使用方法，附带可修改模板icon-default.png?t=O83Ahttps://blog.youkuaiyun.com/rawmeat/article/details/144251368?sharetype=blogdetail&sharerId=144251368&sharerefer=PC&sharesource=rawmeat&spm=1011.2480.3001.8118

Android中在适配器中item部分进行监听，并且时时刷新，商品购买为案例icon-default.png?t=O83Ahttps://blog.youkuaiyun.com/rawmeat/article/details/144305330?spm=1001.2014.3001.5501

        本篇文章主要是续写wx页面的部分，制作不易，觉得实用的就点个收藏吧！

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值