[Xamarin.iOS] 05.UISegmentedControl

はじめに

今回は、Xamarin.iOS開発におけるUISegmentedControlの使用方法を見ていきます。UISegmentedControlはラジオボタンに相当するコントロールで、複数項目の中から1つの項目を選択させることができます。

環境

Visual Studio for Mac Community バージョン7.4(build 1033)

ターゲットOS:iOS11.2以上

画面のデザイン

はじめに、単一ビューアプリプロジェクトを作成したら、ソリューションエクスプローラーでMain.storyboardを開きます。

ツールボックスから、UISegmentedControlとLabelコントロールを1つずつ貼り付けてください。

選択項目を設定する

UISegmentedControlを貼り付けると「First」「Second」の2つの選択項目があります。選択肢の数を変更するにはSegmentsプロパティを設定します。3項目にしたい場合は「3」にします。

続いて1項目目の選択肢の文字列を変更するには、Segmentプロパティで「Segement 0 – First」を選択します。次にTitleプロパティに表示したい文字列を入力します。

選択肢を3つにして「犬」「猫」「ウサギ」にすると下図のようになります。

初期選択項目を設定する

既定では、最初の項目が選択状態になっています。初期選択項目を変更するにはプロパティパッドで項目を選択してSelectedにチェックを付けます。

例えば、「ウサギ」を初期選択項目にしたい場合は下図のようにします。

選択項目が変更されたことを知る

アプリ実行時に、選択項目が変更されたことを知るにはChangedイベントを使用します。

まずは貼り付けているUISegmentedControlをコードから使用できるように名前を付けます。ここでは「segmentAnimals」としました。

次にChangeイベントを作成します。ここでは「AnimalValue_Changed」とします。

AnimalValue_Changedイベントのコードが作成されたら、以下のように編集します。このコードは選択された項目名をLabelコントロールに表示するものです。

partial void AnimalValue_Change(UISegmentedControl sender)
{
	var index = segmentAnimals.SelectedSegment;
	labelMsg.Text = segmentAnimals.TitleAt(index);
}

現在何番目が選択されているかを知るには、SelectedSegmentプロパティを使用します。また、選択されている項目のテキストを取得するにはTitleAtメソッドを使用します。引数には、テキストを取得したい選択肢のインデックスを指定します。

実行結果

実行すると以下のように、選択された項目がLabelに表示されます。