DESARROLLO DE APLICACIONES
MOVILES
Interactúa con el Entorno de Desarrollo
Ingeniería De Software Con Inteligencia Artificia
DESARROLLO DE APLICACIONES
MOVILES
Objetivo
Objetivos de la lección Al finalizar esta lección, los
participantes podrán tener los conocimientos para:
Introducción a Xamarin
Recursos y estilos para el entorno de desarrollo de
aplicaciones móviles en Xamarin Forms usando Visual Studio
Diseño y desarrollo de aplicaciones
móviles I
Front End XAML
BACKEND
XAML es el lenguaje de
formato para la interfaz de
usuario.
HTML es el código que
se utiliza para
estructurar y
desplegar una página
web y sus contenidos
Patrón de Diseño
Patrón de Diseño - MVVM
Diseño y desarrollo de aplicaciones
móviles I
¿Qué es Xamarin?
Xamarin es una plataforma de desarrollo de aplicaciones móviles que
permite a los desarrolladores crear aplicaciones nativas para iOS,
Android y Windows utilizando un solo conjunto de códigos fuente.
Xamarin utiliza el lenguaje de programación C# y el entorno de
desarrollo .NET, permitiendo a los desarrolladores aprovechar sus
habilidades existentes para construir aplicaciones móviles con
multiplataforma de alto rendimiento.
Creación de Proyectos
Xamarin Form
Crea aplicaciones
multiplataforma con C#
XAMARIN
Diseño y desarrollo de aplicaciones
móviles I
Las características clave de Xamarin
incluyen:
Desarrollo Multiplataforma: Permite a los desarrolladores escribir código una vez y
ejecutarlo en múltiples plataformas, lo que facilita la creación de aplicaciones nativas
para iOS, Android y Windows.
Acceso a APIs Nativas: Xamarin proporciona acceso completo a las API nativas de
cada plataforma, lo que permite a los desarrolladores aprovechar las características
específicas de cada sistema operativo
Entorno Integrado: Se integra con Visual Studio, el entorno de desarrollo de
Microsoft, ofreciendo una experiencia de desarrollo unificada y familiar para los
desarrolladores de .NET.
Xamarin. Forms: Ofrece una capa de abstracción adicional que permite a los
desarrolladores crear interfaces de usuario compartidas entre las plataformas,
simplificando el desarrollo de la interfaz de usuario.
Compatibilidad con Xamarin. Essentials: Una biblioteca que proporciona acceso a
características del dispositivo comunes, como la cámara, la geolocalización y los
sensores, de manera uniforme en las plataformas admitidas.
Xamarin ha sido adquirido por Microsoft y se ha integrado estrechamente con el
ecosistema de desarrollo de la empresa. Es una opción popular para aquellos
desarrolladores que desean crear aplicaciones móviles nativas y al mismo tiempo
minimizar la duplicación de esfuerzos en el desarrollo para diferentes plataformas.
El esquema ilustra la estructura general de una aplicación multiplataforma en
Xamarin.
Esta herramienta posibilita la creación de interfaces de usuario nativas en cada
plataforma, mientras que la lógica de negocios se codifica en C# y se comparte entre
las distintas plataformas.
En la mayoría de los escenarios, Xamarin permite compartir aproximadamente el
80 % del código de la aplicación.
Xamarin. Essentials. Es una biblioteca que ofrece una interfaz de programación
de aplicaciones (API) multiplataforma para acceder a características nativas de
dispositivos.
Al igual que Xamarin, Xamarin. Essentials sirve como una capa de abstracción
que simplifica el proceso de acceso a funcionalidades nativas. Entre los ejemplos
de funcionalidades proporcionadas por Xamarin.
Essentials se incluyen:
• Información del dispositivo.
• Sistema de archivos.
• Acelerómetro.
• Marcador telefónico.
• Texto a voz.
• Bloqueo de pantalla
Diseño y desarrollo de aplicaciones
móviles I
Funcionamiento de Xamarin.
Xamarin se integra con .NET, el cual automatiza tareas esenciales como la asignación
de memoria, la recolección de elementos no utilizados y la interoperabilidad con las
plataformas subyacentes
Las aplicaciones Xamarin. Android se generan a partir de C# en lenguaje
intermedio (IL), que posteriormente se compila mediante Just-in-Time (JIT) en un
ensamblado nativo cuando la aplicación se inicia.
Estas aplicaciones se ejecutan en el entorno de ejecución Mono, que coexiste con la
máquina virtual en tiempo de ejecución de Android (ART). Xamarin facilita la conexión
entre los espacios de nombres Android. y Java. mediante enlaces .NET.
Xamarin.Forms: Es un marco de desarrollo de interfaz de usuario de código
abierto que posibilita a los desarrolladores construir aplicaciones para Xamarin.
IOS, Android y Windows mediante un único código base compartido.
Facilita la creación de interfaces de usuario a través de XAML, con el código
subyacente desarrollado en C#.
Estas interfaces de usuario se representan como controles nativos con un
rendimiento optimizado en cada plataforma respectiva. Algunas características
proporcionadas por Xamarin.Forms incluyen:
• Uso del lenguaje de interfaz de usuario XAML
• Enlace de datos
• Gestos - Efectos
• Aplicación de estilos
¿Qué es XAML?
XAML (Lenguaje de marcado de aplicaciones extensible) es un lenguaje de
marcado basado en XML utilizado principalmente para crear interfaces de
usuario en aplicaciones.
Fue introducido como parte de una plataforma más amplia para el desarrollo de
aplicaciones en experiencia de usuario.
XAML permite separar la lógica de la aplicación del diseño de la interfaz, lo que
facilita el trabajo colaborativo entre desarrolladores y diseñadores.
XAML nació con la necesidad de tener un lenguaje declarativo que permitiera
definir elementos de la interfaz de usuario de forma estructurada.
Esto ayuda a que el código sea más legible y mantenible.
Su integración con tecnologías de desarrollo de aplicaciones permite
una flexibilidad en la creación de aplicaciones gráficas.
XAML tiene varias ventajas sobre el código imperativo equivalente.
• El código XAML suele ser más compacto y legible que el código equivalente.
• La jerarquía inherente Padre e Hijo de XML permite a XAML imitar con mayor
claridad visual la jerarquía Padre e Hijo de los objetos de la interfaz de usuario.
• El código XAML puede ser fácilmente escrito de forma manual por los
programadores, pero también puede ser generado por herramientas visuales como
Microsoft Blend.
Ventajas de XAML
Diseño y desarrollo de aplicaciones
móviles I
XAML Desventajas
 XAML no puede contener código imperativo. Todos los controladores de
eventos deben ser definidos en un archivo de código.
 XAML no puede contener ciclos para procesamiento repetitivo. Sin
embargo, varios objetos visuales de Xamarin.Forms pueden generar
múltiples elementos como por ejemplo el objeto ListView que puede
generar varios elementos dependiendo de los objetos en su colección
ItemsSource.
 XAML no puede contener procesamiento condicional, sin embargo, un
enlace de datos puede hacer referencia a un convertidor de enlace basado
en código que permite un procesamiento condicional de forma eficaz.
Diseño y desarrollo de aplicaciones
móviles I
Diseño y desarrollo de aplicaciones
móviles I
 Generalmente, XAML no puede crear instancias de clases que no definen un constructor
sin parámetros. Sin embargo, algunas veces existe un mecanismo para evitar esta
restricción.
 Generalmente, XAML no puede invocar métodos. Sin embargo, algunas veces también
existe un mecanismo para evitar esta restricción.
 Aún no existe un diseñador visual para generar código XAML en aplicaciones
Xamarin.Forms.
En una aplicación Xamarin.Forms, XAML se usa principalmente para definir el
contenido visual de una página y funciona junto con un archivo de código
subyacente (code-behind) C#.
En este laboratorio examinaremos la anatomía de un archivo
XAML.
1.Abre Visual Studio bajo el contexto del administrador.
2.Crea una nueva solución Xamarin.Forms vacía utilizando .NET Standard como
la estrategia para compartir código y con destino para al menos 2 plataformas.
El explorador de soluciones mostrará una estructura similar a la siguiente:
Laboratorio Examinando la anatomía de un archivo XAML
Diseño y desarrollo de aplicaciones
móviles I
3. Actualiza el paquete NuGet Xamarin.Forms a su
versión más reciente.
4. Ejecuta tu aplicación para verificar que todo
funcione correctamente. Las siguientes imágenes
muestran la ejecución de la aplicación en iOS y
Android.
Diseño y desarrollo de aplicaciones
móviles I
Examinemos ahora la anatomía de un archivo XAML.
5. En el proyecto compartido existen dos archivos con los siguientes
nombres:
• App.xaml, un archivo XAML.
• App.xaml.cs, un archivo de código subyacente C# asociado al archivo
XAML.
Los dos archivos App.xaml y App.xaml.cs contribuyen una clase llamada App.
6. Haz clic sobre el archivo App.xaml.cs para abrirlo y observa la definición de la clase App.
public partial class App : Application
Puedes observar que la clase App deriva de la clase Xamarin.Forms.Application.
Diseño y desarrollo de aplicaciones
móviles I
La mayoría de las clases de otros archivos XAML contribuyen una clase que deriva de
ContentPage, estos archivos utilizan XAML para definir el contenido visual de una página.
Tal es el caso de los otros dos archivos del proyecto:
• MainPage.xaml, un archivo XAML.
• MainPage.xaml.cs, un archivo de código subyacente C# asociado al archivo XAML.
Examinemos el contenido de un archivo XAML.
7. Haz clic sobre el archivo MainPage.xaml para abrirlo en el editor de código
XAML. Las dos primeras declaraciones de espacio de nombres XML (xmlns)
hacen referencia a URIs.
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
Diseño y desarrollo de aplicaciones
móviles I
Nuestra Primera Aplicación
Xamarin Form
Crear nuestra primera
Aplicación
HolaMundo
Clic en Blanco
Clic derecho en la clase HolaMudo
Seleccionamos Actualizaciones y
aceptamos los términos
Agregamos un nuevo elemento
Llamado BienvenidoPage
Eliminamos el contenido de esta
pagina
Insertamos la siguiente linea de
codigo
Aquí se ha creado un controlador
de evento
Dentro de este metodo Asignamos la alerta con
DisplayAlert( )
Esta pagina se creo por defecto al crear el proyecto.
Se usa para establecer la pagina de inicio de nuestra
aplicación
Cambiamos el nombre que viene
por defecto x
Semanahhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh

Semanahhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh

  • 1.
    DESARROLLO DE APLICACIONES MOVILES Interactúacon el Entorno de Desarrollo Ingeniería De Software Con Inteligencia Artificia DESARROLLO DE APLICACIONES MOVILES
  • 2.
    Objetivo Objetivos de lalección Al finalizar esta lección, los participantes podrán tener los conocimientos para: Introducción a Xamarin Recursos y estilos para el entorno de desarrollo de aplicaciones móviles en Xamarin Forms usando Visual Studio Diseño y desarrollo de aplicaciones móviles I
  • 3.
  • 4.
    XAML es ellenguaje de formato para la interfaz de usuario. HTML es el código que se utiliza para estructurar y desplegar una página web y sus contenidos
  • 5.
  • 6.
  • 7.
    Diseño y desarrollode aplicaciones móviles I ¿Qué es Xamarin? Xamarin es una plataforma de desarrollo de aplicaciones móviles que permite a los desarrolladores crear aplicaciones nativas para iOS, Android y Windows utilizando un solo conjunto de códigos fuente. Xamarin utiliza el lenguaje de programación C# y el entorno de desarrollo .NET, permitiendo a los desarrolladores aprovechar sus habilidades existentes para construir aplicaciones móviles con multiplataforma de alto rendimiento. Creación de Proyectos
  • 8.
  • 9.
    XAMARIN Diseño y desarrollode aplicaciones móviles I Las características clave de Xamarin incluyen: Desarrollo Multiplataforma: Permite a los desarrolladores escribir código una vez y ejecutarlo en múltiples plataformas, lo que facilita la creación de aplicaciones nativas para iOS, Android y Windows. Acceso a APIs Nativas: Xamarin proporciona acceso completo a las API nativas de cada plataforma, lo que permite a los desarrolladores aprovechar las características específicas de cada sistema operativo Entorno Integrado: Se integra con Visual Studio, el entorno de desarrollo de Microsoft, ofreciendo una experiencia de desarrollo unificada y familiar para los desarrolladores de .NET.
  • 10.
    Xamarin. Forms: Ofreceuna capa de abstracción adicional que permite a los desarrolladores crear interfaces de usuario compartidas entre las plataformas, simplificando el desarrollo de la interfaz de usuario. Compatibilidad con Xamarin. Essentials: Una biblioteca que proporciona acceso a características del dispositivo comunes, como la cámara, la geolocalización y los sensores, de manera uniforme en las plataformas admitidas. Xamarin ha sido adquirido por Microsoft y se ha integrado estrechamente con el ecosistema de desarrollo de la empresa. Es una opción popular para aquellos desarrolladores que desean crear aplicaciones móviles nativas y al mismo tiempo minimizar la duplicación de esfuerzos en el desarrollo para diferentes plataformas.
  • 11.
    El esquema ilustrala estructura general de una aplicación multiplataforma en Xamarin. Esta herramienta posibilita la creación de interfaces de usuario nativas en cada plataforma, mientras que la lógica de negocios se codifica en C# y se comparte entre las distintas plataformas. En la mayoría de los escenarios, Xamarin permite compartir aproximadamente el 80 % del código de la aplicación.
  • 12.
    Xamarin. Essentials. Esuna biblioteca que ofrece una interfaz de programación de aplicaciones (API) multiplataforma para acceder a características nativas de dispositivos. Al igual que Xamarin, Xamarin. Essentials sirve como una capa de abstracción que simplifica el proceso de acceso a funcionalidades nativas. Entre los ejemplos de funcionalidades proporcionadas por Xamarin. Essentials se incluyen: • Información del dispositivo. • Sistema de archivos. • Acelerómetro. • Marcador telefónico. • Texto a voz. • Bloqueo de pantalla
  • 14.
    Diseño y desarrollode aplicaciones móviles I Funcionamiento de Xamarin. Xamarin se integra con .NET, el cual automatiza tareas esenciales como la asignación de memoria, la recolección de elementos no utilizados y la interoperabilidad con las plataformas subyacentes Las aplicaciones Xamarin. Android se generan a partir de C# en lenguaje intermedio (IL), que posteriormente se compila mediante Just-in-Time (JIT) en un ensamblado nativo cuando la aplicación se inicia. Estas aplicaciones se ejecutan en el entorno de ejecución Mono, que coexiste con la máquina virtual en tiempo de ejecución de Android (ART). Xamarin facilita la conexión entre los espacios de nombres Android. y Java. mediante enlaces .NET.
  • 15.
    Xamarin.Forms: Es unmarco de desarrollo de interfaz de usuario de código abierto que posibilita a los desarrolladores construir aplicaciones para Xamarin. IOS, Android y Windows mediante un único código base compartido. Facilita la creación de interfaces de usuario a través de XAML, con el código subyacente desarrollado en C#. Estas interfaces de usuario se representan como controles nativos con un rendimiento optimizado en cada plataforma respectiva. Algunas características proporcionadas por Xamarin.Forms incluyen: • Uso del lenguaje de interfaz de usuario XAML • Enlace de datos • Gestos - Efectos • Aplicación de estilos
  • 16.
    ¿Qué es XAML? XAML(Lenguaje de marcado de aplicaciones extensible) es un lenguaje de marcado basado en XML utilizado principalmente para crear interfaces de usuario en aplicaciones. Fue introducido como parte de una plataforma más amplia para el desarrollo de aplicaciones en experiencia de usuario. XAML permite separar la lógica de la aplicación del diseño de la interfaz, lo que facilita el trabajo colaborativo entre desarrolladores y diseñadores. XAML nació con la necesidad de tener un lenguaje declarativo que permitiera definir elementos de la interfaz de usuario de forma estructurada. Esto ayuda a que el código sea más legible y mantenible. Su integración con tecnologías de desarrollo de aplicaciones permite una flexibilidad en la creación de aplicaciones gráficas.
  • 17.
    XAML tiene variasventajas sobre el código imperativo equivalente. • El código XAML suele ser más compacto y legible que el código equivalente. • La jerarquía inherente Padre e Hijo de XML permite a XAML imitar con mayor claridad visual la jerarquía Padre e Hijo de los objetos de la interfaz de usuario. • El código XAML puede ser fácilmente escrito de forma manual por los programadores, pero también puede ser generado por herramientas visuales como Microsoft Blend. Ventajas de XAML Diseño y desarrollo de aplicaciones móviles I
  • 18.
    XAML Desventajas  XAMLno puede contener código imperativo. Todos los controladores de eventos deben ser definidos en un archivo de código.  XAML no puede contener ciclos para procesamiento repetitivo. Sin embargo, varios objetos visuales de Xamarin.Forms pueden generar múltiples elementos como por ejemplo el objeto ListView que puede generar varios elementos dependiendo de los objetos en su colección ItemsSource.  XAML no puede contener procesamiento condicional, sin embargo, un enlace de datos puede hacer referencia a un convertidor de enlace basado en código que permite un procesamiento condicional de forma eficaz. Diseño y desarrollo de aplicaciones móviles I
  • 19.
    Diseño y desarrollode aplicaciones móviles I  Generalmente, XAML no puede crear instancias de clases que no definen un constructor sin parámetros. Sin embargo, algunas veces existe un mecanismo para evitar esta restricción.  Generalmente, XAML no puede invocar métodos. Sin embargo, algunas veces también existe un mecanismo para evitar esta restricción.  Aún no existe un diseñador visual para generar código XAML en aplicaciones Xamarin.Forms.
  • 20.
    En una aplicaciónXamarin.Forms, XAML se usa principalmente para definir el contenido visual de una página y funciona junto con un archivo de código subyacente (code-behind) C#. En este laboratorio examinaremos la anatomía de un archivo XAML. 1.Abre Visual Studio bajo el contexto del administrador. 2.Crea una nueva solución Xamarin.Forms vacía utilizando .NET Standard como la estrategia para compartir código y con destino para al menos 2 plataformas. El explorador de soluciones mostrará una estructura similar a la siguiente: Laboratorio Examinando la anatomía de un archivo XAML Diseño y desarrollo de aplicaciones móviles I
  • 21.
    3. Actualiza elpaquete NuGet Xamarin.Forms a su versión más reciente. 4. Ejecuta tu aplicación para verificar que todo funcione correctamente. Las siguientes imágenes muestran la ejecución de la aplicación en iOS y Android. Diseño y desarrollo de aplicaciones móviles I
  • 22.
    Examinemos ahora laanatomía de un archivo XAML. 5. En el proyecto compartido existen dos archivos con los siguientes nombres: • App.xaml, un archivo XAML. • App.xaml.cs, un archivo de código subyacente C# asociado al archivo XAML. Los dos archivos App.xaml y App.xaml.cs contribuyen una clase llamada App. 6. Haz clic sobre el archivo App.xaml.cs para abrirlo y observa la definición de la clase App. public partial class App : Application Puedes observar que la clase App deriva de la clase Xamarin.Forms.Application. Diseño y desarrollo de aplicaciones móviles I
  • 23.
    La mayoría delas clases de otros archivos XAML contribuyen una clase que deriva de ContentPage, estos archivos utilizan XAML para definir el contenido visual de una página. Tal es el caso de los otros dos archivos del proyecto: • MainPage.xaml, un archivo XAML. • MainPage.xaml.cs, un archivo de código subyacente C# asociado al archivo XAML. Examinemos el contenido de un archivo XAML. 7. Haz clic sobre el archivo MainPage.xaml para abrirlo en el editor de código XAML. Las dos primeras declaraciones de espacio de nombres XML (xmlns) hacen referencia a URIs. xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" Diseño y desarrollo de aplicaciones móviles I
  • 24.
  • 25.
  • 26.
    Clic derecho enla clase HolaMudo
  • 27.
  • 28.
    Agregamos un nuevoelemento Llamado BienvenidoPage
  • 29.
    Eliminamos el contenidode esta pagina Insertamos la siguiente linea de codigo
  • 30.
    Aquí se hacreado un controlador de evento Dentro de este metodo Asignamos la alerta con DisplayAlert( ) Esta pagina se creo por defecto al crear el proyecto. Se usa para establecer la pagina de inicio de nuestra aplicación Cambiamos el nombre que viene por defecto x