Controles

Browse sample. Examinar la muestra

La interfaz de usuario de una aplicación .NET Multi-platform App UI (.NET MAUI) se construye de objetos que se asignan a los controles nativos de cada plataforma de destino.

Los grupos de controles principales que se usan para crear la interfaz de usuario de una aplicación .NET MAUI son páginas, diseños y vistas. Normalmente, una página de .NET MAUI ocupa la pantalla completa o la ventana. La página normalmente contiene un diseño, que contiene vistas y posiblemente otros diseños. Las páginas, los diseños y las vistas se derivan de la clase VisualElement. La clase proporciona una variedad de propiedades, métodos y eventos que son útiles en clases derivadas.

Nota:

ListView y TableView también admiten el uso de celdas. Las celdas son elementos especializados que se usan para los elementos de una lista y describen cómo debe representarse cada elemento.

Páginas

Las aplicaciones .NET MAUI constan de una o varias páginas. Normalmente, una página ocupa toda la pantalla o ventana, y cada página normalmente contiene al menos un diseño.

.NET MAUI contiene las páginas siguientes:

Página Descripción
ContentPage ContentPage muestra una sola vista y es el tipo de página más común. Para más información, consulta ContentPage.
FlyoutPage FlyoutPage es una página que administra dos páginas relacionadas de información: una página de control flotante que presenta elementos y una página de detalles que muestra detalles sobre los elementos de la página de control flotante. Para más información, consulta FlyoutPage.
NavigationPage NavigationPage ofrece una experiencia de navegación jerárquica en la que puedes navegar por las páginas hacia delante y hacia atrás, según tu preferencia. Para más información, consulta NavigationPage.
TabbedPage TabbedPage consta de una serie de páginas en las que se puede navegar con pestañas en la parte superior o inferior de la página, y cada cada pestaña carga el contenido de la página. Para más información, consulta TabbedPage.

Diseños

Los diseños de .NET MAUI se usan para componer controles de interfaz de usuario en estructuras visuales, y cada diseño normalmente contiene varias vistas. Las clases de diseño suelen contener lógica para establecer la posición y el tamaño de los elementos secundarios.

.NET MAUI contiene los siguientes diseños:

Diseño Descripción
AbsoluteLayout AbsoluteLayout coloca los elementos secundarios en ubicaciones específicas relativas a su elemento primario. Para más información, consulta AbsoluteLayout.
BindableLayout BindableLayout permite que cualquier clase de diseño genere su contenido enlazando a una colección de elementos, con la opción de establecer la apariencia de cada elemento. Para más información, consulta BindableLayout.
FlexLayout FlexLayout permite que sus elementos secundarios se apilen o encapsulen con diferentes opciones de alineación y orientación. FlexLayout se basa en el módulo de diseño de cuadro flexible CSS, conocido como diseño flexible o cuadro flexible. Para más información, consulta FlexLayout.
Grid Grid coloca sus elementos secundarios en una cuadrícula de filas y columnas. Para más información, consulta Cuadrícula.
HorizontalStackLayout HorizontalStackLayout coloca los elementos secundarios en una pila horizontal. Para más información, consulta HorizontalStackLayout.
StackLayout StackLayout coloca los elementos secundarios en una pila vertical u horizontal. Para más información, consulta StackLayout.
VerticalStackLayout VerticalStackLayout coloca los elementos secundarios en una pila vertical. Para más información, consulta VerticalStackLayout.

Vistas

Las vistas de .NET MAUI son objetos de interfaz de usuario, como etiquetas, botones y controles deslizantes que se conocen normalmente como controles o widgets en otros entornos.

.NET MAUI contiene las siguientes vistas:

Ver Descripción
ActivityIndicator ActivityIndicator usa una animación para mostrar que la aplicación está realizando una actividad larga, sin dar ninguna indicación del progreso. Para más información, consulta ActivityIndicator.
BlazorWebView BlazorWebView permite alojar una aplicación web Blazor en la aplicación .NET MAUI. Para más información, consulta BlazorWebView.
Border Border es un control de contenedor que dibuja un borde, un segundo plano o ambos, alrededor de otro control. Para más información, consulta Borde.
BoxView BoxView dibuja un rectángulo o cuadrado con una anchura, altura y color especificados. Para más información, consulta BoxView.
Button Button muestra texto y responde a una pulsación o clic que dirige una aplicación para llevar a cabo una tarea. Para más información, consulta Botón.
CarouselView CarouselView muestra una lista desplazable de elementos de datos, donde los usuarios deslizan el dedo para desplazarse por la colección. Para más información, consulta CarouselView.
CheckBox CheckBox permite seleccionar un valor booleano mediante un tipo de botón que puede estar seleccionado o vacío. Para más información, consulta CheckBox.
CollectionView CollectionView muestra una lista desplazable de elementos de datos seleccionables, utilizando diferentes especificaciones de diseño. Para obtener más información, vea CollectionView de .
ContentView ContentView es un control que permite crear controles personalizados y reutilizables. Para más información, consulta ContentView.
DatePicker DatePicker permite seleccionar una fecha con el selector de fecha de la plataforma. Para más información, consulta DatePicker.
Editor Editor permite escribir y editar varias líneas de texto. Para más información, consulta Editor.
Ellipse Ellipse muestra una elipse o un círculo. Para más información, consulta Elipse.
Entry Entry permite escribir y editar una sola línea de texto. Para más información, consulta Entrada.
Frame Frame se usa para ajustar una vista o diseño con un borde que se puede configurar con color, sombra y otras opciones. Para más información, consulta Marco.
GraphicsView GraphicsView es un lienzo gráfico en el que se pueden dibujar gráficos 2D con tipos del espacio de nombres Microsoft.Maui.Graphics. Para más información, consulta GraphicsView.
Image Image muestra una imagen que se puede cargar desde un archivo local, un identificador URI, un recurso incrustado o una secuencia. Para más información, consulta Imagen.
ImageButton ImageButton muestra una imagen y responde a una pulsación o clic que dirige una aplicación para llevar a cabo una tarea. Para más información, consulta ImageButton.
IndicatorView IndicatorView muestra indicadores que representan el número de elementos de CarouselView. Para más información, consulta IndicatorView.
Label Label muestra texto de una sola línea y varias líneas. Para más información, consulta Etiqueta.
Line Line muestra una línea de un punto inicial a un punto final. Para más información, consulta Línea.
ListView ListView muestra una lista desplazable de elementos de datos seleccionables. Para más información, consulta ListView.
Map Map muestra un mapa y requiere que el paquete Microsoft.Maui.Controls.Maps de NuGet esté instalado en la aplicación.
Path Path muestra curvas y formas complejas. Para más información, consulta Trazado.
Picker Picker muestra una breve lista de elementos, desde los que se puede seleccionar un elemento. Para más información, consulta Selector.
Polygon Polygon muestra un polígono. Para más información, consulta Polígono.
Polyline Polyline muestra una serie de líneas rectas conectadas. Para más información, consulta Polilínea.
ProgressBar ProgressBar usa una animación para mostrar que la aplicación progresa a través de una actividad larga. Para más información, consulta ProgressBar.
RadioButton RadioButton es un tipo de botón que permite seleccionar una opción de un conjunto. Para más información, consulta RadioButton.
Rectangle Rectangle muestra un rectángulo o un cuadrado. Para más información, consulta Rectángulo.
RefreshView RefreshView es un contenedor que proporciona una función de deslizar para el contenido desplazable. Para más información, consulta RefreshView.
RoundRectangle RoundRectangle muestra un rectángulo o cuadrado con esquinas redondeadas. Para más información, consulta Rectángulo.
ScrollView ScrollView proporciona desplazamiento de su contenido, que suele ser un diseño. Para más información, consulta ScrollView.
SearchBar SearchBar es un control de entrada de usuario que se usa para iniciar una búsqueda. Para más información, consulta SearchBar.
Slider Slider permite seleccionar un valor double de un rango continuo. Para más información, consulta Control deslizante.
Stepper Stepper permite seleccionar un valor double de un rango de valores incrementales. Para obtener más información, consulta Stepper.
SwipeView SwipeView es un control de contenedor que se ajusta alrededor de un elemento de contenido y proporciona elementos de menú contextual que se muestran mediante un gesto de deslizar el dedo. Para más información, consulta SwipeView.
Switch Switch permite seleccionar un valor booleano con un tipo de botón que puede estar activado o desactivado. Para obtener más información, consulte switch.
TableView TableView muestra una tabla de elementos desplazables que se pueden agrupar en secciones. Para más información, consulta TableView.
TimePicker TimePicker permite seleccionar una hora con el selector de hora de la plataforma. Para más información, consulta TimePicker.
TwoPaneView TwoPaneView representa un contenedor con dos vistas que ajustan el tamaño y la posición del contenido en el espacio disponible, ya sea en paralelo o de arriba a abajo. Para más información, consulta TwoPaneView.
WebView WebView muestra páginas web o contenido HTML local. Para más información, consulta Vista web.