Xamarin.Forms
Xamarin.Formas vistas

Botón

El botón es probablemente el control más común no solo en aplicaciones móviles, sino en cualquier aplicación que tenga una interfaz de usuario. El concepto de un botón tiene demasiados propósitos para enumerar aquí. Sin embargo, en términos generales, utilizará un botón para permitir a los usuarios iniciar algún tipo de acción u operación dentro de su aplicación. Esta operación podría incluir cualquier cosa, desde la navegación básica dentro de su aplicación, hasta el envío de datos a un servicio web en algún lugar de Internet.

XAML

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

Código XAML detrás

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

Código

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

Selector de fechas

Muy a menudo dentro de las aplicaciones móviles, habrá una razón para tratar con las fechas. Cuando trabaje con fechas, probablemente necesitará algún tipo de información del usuario para seleccionar una fecha. Esto podría ocurrir cuando se trabaja con una aplicación de calendario o calendario. En este caso, es mejor proporcionar a los usuarios un control especializado que les permita elegir una fecha de manera interactiva, en lugar de requerir que los usuarios escriban una fecha manualmente. Aquí es donde el control DatePicker es realmente útil.

XAML

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

Código

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

Entrada

La Vista de entrada se utiliza para permitir a los usuarios escribir una sola línea de texto. Esta única línea de texto se puede usar para múltiples propósitos, incluyendo el ingreso de notas básicas, credenciales, URL y más. Esta vista es una vista multipropósito, lo que significa que si necesita escribir texto regular o quiere ocultar una contraseña, todo se hace a través de este único control.

XAML

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

Código

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

Editor

El Editor es muy similar a la Entrada, ya que permite a los usuarios ingresar texto de forma libre. La diferencia es que el Editor permite la entrada multilínea, mientras que la entrada solo se utiliza para la entrada de una sola línea. La Entrada también proporciona algunas propiedades más que el Editor para permitir una mayor personalización de la Vista.

XAML

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

Código

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

Imagen

Las imágenes son partes muy importantes de cualquier aplicación. Brindan la oportunidad de inyectar elementos visuales adicionales, así como de marca en su aplicación. Sin mencionar que las imágenes suelen ser más interesantes de ver que el texto o los botones. Puede usar una imagen como elemento independiente dentro de su aplicación, pero un elemento de imagen también se puede agregar a otros elementos de vista, como un botón.

XAML

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

Código

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

Etiqueta

Lo creas o no, el Label es una de las clases de View más importantes y menos apreciadas, no solo en Xamarin.Forms, sino en el desarrollo de IU en general. Se ve como una línea de texto bastante aburrida, pero sin esa línea de texto sería muy difícil transmitir ciertas ideas al usuario. Los controles de etiqueta se pueden usar para describir lo que el usuario debe ingresar en un editor o control de entrada. Pueden describir una sección de la interfaz de usuario y darle contexto. Se pueden utilizar para mostrar el total en una aplicación de calculadora. Sí, la etiqueta es realmente el control más versátil en su bolsa de herramientas que puede no siempre despertar mucha atención, pero es la primera que se observa si no está allí.

XAML

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

Código

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