Plataformas de desarrollo Móvil

Tema: Elementos GUI

Docente: Mg. Renato Toasa

Importa mucho más lo que tú piensas de ti mismo que
lo que los otros piensen de ti.

Séneca
Emprende Trasciende Innova
 Contenido
Objetivo Elementos GUI
● Label
● Entry
Añadir elementos visuales al ● Button
proyecto móvil ● Picker
● DatePicker
● DisplayAlert
● View
Elementos GUI
.NET MAUI
Elementos GUI

La Interfaz de Usuario (UI) de la aplicación está definida en términos de páginas (pages) y vistas
(views).

● Views son los controles de UI con los que el usuario interactúa

● Page representa una pantalla única que se muestra en la aplicación

Emprende Trasciende Innova

.NET MAUI
Elementos GUI

En .NET MAUI existen más de 40 elementos visuales: páginas, layouts y controles que pueden
ser escritos mediante código en lenguaje C# o en lenguaje XAML.

Data Binding permite enlazar propiedades de dos objetos one-way (y sus variantes), two-way y
one-me.

Puedes navegar entre páginas.

Emprende Trasciende Innova

.NET MAUI
Elementos GUI

Los archivos de XAML (.xaml) y Code behind (.xaml.cs) están ligados uno con el otro.

X:Class identifica el nombre

completo de la clase definida en
el archivo de code behind

Emprende Trasciende Innova

.NET MAUI
Elementos GUI

1. Label: Etiqueta de texto, no ingreso de datos.

https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/label
2. Entry: Caja de texto, para ingreso de datos.
https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/entry
3. Button: Es un control que ejecuta una acción.
https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/button
4. Picker: Es un control para seleccionar un elemento de texto de una lista de datos.
https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/picker
5. DatePicker: Invoca el control del selector de fecha de la plataforma y permite al usuario seleccionar
una fecha
https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/datepicker
Emprende Trasciende Innova
.NET MAUI
Elementos GUI - Picker

Emprende Trasciende Innova

.NET MAUI
Elementos GUI - DatePicker

Emprende Trasciende Innova

.NET MAUI
Tarea: Realizar una APP móvil que simula el sistema de calificaciones de la UISRAEL

EJEMPLO:
Imprimir en un Display Alert:
Nombre: Estudiante: Picker (5 Compañeros) Use ("\n”), para saltos de línea
Nota Seguimiento 1 : Sobre 10 *(0.3)
Nombre
Examen 1 Sobre 10 *(0.2)
Fecha
Nota Parcial 1: Suma(Nota Seguimiento 1 + Examenl 1) Nota Parcial 1
------------------------------------------------ Nota Parcial 2
Nota Final
Nota Seguimiento 2 : Sobre 10 *(0.3)
Estado
Examen 2: Sobre 10 *(0.2)
Nota Parcial 2: Suma(Nota Seguimiento 2 + Examenl 2)
Nota Final: Nota Parcial 1 + Nota Parcial 2
Fecha: DatePicker
Estado: "Aprobado (Nota Final >=7) ( Nota >=5 && Nota<=6.9)“Complementario”, (Nota <5) “REPROBADO”.
Emprende Trasciende Innova
Realizar todos los controles necesarios: (Rangos, datos numéricos).
 Gracias

Responsabilidad con pensamiento positivo