投稿日:

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

 

 

投稿日:

[Xamarin.iOS] 03.Labelプロパティ Tips

前回の記事「02.Labelコントロールとプロパティ操作」でLabelの操作方法がわかりましたので、今回はLabelのプロパティについて見ていくこととします。

ラベルテキストの色を変えるには？

ラベルのテキストを変えるには、Colorプロパティを使用します。

コードから変更したい場合はTextColorプロパティを使用します。プロパティパッドでは「Color」プロパティですが、コードではTextColorプロパティとなるので注意が必要です。

TextColorにはUIColorクラスが持つ色プロパティ（Red, Blue, Purple）を直接指定するかFromRGBメソッドかFromRGBAメソッドを使用して、色を作り出して指定します。

// 紫（Purple）を設定
lblTitle1.TextColor = UIColor.Purple;

// Red, Green, Blueの値を0から255の範囲で指定
// 以下はGreenを255に設定しているので緑が設定される
lblTitle2.TextColor = UIColor.FromRGB(0, 255, 0);

// Red, Green, Blue, Alphaの値を0から255の範囲で指定
// Alphaは透明度を表し、0が透明, 255が不透明
// 以下はRedを255に設定しているので赤が設定される
lblTitle3.TextColor = UIColor.FromRGBA(255,0,0,255);

Labelに影を付けるには？

Labelのテキストには影を付けることができます。

影を付けるには、ShadowプロパティとShadow Offsetプロパティの値を設定します。

Shadowは影の色を、Shadow Offsetは影の位置を表します。ShadowにLight Gray Colorを、Shadow Offsetの幅に2、高さに2を設定する例を以下にに示します。

続いてコードから影を設定する方法を見てみましょう。コードから設定するには、ShadowColorプロパティで影の色を、ShadowOffsetプロパティで影の位置を指定します。

// コードから影を設定する
lblShadow.ShadowColor = UIColor.Gray;
lblShadow.ShadowOffset = new CoreGraphics.CGSize(new CoreGraphics.CGPoint(3.0, 3.0));

フォントを設定する

フォントを設定するには、はじめにAttributeを選択します。Attributeを選択しておくことで、より多くのフォントの種類の中から選択をすることができます。

続いて使用したいフォントとサイズを選択します。

続いてコードからフォントを設定する例を見てみましょう。コードからフォントを設定するにはFontプロパティを使用します。また設定値にはUIFont.FromNameの値を指定します。第1引数はフォントファミリ名を、第2引数はフォントサイズを指定します。

// コードからフォントを選択する
lblFont.Font = UIFont.FromName("Times New Roman", 16f);