Xamarin.Forms
Xamarin.Formsビュー

ボタン

このボタンは、モバイルアプリケーションだけでなく、UIを持つアプリケーションでも、おそらく最も一般的なコントロールです。ボタンのコンセプトはあまりにも多くの目的を持っています。ただし、一般的に言えば、ユーザーはアプリケーション内で何らかの操作や操作を開始できるようにボタンを使用します。この操作には、アプリ内の基本的なナビゲーションから、インターネット上のどこかのWebサービスにデータを送信するための操作まで含まれます。

XAML

<Button
    x:Name="MyButton"
    Text="Click Me!"
    TextColor="Red"
    BorderColor="Blue"
    VerticalOptions="Center"
    HorizontalOptions="Center"
    Clicked="Button_Clicked"/>

XAMLコードビハインド

public void Button_Clicked( object sender, EventArgs args ) 
{
    MyButton.Text = "I've been clicked!";
}

コード

var button = new Button( ) 
{
    Text = "Hello, Forms !",
    VerticalOptions = LayoutOptions.CenterAndExpand,
    HorizontalOptions = LayoutOptions.CenterAndExpand,
    TextColor = Color.Red,
    BorderColor = Color.Blue,
};

button.Clicked += ( sender, args ) => 
{
    var b = (Button) sender;
    b.Text = "I've been clicked!";
};

DatePicker

たいていの場合、モバイルアプリケーション内では、日付を処理する理由があります。日付を扱うときには、日付を選択するためのユーザー入力が必要になるでしょう。これは、スケジュールまたはカレンダーアプリで作業しているときに発生する可能性があります。この場合、ユーザーに手動で日付を入力させるのではなく、対話形式で日付を選択できる特殊なコントロールをユーザーに提供することが最善です。これは、DatePickerコントロールが本当に便利な場所です。

XAML

<DatePicker Date="09/12/2014" Format="d" />

コード

var datePicker = new DatePicker{
Date = DateTime.Now,
Format = "d"
};

エントリ

エントリビューは、ユーザーが1行のテキストを入力できるようにするために使用されます。この1行のテキストは、基本的なメモ、認証情報、URLなどを入力するなど、複数の目的で使用できます。このビューは多目的ビューです。つまり、通常のテキストを入力する必要がある場合、またはパスワードを隠す必要がある場合は、すべてこの1つのコントロールで行います。

XAML

<Entry Placeholder="Please Enter Some Text Here"
HorizontalOptions="Center"
VerticalOptions="Center"
Keyboard="Email"/>

コード

var entry = new Entry {
Placeholder = "Please Enter Some Text Here",
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Keyboard = Keyboard.Email
};

編集者

エディタは、ユーザーが自由形式のテキストを入力できる点でEntryと非常に似ています。違いは、エディタは複数行の入力を許可しますが、エントリは単一行の入力のみに使用されることです。エントリは、ビューをさらにカスタマイズできるように、エディタよりもいくつかのプロパティを提供します。

XAML

<Editor HorizontalOptions="Fill"
VerticalOptions="Fill"
 Keyboard="Chat"/>

コード

var editor = new Editor {
HorizontalOptions = LayoutOptions.Fill,
VerticalOptions = LayoutOptions.Fill,
Keyboard = Keyboard.Chat
};

画像

画像は、アプリケーションの非常に重要な部分です。彼らはあなたのアプリケーションにブランディングを追加するだけでなく、追加のビジュアル要素を注入する機会を提供します。画像は、通常、テキストやボタンよりも見るのが面白いということは言うまでもありません。 Imageは、アプリケーション内のスタンドアロン要素として使用できますが、Buttonなどの他のView要素にImage要素を追加することもできます。

XAML

<Image Aspect="AspectFit" Source="http://d2g29cya9iq7ip.cloudfront.net/co
ntent/images/company/aboutus-video-bg.png?v=25072014072745"/>

コード

var image = new Image {
Aspect = Aspect.AspectFit,
Source = ImageSource.FromUri(new Uri("http://d2g29cya9iq7ip.cloudfron
t.net/content/images/company/aboutus-video-bg.png?v=25072014072745"))
};

ラベル

信じられないかもしれませんが、ラベルはXamarin.Formsだけでなく、一般的なUI開発においても、最も重要でありながら評価の低いViewクラスの1つです。むしろ退屈なテキスト行と見なされますが、そのテキスト行がなければ、特定のアイデアをユーザーに伝えるのは非常に難しいでしょう。ラベルコントロールを使用して、ユーザーがエディタまたはエントリコントロールに入力する内容を記述することができます。彼らは、UIのセクションを記述し、そのコンテキストを与えることができます。それらは電卓のアプリで合計を表示するために使用することができます。はい、ラベルは本当に多くの注意を喚起するとは限りませんが、本当にツールバッグの中で最も多目的なコントロールですが、それがない場合には最初に気付かれたものです。

XAML

<Label Text="This is some really awesome text in a Label!"
TextColor="Red"
XAlign="Center"
YAlign="Center"/>

コード

var label = new Label {
Text = "This is some really awesome text in a Label!",
TextColor = Color.Red,
XAlign = TextAlignment.Center,
YAlign = TextAlignment.Center
};