Android 使用RecyclerView实现商品列表

实现步骤:

  1. 创建数据模型 创建一个表示商品的类,例如ProductInfo
  2. 创建适配器 创建一个继承自RecyclerView.Adapter的适配器类,用于处理RecyclerView中的数据和视图
  3. 在主页面布局文件中添加RecyclerView
  4. 创建Item 布局文件
  5. 在你的Activity或Fragment中,初始化RecyclerView和适配器 ,并将数据传递给适配器:

  • 创建数据模型 创建一个表示商品的类,例如ProductInfo
public class ProductInfo {
    private int _id;
    private int product_img;
    private String product_title;
    private String product_style;
    private String product_size;
    private String product_price;

    public ProductInfo(int _id,int product_img, String product_title, String product_style, String product_size, String product_price) {
        this._id = _id;
        this.product_title = product_title;
        this.product_style = product_style;
        this.product_size = product_size;
        this.product_price = product_price;
        this.product_img = product_img;
    }


    public int getProduct_img() {
        return product_img;
    }

    public void setProduct_img(int product_img) {
        this.product_img = product_img;
    }

    public int get_id() {
        return _id;
    }

    public void set_id(int _id) {
        this._id = _id;
    }

    public String getProduct_title() {
        return product_title;
    }

    public void setProduct_title(String product_title) {
        this.product_title = product_title;
    }

    public String getProduct_style() {
        return product_style;
    }

    public void setProduct_style(String product_style) {
        this.product_style = product_style;
    }

    public String getProduct_size() {
        return product_size;
    }

    public void setProduct_size(String product_size) {
        this.product_size = product_size;
    }

    public String getProduct_price() {
        return product_price;
    }

    public void setProduct_price(String product_price) {
        this.product_price = product_price;
    }
}
  • 创建适配器 创建一个继承自RecyclerView.Adapter的适配器类,用于处理RecyclerView中的数据和视图
public class ProductListAdapter extends RecyclerView.Adapter<ProductListAdapter.MyHolder> {
    private List<ProductInfo> mProductInfos =new ArrayList<>();

    public ProductListAdapter(List<ProductInfo> list){
        this.mProductInfos =list;

    }


    @NonNull
    @Override
    public MyHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.product_item, null);
        return new MyHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull MyHolder holder, int position) {
        //绑定数据
        ProductInfo productInfo = mProductInfos.get(position);

        //设置数据
        holder.tv_title.setText(productInfo.getProduct_title());
        holder.tv_style.setText("风格:"+productInfo.getProduct_style());
        holder.tv_size.setText("尺寸:"+productInfo.getProduct_size());
        holder.tv_price.setText("¥ "+ productInfo.getProduct_price());
        holder.img_product.setImageResource(productInfo.getProduct_img());

    }

    @Override
    public int getItemCount() {
        return mProductInfos.size();
    }

    static class MyHolder extends RecyclerView.ViewHolder{
         TextView tv_title;
         TextView tv_style;
         TextView tv_size;
         TextView tv_price;
         ImageView img_product;
         
        public MyHolder(@NonNull View itemView) {
            super(itemView);
            //初始化控件
            tv_title =itemView.findViewById(R.id.tv_title);
            tv_style =itemView.findViewById(R.id.tv_style);
            tv_size =itemView.findViewById(R.id.tv_size);
            tv_price =itemView.findViewById(R.id.tv_price);
            img_product =itemView.findViewById(R.id.img_product);

        }
    }
}
  • 在主页面布局文件中添加RecyclerView
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat 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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".activity.ProductActivity">


    <androidx.appcompat.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/teal_200"
        app:title="商品列表"
        app:titleTextColor="@color/white" />



    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        tools:listitem="@layout/product_item"
        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
        android:layout_height="match_parent"/>



</androidx.appcompat.widget.LinearLayoutCompat>
  • 创建Item 布局文件
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <androidx.appcompat.widget.LinearLayoutCompat
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp">

        <ImageView
            android:id="@+id/img_product"
            android:layout_width="90dp"
            android:layout_height="110dp"
            android:scaleType="centerCrop"
            android:src="@mipmap/img_product_1" />


        <androidx.appcompat.widget.LinearLayoutCompat
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="10dp"
            android:orientation="vertical">

            <TextView
                android:id="@+id/tv_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:text="First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣"
                android:textColor="#333333"
                android:textStyle="bold" />


            <TextView
                android:id="@+id/tv_style"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="风格: 韩版"
                android:textSize="12dp" />


            <TextView
                android:id="@+id/tv_size"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="6dp"
                android:text="尺寸: M"
                android:textSize="12dp" />


            <TextView
                android:id="@+id/tv_price"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="¥180.90"
                android:textColor="#E53935"
                android:textSize="17dp" />


        </androidx.appcompat.widget.LinearLayoutCompat>


    </androidx.appcompat.widget.LinearLayoutCompat>

</androidx.appcompat.widget.LinearLayoutCompat>
  • 在你的Activity或Fragment中,初始化RecyclerView和适配器 ,并将数据传递给适配器:
public class ProductActivity extends AppCompatActivity {
    private RecyclerView recyclerView;
    private List<ProductInfo> mProductInfoList = new ArrayList<>();
    private ProductListAdapter productListAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_product);
        //初始化控件
        recyclerView = findViewById(R.id.recyclerView);
        //模拟数据
         mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.img_product_1,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));
        mProductInfoList.add(new ProductInfo(0,R.mipmap.ic_launcher,"First Ring 灰色/棕色V领修身针织马甲背心复古叠穿百搭马夹上衣","韩版","M","180.90"));

        //创建适配器
        productListAdapter = new ProductListAdapter(mProductInfoList);
        //设置适配器
        recyclerView.setAdapter(productListAdapter);
        //如果不在xml中设置app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager",就需要在代码中设置
//        recyclerView.setLayoutManager(new LinearLayoutManager(ProductActivity.this));
    }
}
  • 效果图

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/623890.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Vue3实战笔记(19)—封装菜单组件

文章目录 前言一、封装左侧菜单导航组件二、使用步骤三、小彩蛋总结 前言 在Vue 3中封装一个左侧导航菜单组件是一项提升项目结构清晰度和代码可复用性的关键任务。这个过程不仅涉及组件的设计与实现&#xff0c;还需考虑其灵活性、易用性以及与Vue 3新特性的紧密结合。以下是…

yarn 安装以及报错处理

前一种报错是由于没有安装yarn导致的&#xff0c;使用以下命令即可安装&#xff1a; npm install -g yarn 如果成功安装&#xff0c;将显示Yarn的版本号。 yarn --version 第二种报错是因为系统上的执行策略限制导致的。执行策略是一种安全功能&#xff0c;用于控制在计算机…

案例分享 I 千视协助Lentia City 购物中心实现轻量化、数字化转型

随着文娱活动的日益复苏&#xff0c;Lentia City作为奥地利最受欢迎的社交和文化聚集地之一&#xff0c;正逐渐成为人们追逐乐趣和交流的热门去处。这里丰富多彩的音乐表演和活动吸引着大量人群&#xff0c;为城市注入了生机和活力。 这些活动不仅仅是简单的娱乐&#xff0c;它…

IT行业的现状与未来发展趋势

目录 前言1. 当前IT行业的技术革新1.1 量子计算1.2 虚拟现实&#xff08;VR&#xff09;和增强现实&#xff08;AR&#xff09; 2. 新兴技术在不同行业中的应用前景2.1 云计算和大数据2.2 物联网&#xff08;IoT&#xff09;和5G通信2.3 区块链 3. 新兴技术对教育体系的挑战和机…

5分钟用 Python 写一个软件,快速入门 PySimpleGUI

大家好&#xff0c;很多人都想写一个自己的桌面程序&#xff0c;那么PySimpleGUI 是一个非常好的选择&#xff0c;它旨在简化 GUI&#xff08;图形用户界面&#xff09;的创建过程。它基于几种流行的 Python GUI 库&#xff0c;如 tkinter、Qt、WxPython 和 Remi&#xff0c;但…

Hive的join操作

假设有三张表&#xff0c;结构和数据如下&#xff1a;-- 创建表 test_a,test_b,test_c CREATE TABLE test_a( id int, name string ) ROW FORMAT DELIMITED FIELDS TERMINATED BY \t;--分别导入数据到三个表中 --test_a 1 a1 2 a2 4 a4 --test_b 1 b1 3 b3 4 b4 --…

探索ISP静态:网络连接的稳定基石

在数字化时代的浪潮中&#xff0c;互联网已成为我们生活、工作、学习不可或缺的一部分。而网络连接的质量&#xff0c;直接决定了我们在线体验的好坏。在众多网络连接技术中&#xff0c;“ISP静态”作为一种稳定、可靠的网络连接方式&#xff0c;越来越受到广大用户的青睐。本文…

Visual Studio 2022专业版安装步骤

Visual studio下载 首先进入下载官网,下载2022专业版 我勾选了以下几个和c#开发有关的&#xff0c;后面缺什么还可以再安装所有以少勾了问题也不大 然后改一下安装位置,点击安装 专业版秘钥激活 打开设置选择帮助,注册vs 专业版密钥: TD244-P4NB7-YQ6XK-Y8MMM-YWV2J

翻译《The Old New Thing》- Taxes: Remote Desktop Connection and painting

Taxes: Remote Desktop Connection and painting - The Old New Thinghttps://devblogs.microsoft.com/oldnewthing/20060103-12/?p32793 Raymond Chen 2006年01月03日 开发成本&#xff1a;远程桌面连接和绘制 当用户通过远程桌面连接进行连接时&#xff0c;视频操作会通过网…

基于51单片机的倒计时系统

基于51单片机的倒计时设计 &#xff08;仿真&#xff0b;程序&#xff0b;设计报告&#xff09; 功能介绍 具体功能&#xff1a; 1.六位LED显示&#xff0c;从59分59秒99开始倒计时&#xff1b; 2.倒计时精度为0.01秒&#xff0c;能正确地进行倒计时&#xff1b; 3.复位后…

安装adobe系列,提示错误代码146解决办法

安装Adobe系列产品如PS、PR、Lrc等产品时&#xff0c;会因为各种各样的错误导致安装失败&#xff01;今天小编为大家带来的是安装adobe系列&#xff0c;提示错误代码146解决办法&#xff0c;收藏起来吧&#xff01; 方法一&#xff1a;就是传说中的万能大法&#xff0c;关机重启…

OpenAI 震撼发布:GPT-4o免费,实时语音视频交互开启新纪元

OpenAI 震撼发布&#xff1a;GPT-4o免费&#xff0c;实时语音视频交互开启新纪元 在仅仅问世17个月后&#xff0c;OpenAI 研制出了仿佛科幻片中登场的超级人工智能——GPT-4o&#xff0c;而且所有人都可以完全免费使用&#xff0c;让这个科技界的巨浪让人震撼无比&#xff01;…

【CSP CCF记录】202009-1 称检测点查询

题目 过程 难点&#xff1a;编号和位置的一一对应&#xff0c;不同位置的距离可能相等。 所以使用一个结构体记录不同检测点的编号和到居民地的距离。 sort函数进行排序。Sort函数使用方法 参考&#xff1a;http://t.csdnimg.cn/Y0Hpi 代码 #include <bits/stdc.h>…

大华智能物联综合管理平台 fastjson反序列化漏洞

文章目录 免责声明漏洞描述漏洞原理影响版本漏洞复现修复建议 免责声明 本文章仅供学习与交流&#xff0c;请勿用于非法用途&#xff0c;均由使用者本人负责&#xff0c;文章作者不为此承担任何责任 漏洞描述 大华智慧园区综合管理平台是一个集智能化、信息化、网络化、安全…

JavaEE初阶-多线程进阶2

文章目录 前言一、CAS1.1 CAS的概念1.2 原子类1.3 CAS的ABA问题 二、JUC中常用类2.1 Callable接口2.2 ReentrantLock&#xff08;可重入&#xff09;2.3 Semaphore信号量2.4 CountDownLatch类2.5 CopyOnWriteArrayList类2.6 ConcurrentHashMap 前言 对于多线程进阶的部分&…

大型语言模型自我进化综述

24年4月来自北大的论文“A Survey on Self-Evolution of Large Language Models”。 大语言模型&#xff08;LLM&#xff09;在各个领域和智体应用中取得了显着的进步。 然而&#xff0c;目前从人类或外部模型监督中学习的LLM成本高昂&#xff0c;并且随着任务复杂性和多样性的…

嵌入式学习第三十三天!(二叉树)

1. 树的概念&#xff1a; 1. 树&#xff1a;由n个结点组成的有限集&#xff0c;有且只有一个根结点&#xff08;由根结点可以访问后继结点&#xff09;&#xff0c;其他结点只有一个前驱结点&#xff0c;但可以有多个后继结点&#xff08;一对多&#xff09;。当n 0时&#xf…

unordered_map 和 unordered_set

unordered —— 无序的&#xff0c;从表面上来看&#xff0c;与 map 和 set 不同之处就在于&#xff0c;unordered_map 和 unordered_set 无法保证插入数据是有序的&#xff1b; 尽管如此&#xff0c;由于这两种容器内部封装了“哈希桶”&#xff0c;可以实现快速查找数据 ——…

EE trade:投资贵金属的技巧

投资贵金属&#xff0c;特别是流行的黄金和白银&#xff0c;需要一个明智的策略和一些重要的技巧。以下是一些有用的投资技巧&#xff1a; 进行市场研究&#xff1a;在投资前了解市场运行机制、价格波动因素以及可能影响市场的宏观经济指标。 理解供需关系&#xff1a;贵金属…

历史影像的下载办法总结

最近想要下黄河口的历史影像&#xff0c;试验了几个办法&#xff1a; 1&#xff09;参考文献1中的办法&#xff0c;用Global Mapper下载World Imagery Wayback网站的历史数据&#xff0c;能下载从2014年至现在的&#xff1b; 2&#xff09;参考文献1中的办法&#xff0c;用SA…