En esta presentación hablamos acerca de: Requisitos de Xamarin, ambientes de desarrollo, arquitectura de Xamarin, ventajas, Xamarin.Forms, Inyección de dependencias, se construirá un proyecto sencillo, novedades de licenciamiento de Xamarin. Por: Alder López Arquitecto y lider desarrollo .NET, Xamarin y aplicaciones móviles (Android , iOS, Windows Phone, Windows Universal).

1. www.sgcampus.com.mx @sgcampus
www.sgcampus.com.mx
@sgcampus
Alder Lopez
Xamarin: Una introducción al desarrollo de
aplicaciones móviles para Android & iOS

2. www.sgcampus.com.mx @sgcampus
Xamarin: Objetivo
Consideraciones:
• Es deseable tener conocimientos .NET, C#.
• Para desarrollar para iOS se requiere Mac como
estación para desarrollo o como servidor de
compilación con Xcode.
• Debe ser miembro del Apple Developer Program.
Objetivo General:
Al finalizar será capaz de desarrollar una aplicación
móvil para Android & iOS utilizando .NET.

3. www.sgcampus.com.mx @sgcampus
Xamarin: Herramientas
Ambiente de desarrollo:
Tenemos dos opciones para instalar el ambiente de
desarrollo, el primero es descargar el instalador de
X a m a r i n d e s d e l a p a g i n a
https://www.xamarin.com/; la segunda es
descargar Visual Studio Community 2015 (apartir
de que Micrsoft compro Xamarin en Marzo 2016).
En el caso de Mac la opción que tenemos es
instalar Xamarin Studio.

4. www.sgcampus.com.mx @sgcampus
Xamarin:Herramientas
Ambiente de desarrollo:
Al realizar la instalación, el mismo instalador nos
ayudará instalar Xcode, simuladores de iOS,
Android Studio, emuladores para Android.
Emuladores Android destacados:
Xamarin Android Player
https://www.xamarin.com/android-player
Genymotion
https://www.genymotion.com/

5. www.sgcampus.com.mx @sgcampus
Xamarin: Introducción
Xamarin es un cross-platform para el desarrollo de
aplicaciones móviles. Xamarin permite una
abstracción de objetos de tal forma que
desarrollamos un core el cual tendrá todo lo común
a los proyectos de la diferentes plataformas
(Android, iOS, Windows Phone).

6. www.sgcampus.com.mx @sgcampus
Xamarin: Arqutectura

7. www.sgcampus.com.mx @sgcampus
Xamarin: Estructura del proyecto

8. www.sgcampus.com.mx @sgcampus
Xamarin: Referencias

9. www.sgcampus.com.mx @sgcampus
Xamarin: Xamarin.Forms
Xamarin.Forms es un framework que permite a los
desarrolladores crear interfaces de usuario
rápidamente. Proporciona su propia abstracción
para la interfaz de usuario que se representa
utilizando controles nativos en iOS, Android,
Windows o Windows Phone. Esto significa que las
aplicaciones pueden compartir una gran parte de
su código de interfaz de usuario y todavía
conservar el aspecto nativo de la plataforma de
destino.

10. www.sgcampus.com.mx @sgcampus
Xamarin: Xamarin.Forms-
Páginas

11. www.sgcampus.com.mx @sgcampus
Xamarin: Xamarin.Forms -
Layout

12. www.sgcampus.com.mx @sgcampus
Xamarin: StackLayout
Al desarrollar con Xamarin.Forms, nuestra UI es
compartida por las plataformas especificadas en
nuestra solución de VS / XS.
La primera es que cualquier desarrollador que
tenga conocimientos en WPF le será muy familiar
desarrollar XAML, adicionalmente se parece en
algunos aspectos cuando estamos desarrollando
los Layout de Android.

13. www.sgcampus.com.mx @sgcampus
Xamarin: Código XAML
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://
schemas.microsoft.com/winfx/2006/xaml"
x:Class="HelloXamarinFormsWorldXaml.StackLayoutExample1" Padding="20">
<StackLayout Spacing="10">
<Label Text="Stop" BackgroundColor="Red" Font="20" />
<Label Text="Slow down" BackgroundColor="Yellow" Font="20" />
<Label Text="Go" BackgroundColor="Green" Font="20" />
</StackLayout>
</ContentPage>

14. www.sgcampus.com.mx @sgcampus
Xamarin: Código C#
public class StackLayoutExample : ContentPage
{
public StackLayoutExample()
{
Padding = new Thickness(20);
var red = new Label
{
Text = "Stop", BackgroundColor = Color.Red, FontSize = 20
};
var yellow = new Label
{
Text = "Slow down", BackgroundColor = Color.Yellow, FontSize = 20
};
var green = new Label
{
Text = "Go", BackgroundColor = Color.Green, FontSize = 20
};
Content = new StackLayout
{
Spacing = 10,
Children = { red, yellow, green }
};
}
}

15. www.sgcampus.com.mx @sgcampus
Xamarin: Navegación
Navegación:
Para navegar entre pantallas se utiliza
await Navigation.PushAsync(new CustomPage());
Para cerrar la pantalla se utiliza
await Navigation.PopAsync();

16. www.sgcampus.com.mx @sgcampus
Xamarin: DependencyService
Xamarin.Forms permite a los desarrolladores definir
el comportamiento en los proyectos específicos de
la plataforma.

17. www.sgcampus.com.mx @sgcampus
Xamarin: DependencyService

18. www.sgcampus.com.mx @sgcampus
Se requiere declarar una interfaz, la cual definirá la forma de
interactuar con la funcionalidad específica de la plataforma.
Interfaz
public interface ITextToSpeech {
void Speak ( string text ); //note that interface members are public by default
}
Implementación
namespace TextToSpeech.WinPhone
{
public class TextToSpeechImplementation : ITextToSpeech
{
public TextToSpeechImplementation() {}
public async void Speak(string text)
{
SpeechSynthesizer synth = new SpeechSynthesizer();
await synth.SpeakTextAsync(text);
}
}
}

19. www.sgcampus.com.mx @sgcampus
Registro
using TextToSpeech.WinPhone;
[assembly: Xamarin.Forms.Dependency (typeof (TextToSpeechImplementation))]
namespace TextToSpeech.WinPhone {
Uso en Xamarin
public MainPage ()
{
var speak = new Button {
Text = "Hello, Forms !",
VerticalOptions = LayoutOptions.CenterAndExpand,
HorizontalOptions = LayoutOptions.CenterAndExpand,
};
speak.Clicked += (sender, e) => {
DependencyService.Get<ITextToSpeech>().Speak("Hello from Xamarin Forms");
};
Content = speak;
}

20. www.sgcampus.com.mx @sgcampus
Xamarin.Forms Multiscreen
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:local="clr-namespace:Phoneword;assembly=Phoneword"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Phoneword.CallHistoryPage">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness"
iOS="20, 40, 20, 20"
Android="20, 20, 20, 20"
WinPhone="20, 20, 20, 20" />
</ContentPage.Padding>
<ContentPage.Content>
<StackLayout VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
Orientation="Vertical"
Spacing="15">
<ListView ItemsSource="{x:Static local:App.PhoneNumbers}" />
</StackLayout>
</ContentPage.Content>
</ContentPage>

21. www.sgcampus.com.mx @sgcampus
Dudas
¿Dudas?
Alder López
Chief software development / Research and development / NET Architect & Xamarin
https://mx.linkedin.com/in/alder1sismty
@devnet2
http://sg.com.mx/revista/47/desarrollo-apps-cross-platform-xamarinforms#.V0UPIGZEy8p

22. www.sgcampus.com.mx @sgcampus
Anexo
Ligas de interés:
https://developer.xamarin.com/guides/xamarin-forms/creating-mobile-apps-xamarin-forms/
https://developer.xamarin.com/guides/cross-platform/getting_started/requirements/
https://developer.xamarin.com/guides/cross-platform/getting_started/license/
https://developer.xamarin.com/guides/xamarin-forms/getting-started/introduction-to-xamarin-forms/
https://developer.xamarin.com/guides/xamarin-forms/dependency-service/device-orientation/
MvvmCross - https://github.com/slodge/MvvmCross/
Vernacular (for localization) - https://github.com/rdio/vernacular/
MonoGame (for XNA games) - http://monogame.codeplex.com/
NGraphics - NGraphics and its precursor https://github.com/praeclarum/CrossGraphics