Xamarin.Forms
Widoki Xamarin.Forms

Przycisk

Button jest prawdopodobnie najczęstszą kontrolą nie tylko w aplikacjach mobilnych, ale we wszystkich aplikacjach, które mają interfejs użytkownika. Pojęcie przycisku ma zbyt wiele celów, aby je tutaj wymienić. Ogólnie rzecz biorąc, użyjesz przycisku, aby umożliwić użytkownikom zainicjowanie jakiegoś działania lub operacji w Twojej aplikacji. Ta operacja może obejmować wszystko, od podstawowej nawigacji w aplikacji, po przesyłanie danych do usługi internetowej gdzieś w Internecie.

XAML

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

Kod XAML

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

Kod

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

Dość często w aplikacjach mobilnych pojawia się powód do radzenia sobie z datami. Podczas pracy z datami prawdopodobnie będziesz potrzebować danych wejściowych od użytkownika, aby wybrać datę. Może się to zdarzyć podczas pracy z aplikacją do planowania lub kalendarza. W takim przypadku najlepiej jest zapewnić użytkownikom specjalną kontrolę, która pozwala im interaktywnie wybierać datę, zamiast wymagać od użytkowników ręcznego wpisywania daty. W tym miejscu formant DatePicker jest naprawdę przydatny.

XAML

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

Kod

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

Wejście

Widok wejścia umożliwia użytkownikom wpisanie pojedynczego wiersza tekstu. Ten pojedynczy wiersz tekstu może być wykorzystywany do wielu celów, w tym do wprowadzania podstawowych notatek, danych uwierzytelniających, adresów URL i innych. Ten widok jest widokiem wielofunkcyjnym, co oznacza, że jeśli musisz pisać zwykły tekst lub chcesz ukryć hasło, wszystko odbywa się za pomocą tego pojedynczego elementu sterującego.

XAML

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

Kod

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

Redaktor

Edytor jest bardzo podobny do Wpisu, ponieważ pozwala użytkownikom wprowadzać dowolny tekst. Różnica polega na tym, że Edytor zezwala na wprowadzanie wielu wierszy, podczas gdy Wpis służy tylko do wprowadzania jednowierszowego. Wpis zawiera także kilka dodatkowych właściwości niż Edytor, aby umożliwić dalszą personalizację Widoku.

XAML

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

Kod

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

Wizerunek

Obrazy są bardzo ważnymi częściami każdej aplikacji. Zapewniają one możliwość wprowadzenia dodatkowych elementów wizualnych, a także brandingu do aplikacji. Nie wspominając o tym, że obrazy są zwykle bardziej interesujące niż tekst lub przyciski. Możesz użyć obrazu jako samodzielnego elementu w aplikacji, ale element obrazu można również dodać do innych elementów widoku, takich jak przycisk.

XAML

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

Kod

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"))
};

Etykieta

Wierzcie lub nie, Label jest jedną z najważniejszych, ale niedocenianych klas View nie tylko w Xamarin.Forms, ale ogólnie w rozwoju interfejsu użytkownika. Jest to dość nudna linia tekstu, ale bez tej linii bardzo trudno byłoby przekazać pewne pomysły użytkownikowi. Kontrolki etykiet można wykorzystać do opisania tego, co użytkownik powinien wprowadzić do edytora lub kontrolki wprowadzania. Mogą opisać sekcję interfejsu użytkownika i nadać jej kontekst. Można ich użyć do wyświetlenia sumy w aplikacji kalkulatora. Tak, etykieta jest naprawdę najbardziej wszechstronnym urządzeniem kontrolnym w twojej torbie z narzędziami, które nie zawsze wzbudza wiele uwagi, ale jest pierwszą zauważoną, jeśli jej nie ma.

XAML

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

Kod

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