Xamarin.Forms
Xamarin.Forms Views

Pulsante

Il pulsante è probabilmente il controllo più comune non solo nelle applicazioni mobili, ma in tutte le applicazioni che dispongono di un'interfaccia utente. Il concetto di un pulsante ha troppi scopi da elencare qui. In generale, tuttavia, si utilizzerà un pulsante per consentire agli utenti di avviare una sorta di azione o operazione all'interno dell'applicazione. Questa operazione potrebbe includere qualsiasi cosa, dalla navigazione di base all'interno della tua app, all'invio di dati a un servizio web da qualche parte su Internet.

XAML

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

XAML Code-Behind

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

Codice

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

Date picker

Molto spesso all'interno delle applicazioni mobili, ci sarà un motivo per gestire le date. Quando lavori con le date, probabilmente avrai bisogno di una sorta di input da parte dell'utente per selezionare una data. Ciò potrebbe verificarsi quando si lavora con un'app di pianificazione o di calendario. In questo caso, è meglio fornire agli utenti un controllo specializzato che consenta loro di selezionare in modo interattivo una data, anziché richiedere agli utenti di digitare manualmente una data. È qui che il controllo DatePicker è davvero utile.

XAML

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

Codice

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

Iscrizione

La Visualizzazione voce viene utilizzata per consentire agli utenti di digitare una singola riga di testo. Questa singola riga di testo può essere utilizzata per più scopi, incluso l'inserimento di note di base, credenziali, URL e altro. Questa vista è una vista multiuso, il che significa che se hai bisogno di digitare un testo normale o di voler oscurare una password, tutto avviene attraverso questo singolo controllo.

XAML

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

Codice

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

editore

L'editor è molto simile alla voce in quanto consente agli utenti di inserire del testo in forma libera. La differenza è che l'editor consente l'immissione su più righe, mentre l'ingresso è utilizzato solo per l'ingresso a linea singola. La voce fornisce anche alcune proprietà in più rispetto all'Editor per consentire un'ulteriore personalizzazione della vista.

XAML

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

Codice

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

Immagine

Le immagini sono parti molto importanti di qualsiasi applicazione. Offrono l'opportunità di inserire ulteriori elementi visivi e il branding nella tua applicazione. Per non parlare del fatto che le immagini sono in genere più interessanti da guardare rispetto a testo o pulsanti. Puoi utilizzare un'immagine come elemento autonomo all'interno dell'applicazione, ma un elemento Immagine può anche essere aggiunto ad altri elementi di visualizzazione come un pulsante.

XAML

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

Codice

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

Etichetta

Che ci crediate o no, l'etichetta è una delle classi di vista più importanti ma non sottovalutate, non solo in Xamarin.Forms, ma nello sviluppo dell'interfaccia utente in generale. È visto come una linea di testo piuttosto noiosa, ma senza quella linea di testo sarebbe molto difficile trasmettere certe idee all'utente. I controlli delle etichette possono essere utilizzati per descrivere ciò che l'utente dovrebbe inserire in un editor o controllo di inserimento. Possono descrivere una sezione dell'interfaccia utente e dargli un contesto. Possono essere utilizzati per mostrare il totale in un'app calcolatrice. Sì, l'etichetta è davvero il controllo più versatile nella tua borsa degli attrezzi che potrebbe non suscitare sempre molta attenzione, ma è il primo a notarlo se non è lì.

XAML

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

Codice

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