Controles

Examinar el ejemplo

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.