投稿日:

[Xamarin.iOS] 06.UIStepper

はじめに

今回は、Xamarin.iOS開発におけるUIStepperの使用方法を見ていきます。UIStepperは[+]と[-]の2つのボタンが1セットになっていて、[+]を押すと値が増やし、[-]を押すと値を減らすことができます。

環境

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

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

画面のデザイン

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

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

初期値、最小値、最大値、増分値を設定する

UIStepperは現在値と、現在地の範囲（最小値と最大値）を設定することができます。また、ボタンを１回タップするごとの増減値を設定することができます。

  • 現在値: Currentプロパティ
  • 最小値: Minimumプロパティ
  • 最大値: Maximumプロパティ
  • 増減値: Stepプロパティ

ここでは現在値を10、最小値を-10、最大値を50、増減値を5にしてみます。

現在値変更時のイベントを作成する

はじめに、コードから操作できるようにするため、UIStepperコントロールの名前を「myStepper」にしておきましょう。またLabelコントロールの名前は「labelMsg」としておきます。

続いてイベントを作成します。

現在値が変更されるとChangedイベントが発生します。以下のようにして、Stepper_Changedイベントを作成します。

あとは以下のようにコードを書いてLabelに現在値が表示されるようにします。

partial void Stepper_Changed(UIStepper sender)
{
	labelMsg.Text = myStepper.Value.ToString();
}

実行結果

実行すると以下のように値を変更することができます。

投稿日:

[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に表示されます。

投稿日:

[Xamarin.iOS] 04.Buttonコントロール

はじめに

今回は、Xamarin.iOS開発におけるButtonコントロールの使用方法を見ていきます。

環境

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

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

画面のデザイン

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

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

次に、LabelコントロールのNameプロパティに「labelMsg」と入力します。これで、コードからlabelMsgという名前でLabelコントロールが操作できるようになります。

Buttonのイベントを作成する

続いてButtonがタップされたら、Labelに「Hello!!」と表示するようにして見ましょう。

Buttonがタップされたことを知るには、イベントを作成する必要があります。

貼り付けたButtonを選択状態にしたら、プロパティのEventsタブを選択します。次に、UpInsideの欄に任意のイベント名を入力します。ここでは「Button_TouchUp」としました。

「Button_TouchUp」と入力したら、そのまま[enter]キーを押してください。

コードエディタが開き、今入力した「Button_TouchUp」のイベントコードをどこに挿入するかを聞かれます。[↑]キーまたは[↓]キーで挿入位置を選択し、[enter]キーを押すと、イベントコードが挿入されます。

イベントコードが挿入されたら、以下のようにコードを編集します。

partial void Button_TouchUp(UIButton sender)
{
	labelMsg.Text = "Hello!!";
}

先ほど名前をつけた「labelMsg」のTextプロパティに「Hello!!」を代入していますので、ButtonをタップするとLabelには「Hello!!」が表示されます。