如何向ListView控件添加自定义列表？ArrayList绑定ListView显示异常求助

嗨！作为Android新手碰到ListView的这些问题太正常了，我来帮你逐个捋清楚：

要实现自定义列表，你需要按这4步来：

• 步骤1：创建列表项的自定义布局
  新建一个xml文件（比如item_vegetable.xml），设计你想要的单个列表项样式，比如包含图标和名称：

  <?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:padding="12dp"
      android:orientation="horizontal"
      android:gravity="center_vertical">
  
      <ImageView
          android:id="@+id/iv_veg_icon"
          android:layout_width="40dp"
          android:layout_height="40dp"
          android:src="@drawable/ic_veg_default"/>
  
      <TextView
          android:id="@+id/tv_veg_name"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_marginStart="12dp"
          android:textSize="16sp"/>
  </LinearLayout>
  

• 步骤2：定义数据模型类
  用来存储每个列表项的信息，比如蔬菜的名称和图标资源ID：

  public class Vegetable {
      private String name;
      private int iconResId;
  
      public Vegetable(String name, int iconResId) {
          this.name = name;
          this.iconResId = iconResId;
      }
  
      // Getter方法，给Adapter获取数据用
      public String getName() { return name; }
      public int getIconResId() { return iconResId; }
  }
  

• 步骤3：自定义BaseAdapter
  继承BaseAdapter，实现视图复用和数据绑定，这是连接数据和ListView的核心：

  public class VegAdapter extends BaseAdapter {
      private Context mContext;
      private List<Vegetable> mVegList;
  
      public VegAdapter(Context context, List<Vegetable> vegList) {
          mContext = context;
          mVegList = vegList;
      }
  
      @Override
      public int getCount() {
          // 返回数据总数，这很重要！
          return mVegList != null ? mVegList.size() : 0;
      }
  
      @Override
      public Object getItem(int position) {
          return mVegList.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.item_vegetable, parent, false);
              holder = new ViewHolder();
              holder.iconIv = convertView.findViewById(R.id.iv_veg_icon);
              holder.nameTv = convertView.findViewById(R.id.tv_veg_name);
              convertView.setTag(holder);
          } else {
              holder = (ViewHolder) convertView.getTag();
          }
  
          // 绑定数据到视图
          Vegetable veg = mVegList.get(position);
          holder.nameTv.setText(veg.getName());
          holder.iconIv.setImageResource(veg.getIconResId());
          return convertView;
      }
  
      // ViewHolder类，缓存视图控件
      static class ViewHolder {
          ImageView iconIv;
          TextView nameTv;
      }
  }
  

• 步骤4：在Activity中绑定ListView和数据
  初始化数据、创建Adapter，最后设置给ListView：

  public class VegListActivity extends AppCompatActivity {
      private ListView mListView;
      private List<Vegetable> mVegList;
      private VegAdapter mAdapter;
  
      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          setContentView(R.layout.activity_veg_list);
  
          mListView = findViewById(R.id.lv_vegetables);
          // 初始化测试数据
          mVegList = new ArrayList<>();
          mVegList.add(new Vegetable("白菜", R.drawable.ic_cabbage));
          mVegList.add(new Vegetable("萝卜", R.drawable.ic_radish));
          mVegList.add(new Vegetable("西红柿", R.drawable.ic_tomato));
  
          // 设置Adapter
          mAdapter = new VegAdapter(this, mVegList);
          mListView.setAdapter(mAdapter);
      }
  }
  

你说点击蔬菜分类后只显示第一个元素，这是新手常遇到的问题，大概率是这几个原因：

• 最常见原因：列表项布局高度设成了match_parent
  看你的problem_list.xml，如果列表项的根布局高度是match_parent，那第一个列表项会占满整个ListView，后面的元素直接被挡住了！
  修复方法：把列表项的android:layout_height改成wrap_content，比如：

  <!-- 错误写法 -->
  <RelativeLayout 
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"> <!-- 这里错了！ -->
  
  <!-- 正确写法 -->
  <RelativeLayout 
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"> <!-- 改成wrap_content -->
  

• Adapter的getCount()返回值错误
  检查你的Adapter里的getCount()方法，如果它返回1而不是mVegList.size()，那ListView只会加载第一个元素。比如：

  // 错误示例
  @Override
  public int getCount() {
      return 1; // 强制返回1，只会显示第一个元素
  }
  
  // 正确示例
  @Override
  public int getCount() {
      return mVegList != null ? mVegList.size() : 0;
  }
  

• 数据未正确添加或未刷新列表
  点击分类后，你是不是只往ArrayList里加了一个元素？或者添加完数据后没有调用mAdapter.notifyDataSetChanged()？
  正确的点击事件逻辑应该是这样的：

  // 蔬菜分类点击事件
  categoryBtn.setOnClickListener(v -> {
      mVegList.clear();
      // 添加3个元素
      mVegList.add(new Vegetable("青菜", R.drawable.ic_green_veg));
      mVegList.add(new Vegetable("黄瓜", R.drawable.ic_cucumber));
      mVegList.add(new Vegetable("茄子", R.drawable.ic_eggplant));
      // 必须调用这个方法刷新ListView
      mAdapter.notifyDataSetChanged();
  });
  

如果以上方法都试过还是不行，可以把完整的Adapter代码和点击事件代码贴出来，我再帮你排查~

内容的提问来源于stack exchange，提问作者Red