回答編集履歴

1 fix typo

amay077

amay077 score 1069

2016/11/27 01:42  投稿

こんな感じでしょうか。
![イメージ説明](9a296452959aaf45a9e1698bf92be98b.gif)
それぞれの Image がタップされた時に、全ての画像を自力で更新すればよいのですが、
せっかく Xamarin.Forms なので、データバインディングとプロパティ変更通知を利用するのが後々にとってよいでしょう。
おおざっぱにやる事は5つ。
1. 選択しているボタンの Index を保持するモデルクラスを作り、それは ``INotifyPropertyChanged`` を実装する。
2. Index から ImageSource へ変換する ValueConverter を作る。これはモデルの Index と、後述のコマンドパラメータ値が一致したら選択中の画像を、不一致なら未選択の画像を返すものである。
3. 画面の XAML の BindingContext に ``YourModel`` を設定する。
3. 画面の XAML の BindingContext に 1. のモデルのインスタンスを設定する。
4. 並べた ``Image`` の ``Source`` プロパティに 1. の Index をバインドし、さらに 2. の ValueConverter を仕掛ける。コマンドパラメータには 1〜 の連番を指定する。
5. 各 Image がタップされたときの処理で、モデルクラスの Index に 1〜 を設定する。
サンプルを以下に作ってみましたので参考にしてみてください。
* [amay077/RadioImageSample: Xamarin.Forms で、ラジオボタンのように Image の画像を On / Off するサンプル](https://github.com/amay077/RadioImageSample)

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る