Android ListView -- 带图标和文字的Item

8 篇文章 1 订阅
8 篇文章 1 订阅

一、前言

在某些场景下,单一文字的ListView Item已不适合当前需求,因此需要我们自定义Item布局来满足需求。下面我们来实现一个带图标和文字的Item

二、代码展示

  1. 定义包含ListView的布局文件activity_main.xmlActivityonCreate()时加载。

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#FFE4C4"
        tools:context=".MainActivity">
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginBottom="10dp"
            android:background="#E4DDDD">
    
            <ListView
                android:id="@+id/listview"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>
        </LinearLayout>
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    
  2. 定义Item布局文件listview_item.xml,创建SimpleAdapter对象时使用。

    <?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="match_parent"
        android:orientation="horizontal"
        android:background="#F0FFF0">
    
        <ImageView
            android:id="@+id/imageview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_weight="1"/>
    
        <TextView
            android:id="@+id/textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_weight="7"
            android:textColor="#FF6E40"
            android:textSize="24sp"
            android:textStyle="bold" />
    
    
    
    </LinearLayout>
    
    
  3. 完善MainActivity.java代码。

    package com.example.listviewdemo2;
    
    import androidx.appcompat.app.AppCompatActivity;
    
    import android.os.Bundle;
    import android.widget.ListView;
    import android.widget.SimpleAdapter;
    
    import java.util.ArrayList;
    import java.util.HashMap;
    import java.util.List;
    import java.util.Map;
    
    public class MainActivity extends AppCompatActivity {
    
        private ListView mListView = null;
        private List<Map<String, Object>> mListItems = null;
        private Map<String, Object> mMap = null;
    
        private SimpleAdapter mAdapter = null;
    
        /* 图片ID数组 */
        private int[] mImageId = new int[] {R.drawable.num_0, R.drawable.num_1, R.drawable.num_2, R.drawable.num_3, R.drawable.num_4,
                                            R.drawable.num_5, R.drawable.num_6, R.drawable.num_7, R.drawable.num_8, R.drawable.num_9, };
        /* 文字列表数组 */
        private String[] mTitle = new String[] {"数字 0", "数字 1", "数字 2", "数字 3", "数字 4", "数字 5", "数字 6", "数字 7", "数字 8", "数字 9", };
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            init();
        }
    
        private void init() {
            mListView = findViewById(R.id.listview);
    
            mListItems = new ArrayList<>();
            for (int i = 0; i < mImageId.length; i++) {
                mMap = new HashMap<>();
                mMap.put("image", mImageId[i]);
                mMap.put("title", mTitle[i]);
                mListItems.add(mMap);
            }
    
            mAdapter = new SimpleAdapter(this, mListItems, R.layout.listview_item, new String[]{"title", "image"}, new int[]{R.id.textview, R.id.imageview});
            mListView.setAdapter(mAdapter);
        }
    }
    
    

三、运行效果

运行效果如下图:
自定义Item

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值