使用原始文件在列表视图中添加图像视图答案

【问题标题】：Add imageview in listview with a raw file使用原始文件在列表视图中添加图像视图
【发布时间】：2016-04-18 20:15:58
【问题描述】：

我想做一个音板。为此，我制作了一个 listview 和一个 xml 文件（用于名称和声音）。

首先，我制作了一个带有声音标题的列表视图。当我们点击它时，就会播放声音。

主活动：

 mSoundPlayer = new SoundPlayer(this);
        Sound[] soundArray = SoundStore.getSounds(this);

        ListView listView = (ListView) findViewById(R.id.listView);

        final ArrayAdapter<Sound> adapter =
                new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, soundArray);

        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView parent, View view, int position, long id) {
                Sound sound = (Sound) parent.getItemAtPosition(position);
                mSoundPlayer.playSound(sound);
            }
        });

我使用xml 文件来索引声音的名称和声音。

文件：arrays.xml：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="labels">
        <item>First sound</item>
        <item>Second soung</item>
    </string-array>

    <integer-array name="ids">
        <item>@raw/a1</item>
        <item>@raw/a2</item>
    </integer-array>
</resources>

最后，我的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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:paddingLeft="0dp"
    android:paddingRight="0dp"
    android:paddingTop="0dp"
    android:paddingBottom="0dp"
    tools:context="com.clemb.sardboard.MainActivity">

    <ListView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/listView"
        android:numColumns="auto_fit"
        android:gravity="center"
        android:columnWidth="100dp"
        android:verticalSpacing="5dp"
        android:stretchMode="columnWidth"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"/>
</RelativeLayout>

我只想知道如何在声音名称前添加图片。我可以在我的 array.xml 中做吗？

谢谢。

【问题讨论】：

标签： android xml listview android-listview

【解决方案1】：

您可以将图像添加到您的array.xml，看看这里Storing R.drawable IDs in XML array

要在名称之前设置图像，您需要创建自己的ArrayAdapter 以与您的ListView 一起使用

SoundItemAdapter adapter =
        new SoundItemAdapter(this, android.R.layout.sound_item, soundArray);

listView.setAdapter(adapter);

...数组适配器

public class SoundItemAdapter extends ArrayAdapter<Sound> {
    private ArrayList<Sound> sounds;
    private int soundItemLayoutId;
    private Context context;

    public SoundItemAdapter(Context context, int soundItemLayoutId, ArrayList<Sound> sounds) {
        super(context, soundItemLayoutId, sounds);
        this.context=context;
        this.soundItemLayoutId = soundItemLayoutId;
        this.sounds = sounds;

    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        ViewHolderItem viewHolder;
        if(convertView==null){
            convertView = LayoutInflater.from(context).inflate(soundItemLayoutId, parent, false);
            //set up a ViewHolder to avoid calling findViewById() on every call to getView == smoother scroll
            viewHolder = new ViewHolderItem();
            viewHolder.name = (TextView) convertView.findViewById(R.id.name);
            viewHolder.image = (ImageView) convertView.findViewById(R.id.image);
            // store the holder with the view.
            convertView.setTag(viewHolder);
        } else {
             // return the viewHolder
            viewHolder = (ViewHolderItem) convertView.getTag();
        }

        Sound sound = sounds.get(position);
        if (sound != null) {
            viewHolder.name.setText(sound.name);
            viewHolder.image.setImageDrawable(ContextCompat.getDrawable(context,sound.image));
        }
        return convertView;
        }


    class ViewHolderItem {
        TextView name;
        ImageView image;
    }
}

sound_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/listPreferredItemHeight">


    <ImageView
        android:layout_width="56dp"
        android:layout_height="match_parent"
        tools:src="@android:drawable/ic_media_play"
        android:id="@+id/image" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:gravity="start|center"
        android:textAppearance="?android:attr/textAppearanceMedium"
        tools:text="Sound Name"
        android:id="@+id/name"
        android:layout_weight="1" />
</LinearLayout>

【讨论】：

【解决方案2】：

您需要创建一个自定义数组适配器。 Custom Array adapter 和 Codepath - Custom ArrayAdapter 是一些例子。

我可以在我的数组中做吗？

不在 xml 中。为此目的有ArrayList。

【讨论】：

【解决方案3】：

我觉得这个问题可以在这个帖子里回答：How to add an icon to a listview in a fragment

在您的场景中，您只需要进行适当的更改以在活动中使用，而不是在片段中使用。从概念上讲，它应该是相同的。您正在为每个列表项自定义布局以包含一个图像视图。

【讨论】：