AndroidStudioでリストをタップするとそのリスト内の画像が表示され、他の行をタップすると先の画像は消え、新たに画像が表示されるプログラミングについて

前提・実現したいこと

AndroidStudioでコレクションで作成したMapをアダプタでウィジェットに表示させました。その際に、タップしたらタップした行のリストのImageViewに画像が表示されるようにしたいです。
条件として、他の行をタップすると先ほどタップした画像は消えて、今タップした行のリスト内のImageView内に画像をセットします。また、すでに画像が表示されている行をタップするとその画像は消えるようにしたいです。。

発生している問題・エラーメッセージ

該当のソースコード通り打つと、画像はすでに表示されている状態で同じ箇所をタップすると画像は消えるのですが、ある行をタップした後に他の行をタップしても前の画像は消えません。

個人的には該当のソースコード（java）の最後のコメント以下で、for文チェックの画像を消す処理が各行のImageViewではなく、タップされたImageViewになっているからだと思うのですが、、何か良い方法はありませんか？？

該当のソースコード

java
1public class ConditionSelectActivity extends AppCompatActivity {
2
3    private List<Map<String,String>> TimeZoneList;
4    private static final String[] FROM={"minTime","maxTime"};
5    private static final int[] TO={R.id.tvMinTime,R.id.tvMaxTime};
6
7    @Override
8    protected void onCreate(Bundle savedInstanceState) {
9        super.onCreate(savedInstanceState);
10        setContentView(R.layout.activity_condition_select);
11
12
13        //TimeZone（リスト画面上側）を表示させる
14        ListView lvTimeZone=findViewById(R.id.lvTimeZone);
15        TimeZoneList=createTimeZoneList();
16        SimpleAdapter adapter=new SimpleAdapter(ConditionSelectActivity.this,TimeZoneList,R.layout.timezone_list,FROM,TO);
17        lvTimeZone.setAdapter(adapter);
18
19        //TimeZoneリストをタップした時の処理
20        lvTimeZone.setOnItemClickListener(new ListTimeZoneClickListener());
21    }
22
23    private List<Map<String,String>> createTimeZoneList(){
24
25        List<Map<String,String>> timeZoneList=new ArrayList<>();
26        //HashMapでMaxTime〜MinTimeを作成
27        Map<String,String> timeZone=new HashMap<>();
28        timeZone.put("minTime","12:00");
29        timeZone.put("maxTime","12:30");
30        timeZone.put("check","no");
31        timeZoneList.add(timeZone);
32
33        timeZone=new HashMap<>();
34        timeZone.put("minTime","12:31");
35        timeZone.put("maxTime","13:00");
36        timeZone.put("check","no");
37        timeZoneList.add(timeZone);
38
39        timeZone=new HashMap<>();
40        timeZone.put("minTime","13:01");
41        timeZone.put("maxTime","13:30");
42        timeZone.put("check","no");
43        timeZoneList.add(timeZone);
44
45        //ArrayList(MaxTime.MinTime)を返す
46        return timeZoneList;
47    }
48
49    //TimeZoneListがタップされた時の処理が記述されたメンバクラス
50    private class ListTimeZoneClickListener implements AdapterView.OnItemClickListener{
51
52        @Override
53        public void onItemClick(AdapterView<?> parent, View view,int position,long id){
54            ImageView ivcheck=view.findViewById(R.id.ivcheck);
55            Map<String,String> timeZone=(Map<String, String>) parent.getItemAtPosition(position);
56
57            //チェックが２つにならないようにする処理
58            for (int i=0;i<parent.getCount();i++){
59                timeZone=(Map<String ,String >) parent.getItemAtPosition(i);
60                String check=timeZone.get("check");
61                if (i!=position&&check=="yes"){
62                    timeZone.put("check","no");
63                    ivcheck.setImageDrawable(null);
64                }else if(i==position&&check=="yes"){
65                    timeZone.put("check","no");
66                    ivcheck.setImageDrawable(null);
67                }else if (i==position&&check=="no"){
68                    timeZone.put("check","yes");
69                    ivcheck.setImageResource(R.drawable.check);
70                }
71            }
72
73
74
75        }
76    }
77
78
79}

該当のソースコード

xml
1<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
2    xmlns:app="http://schemas.android.com/apk/res-auto"
3    xmlns:tools="http://schemas.android.com/tools"
4    android:layout_width="match_parent"
5    android:layout_height="match_parent"
6    android:id="@+id/topconstaraint">
7
8    <ImageView
9        android:id="@+id/ivcheck"
10        android:layout_width="55dp"
11        android:layout_height="38dp"
12        android:layout_marginStart="8dp"
13        android:layout_marginTop="8dp"
14        android:src="@drawable/checkselector"
15        app:layout_constraintBottom_toTopOf="@+id/guideline2"
16        app:layout_constraintStart_toStartOf="parent"
17        app:layout_constraintTop_toTopOf="@+id/guideline2" />
18
19    <android.support.constraint.ConstraintLayout
20        android:layout_width="0dp"
21        android:layout_height="match_parent"
22        app:layout_constraintEnd_toEndOf="parent"
23        app:layout_constraintStart_toEndOf="@+id/ivcheck">
24
25        <TextView
26            android:id="@+id/tvMinTime"
27            android:layout_width="wrap_content"
28            android:layout_height="38dp"
29            android:layout_marginStart="8dp"
30            android:layout_marginTop="8dp"
31            android:layout_marginBottom="8dp"
32            android:textSize="20sp"
33            app:layout_constraintBottom_toTopOf="@+id/guideline"
34            app:layout_constraintStart_toStartOf="parent"
35            app:layout_constraintTop_toTopOf="@+id/guideline" />
36
37        <TextView
38            android:id="@+id/textView2"
39            android:layout_width="wrap_content"
40            android:layout_height="38dp"
41            android:layout_marginStart="8dp"
42            android:layout_marginTop="8dp"
43            android:layout_marginBottom="8dp"
44            android:text="@string/timezone_linear"
45            android:textSize="20sp"
46            app:layout_constraintBottom_toTopOf="@+id/guideline"
47            app:layout_constraintStart_toEndOf="@+id/tvMinTime"
48            app:layout_constraintTop_toTopOf="@+id/guideline" />
49
50        <TextView
51            android:id="@+id/tvMaxTime"
52            android:layout_width="wrap_content"
53            android:layout_height="38dp"
54            android:layout_marginStart="8dp"
55            android:layout_marginTop="8dp"
56            android:layout_marginBottom="8dp"
57            android:textSize="20sp"
58            app:layout_constraintBottom_toTopOf="@+id/guideline"
59            app:layout_constraintStart_toEndOf="@+id/textView2"
60            app:layout_constraintTop_toTopOf="@+id/guideline" />
61
62        <android.support.constraint.Guideline
63            android:id="@+id/guideline"
64            android:layout_width="wrap_content"
65            android:layout_height="wrap_content"
66            android:orientation="horizontal"
67            app:layout_constraintGuide_begin="35dp" />
68
69    </android.support.constraint.ConstraintLayout>
70
71    <android.support.constraint.Guideline
72        android:id="@+id/guideline2"
73        android:layout_width="wrap_content"
74        android:layout_height="wrap_content"
75        android:orientation="horizontal"
76        app:layout_constraintGuide_begin="27dp" />
77
78</android.support.constraint.ConstraintLayout>

以下はdrawableフォルダのxmlです。

xml
1<?xml version="1.0" encoding="UTF-8"?>
2<selector xmlns:android="http://schemas.android.com/apk/res/android">
3    <item
4        android:state_selected="true"
5        android:drawable="@drawable/check" />
6    <item android:drawable="@null" />
7</selector>
8

特に見てもらいたいところ

Javaのソースコードの最後のコメント以下を見て欲しいです。。
「//チェックが２つにならないようにする処理」というところです。。
よろしくお願いします。

keicha_hrs

2018/12/14 02:01

Javaコードでは ListView lvTimeZone=findViewById(R.id.lvTimeZone); とされていますが、XMLにこれに該当するListViewが見当たりません。これはどこにあるものなのですか？

行動規範の内容に同意します

回答1件

ベストアンサー

ListViewの表示を更新するには、Adapter内に表示に関するデータを持たせてそれを元にgetViewメソッド内で各アイテムの表示処理を行うのが基本的な実装方法です。

今の実装のようにクリック時にViewを自分で取得して書き換える方式だと、結局ListViewがスクロールした時などに表示が元に戻ってしまいますから、あまり意味がありません。

ご質問の条件を読む限り、やりたいことは一つだけのアイテムを選択できるようにすることだと思います。SimpleAdapterを以下のように拡張して、選択中のアイテムの位置を保存できるようにしてみてください。

java
1public class SingleSelectAdapter extends SimpleAdapter {
2    private int selectedIndex = -1; // 初期値は選択なし
3
4    // コンストラクタ…（省略）
5
6    // 指定した位置の選択状態を切り替えるメソッド
7    public void toggleSelection(int position) {
8        if (position == selectedIndex) {
9            selectedIndex = -1;
10        } else {
11            selectedIndex = position;
12        }
13        notifyDataSetChanged(); // リストの更新を促す
14    }
15
16    @Override
17    public View getView(int position, View convertView, ViewGroup parent) {
18        View view = super.getView(position, convertView, parent);
19        // 選択された位置であればviewを選択状態にする
20        view.setSelected(position == selectedIndex); 
21        return view;
22    }
23}

このAdapterを使うようにすれば、リストアイテムのクリック時にアイテムの選択状態を切り替える処理は、上記のtoggleSelectionを呼ぶだけで済みます。

@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id){
    adapter.toggleSelection(position);
}

また、ImageViewの画像を選択状態により切り替えるにはdrawableリソースのselectorを使うと楽です。

xml
1<?xml version="1.0" encoding="UTF-8"?>
2<selector xmlns:android="http://schemas.android.com/apk/res/android">
3    <item 
4        android:state_selected="true" 
5        android:drawable="@drawable/check" />
6    <item android:drawable="@null" />
7</selector>

投稿2018/12/14 02:40

kakajika

総合スコア3131

tanaka_hana

2018/12/14 13:48

返信ありがとうございます。懇切丁寧ですごくわかりやすいのです！コンストラクタには引数でContext context, List<? extends Map<String, ?>> data, int resource, String[] FROM, int[] TOを受け取ってsuper(context, data, resource, FROM, TO);が入るのですよね？ただ、自分でAdapterを定義したことがなく、調べてはいるんですが不安で。。あと、起動時にView view = super.getView(position, convertView, parent);この行に問題がある（親クラスのSimpleAdapterのアノテーションがエラーを起こしている）のですが、これはAPIレベルの話なのでしょうか？？質問ばかりで申し訳ないです。。

kakajika

2018/12/15 07:25

コンストラクタはそれでOKだと思います。Adapterを正しく実装できるようになると色々と応用が効くのでトライしてみてください。エラーについてはよくわからないのですが、アノテーションというのはJavaのアノテーションのことですか？アプリの起動時にエラーが出て落ちてしまうのなら、エラーの内容を教えてください。

tanaka_hana

2018/12/16 03:56

返信ありがとうございます。すいません、アノテーションのエラーメッセージではなかったです。。android.view.InflateException: Binary XML file line #9: Binary XML file line #9: Error inflating class ImageViewというエラーメッセージです。

tanaka_hana

2018/12/16 06:53

詳しくは Caused by: android.view.InflateException: Binary XML file line #9: Error inflating class ImageView Caused by: android.content.res.Resources$NotFoundException: Drawable com.websarva.wings.android.フォルダ名:drawable/checkselector with resource ID #0x7f060062 Caused by: android.content.res.Resources$NotFoundException: File res/drawable/checkselector.xml from drawable resource ID #0x7f060062

kakajika

2018/12/17 03:33

XML側の問題のようですね。checkselector.xmlというファイルが正しくres/drawable以下に存在しているかを確認してください。

tanaka_hana

2018/12/17 06:26

androidビューだけでなく、プロジェクトビューも確認したのですが、checkselector.xmlはdrawable-v24ではなく、drawableフォルダ内に入っています。。コードも教えていただいた通りに、なっているのですが。。

tanaka_hana

2018/12/21 01:59

ありがとうございました。spinnerで実装することに決めました。

行動規範の内容に同意します