microsoft tech summit - taller xamarin

58
Microsoft Summit 5 y 6 de octubre, 2016 #TechSum

Upload: javier-suarez-ruiz

Post on 12-Jan-2017

1.853 views

Category:

Software


2 download

TRANSCRIPT

Page 1: Microsoft Tech Summit - Taller Xamarin

Microsoft Summit5 y 6 de octubre, 2016

#TechSum

Page 2: Microsoft Tech Summit - Taller Xamarin

#TechSum

Taller XamarinJavier SuárezJosué YerayMarcos CobeñaRafa Serna

Page 3: Microsoft Tech Summit - Taller Xamarin

#TechSum

Plain Concepts GO!!! Sorteamos …1 Juego Deus EXSi cazas a 5 Plain speakers

1 Curso desarrollo appsSi cazas a nuestro MVP Javier Suárez

1 Dron con cámaraSi aciertas todas las preguntas del test de nuestro stand http://plainconceptsgo.azurewebsites.net/

Page 4: Microsoft Tech Summit - Taller Xamarin

En nuestro curso online de:

10% de descuento

www.campusMVP.es

Usa este cupón en campusMVP.es:

xamarindo

Válido hasta el 31 de Diciembre de 2016

Page 5: Microsoft Tech Summit - Taller Xamarin

#TechSum

¿Qué vamos a ver?Introducción al tallerIntroducción a XamarinCreación proyectoEstructura proyectoMVVMPrimeras pruebas enlace a datos

La interfaz compartidaPáginas, Layouts y controles en Xamarin.FormsRecursos y estilosCreando la interfaz básica de nuestra App

Creación de serviciosConceptos básicos relacionados con serviciosCreación de servicios (navegación y REST)Usando plugins

NavegaciónConceptos básicos de navegaciónCompletar la App

Page 6: Microsoft Tech Summit - Taller Xamarin

#TechSum

Introducción al taller

Page 7: Microsoft Tech Summit - Taller Xamarin

#TechSum

• Crearemos una aplicación meteorológica con información real. Veremos conceptos como:• Crear estructura Proyecto.• Aplicar MVVM.• Diseño de vistas.• Navegación.• Uso de plugins.

• La aplicación se realizará paso a paso, en diferentes bloques a lo largo de 2,5h.

• A lo largo del taller, contaremos con diferentes responsables que se encargarán tanto de hacer la aplicación paso a paso como de resolver dudas.

• También tendremos alguna sorpresa y detalle ;)

El taller

Page 8: Microsoft Tech Summit - Taller Xamarin

#TechSum

No dudéis en preguntar!

Page 9: Microsoft Tech Summit - Taller Xamarin

#TechSum

Introducción a Xamarin

Page 10: Microsoft Tech Summit - Taller Xamarin

Xamarin – Solución completa para el Desarrollo móvil

Develop Testear Build Distribuir Monitorear

Page 11: Microsoft Tech Summit - Taller Xamarin

#TechSum

Código nativo

iOS WindowsAndroid

Objective-CXcode

C#Visual Studio

JavaAndroid Studio

No se comparte código • Diferentes lenguajes & entornos de desarrollo • Diferentes equipos

Page 12: Microsoft Tech Summit - Taller Xamarin

#TechSum

Escribe una vez, corre en todos

App Generator

LuaJavascript

ActionscriptHTML+CSS

Acceso limitado a APIs • Menos rendimiento • Experiencia de usuario más pobre

Page 13: Microsoft Tech Summit - Taller Xamarin

#TechSum

El enfoque de Xamarin

Código común compartido • Acceso 100% a APIs nativas • Alto rendimiento

iOS C# UI

Windows C# UIAndroid C# UI

Shared C# Mobile

Page 14: Microsoft Tech Summit - Taller Xamarin

Xamarin + Xamarin.Forms

Enfoque tradicional Con Xamarin.Forms:Más código compartido, nativo

iOS C# UI Windows C#

UIAndroid C# UI

Shared C# Backend

Shared UI Code

Shared C# Backend

Page 15: Microsoft Tech Summit - Taller Xamarin

#TechSum

El enfoque de Xamarin

Código común compartido • Acceso 100% a APIs nativas • Alto rendimiento

iOS C# UI

Windows C# UIAndroid C# UI

Shared C# Mobile

C# Server

Linux/MonoCoreCLRAzure

Shared C# Client/Server

Page 16: Microsoft Tech Summit - Taller Xamarin

Xamarin ahora gratis e incluido en Visual

Studio

Page 17: Microsoft Tech Summit - Taller Xamarin

#TechSum

Rendimiento nativo

Xamarin.iOS usa la compilación Ahead Of Time (AOT) para crear un binario ARM para la Apple’s App Store.

Xamarin.Android toma ventaja de la compilación Just In Time (JIT) en dispositivos Android.

Page 18: Microsoft Tech Summit - Taller Xamarin

Open Source – open.xamarin.com

Page 19: Microsoft Tech Summit - Taller Xamarin

Open Source• Xamarin.iOS• Xamarin.Mac• Xamarin.Android• Xamarin.Forms• Bindings & Plugins

• Cómo arrancar• Guías de contribución

Page 20: Microsoft Tech Summit - Taller Xamarin

#TechSum

C# mola

Y lo sabes!

Page 21: Microsoft Tech Summit - Taller Xamarin

#TechSum

C# mola

LINQ

XML

Gestión de eventos y delegados

Page 22: Microsoft Tech Summit - Taller Xamarin

#TechSum

Async/Await

Código más simple, mantenimiento

Page 23: Microsoft Tech Summit - Taller Xamarin

#TechSum

Android ItemClick, ¿ves diferencias?C# con Xamarin

Java

C# & Async con Xamarin

Page 24: Microsoft Tech Summit - Taller Xamarin

#TechSum

DEMO: Crear proyectoConociendo las plantillas y contenido básico

Page 25: Microsoft Tech Summit - Taller Xamarin

#TechSum

¿Cómo funciona es Xamarin?

Page 26: Microsoft Tech Summit - Taller Xamarin

#TechSum

Windows APIs

Microsoft.Phone Microsoft.Networking

Windows.Storage

Windows.Foundation

Microsoft.Devices

System.Data System.Windows

System.Numerics System.Core System.ServiceMod

el

System.Net System System.IO System.Linq System.Xml

Page 27: Microsoft Tech Summit - Taller Xamarin

#TechSum

iOS – Acceso al 100% de las APIs

MapKit UIKit iBeacon CoreGraphics CoreMotion

System.Data System.Windows

System.Numerics System.Core System.ServiceMod

el

System.Net System System.IO System.Linq System.Xml

Page 28: Microsoft Tech Summit - Taller Xamarin

#TechSum

Android – Acceso al 100%de las APIs

Text-to-speech ActionBar Printing Framework Renderscript NFC

System.Data System.Windows

System.Numerics System.Core System.ServiceMod

el

System.Net System System.IO System.Linq System.Xml

Page 29: Microsoft Tech Summit - Taller Xamarin

#TechSum

Cualquier cosa que puedas hacer con Objective-C, Swift, o Java

se puede hacer con C# y Visual Studio con Xamarin.

Page 30: Microsoft Tech Summit - Taller Xamarin

#TechSum

La clave, compartir código

Page 31: Microsoft Tech Summit - Taller Xamarin

#TechSum

1 libreríaMúltiples PlatformasIncluidas:Xamarin.iOS y Xamarin.Android

Portable Class Libraries

Page 32: Microsoft Tech Summit - Taller Xamarin

#TechSum

Estadísticas de código compartido

Mac

iOS

Android

Windows Phone

iCircuit Touch Draw

86%

14%

72%

28%

70%

30%

61%

39%

88%

12%

76%

24%

90%

10%

Page 33: Microsoft Tech Summit - Taller Xamarin

#TechSum

Introducción a Xamarin.Forms

Page 34: Microsoft Tech Summit - Taller Xamarin

#TechSum

Crear UIs nativas para iOS, Android, y Windows Desde un mismo archivo común, compartido

C#.

Conoce Xamarin.Forms

Page 35: Microsoft Tech Summit - Taller Xamarin

Xamarin + Xamarin.Forms

Enfoque tradicional de Xamarin

Con Xamarin.Forms:Más código compartido,

todo nativo

iOS C# UI Windows C#

UIAndroid C# UI

Shared C# Backend

Shared UI Code

Shared C# Backend

Page 36: Microsoft Tech Summit - Taller Xamarin

#TechSum

¿Qué se incluye?

✓ 40+ páginas, layouts, y controles (code behind o XAML)✓ Two-way data binding✓ Mavegación✓ API de animaciones✓ Dependency Service✓ Messaging Center

Shared C# Backend

Shared UI Code

Page 37: Microsoft Tech Summit - Taller Xamarin

#TechSum

Layouts

Páginas

Stack Absolute Relative Grid ContentView

ScrollView

Frame

Content MasterDetail

Navigation

Tabbed Carousel

Page 38: Microsoft Tech Summit - Taller Xamarin

#TechSum

ActivityIndicator BoxView Button DatePicker Editor

Entry Image Label ListView Map

OpenGLView Picker ProgressBar SearchBar Slider

Stepper TableView TimePicker WebView EntryCell

ImageCell SwitchCell TextCell ViewCell

Controles

Page 39: Microsoft Tech Summit - Taller Xamarin

El ecosistema Xamarin.Forms

Page 40: Microsoft Tech Summit - Taller Xamarin

#TechSum

Windows Xamarin.FormsStackPanel StackLayoutTextBox EntryListBox ListViewCheckBox SwitchProgressBar ActivityIndicatorGrid GridLabel LabelButton ButtonImage ImageDate/TimePicker Date/TimePicker

Comparativa de controles

Page 41: Microsoft Tech Summit - Taller Xamarin

#TechSum

Windows Xamarin.FormsDataContext BindingContext{Binding Property}

{Binding Property}

ItemsSource ItemsSourceItemTemplate ItemTemplateDataTemplate DataTemplate

Comparativa de enlace a datos

Page 42: Microsoft Tech Summit - Taller Xamarin

#TechSum

Personalización de la plataforma

Page 43: Microsoft Tech Summit - Taller Xamarin

<?xml version="1.0" encoding="UTF-8"?><TabbedPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="MyApp.MainPage"><TabbedPage.Children><ContentPage Title="Profile" Icon="Profile.png"> <StackLayout Spacing="20" Padding="20" VerticalOptions="Center"> <Entry Placeholder="Username" Text="{Binding Username}"/> <Entry Placeholder="Password" Text="{Binding Password}" IsPassword="true"/> <Button Text="Login" TextColor="White" BackgroundColor="#77D065" Command="{Binding LoginCommand}"/> </StackLayout></ContentPage><ContentPage Title="Settings" Icon="Settings.png"> <!-- Settings --></ContentPage></TabbedPage.Children></TabbedPage>

UI Nativa desde código compartido

Page 44: Microsoft Tech Summit - Taller Xamarin

#TechSum

DEMO: Vistas básicasXAML Love!

Page 45: Microsoft Tech Summit - Taller Xamarin

#TechSum

El patron MVVM

Page 46: Microsoft Tech Summit - Taller Xamarin

IDE

Lenguaje

Vistas

iOS Android Windows Phone

Xcode Android Studio

Visual Studio

ObjectiveC o Swift

Java C#

Storyboard AXML XAMLMVC MVC MVVMPatrón diseño

Comparativa de plataformas móviles

Page 47: Microsoft Tech Summit - Taller Xamarin

IDE

LenguajeVistas

iOS Android Windows Phone

Visual Studio

Visual Studio

Visual Studio

C# C# C#

Storyboard AXML XAMLMVVM MVVM MVVM

Patrón diseño

Comparativa de plataformas móviles

Page 48: Microsoft Tech Summit - Taller Xamarin

View

ViewModel

Model

get/set PropiedadesComandos

Notifica cambios

C#

Models

ViewView

ViewModel

ViewModel

ModelM

odel

Cross Platform

MVVM

Page 49: Microsoft Tech Summit - Taller Xamarin

• Mayor facilidad para mantener, extender y compartir el código.• Más facilidad a la hora de colaborar.• Testing.• Más fácil de diseñar.

Pero... ¿Por qué MVVM?

Page 50: Microsoft Tech Summit - Taller Xamarin

#TechSum

DEMO: MVVMEnlace a datos y otros conceptos básicos

Page 51: Microsoft Tech Summit - Taller Xamarin

#TechSum

Plugins

Page 52: Microsoft Tech Summit - Taller Xamarin

Shared C# Backend

Page 53: Microsoft Tech Summit - Taller Xamarin

Código específico de plataforma¿Qué ocurre si necesitamos accede a características específicas de la plataforma?

UI+APIs UI + APIsUI + APIs

BateríaGPSLámparaNotificationesSettingsText To Speech

BateríaGPSLámparaNotificationesSettingsText To Speech

BateríaGPSLámparaNotificationesSettingsText To Speech

Page 54: Microsoft Tech Summit - Taller Xamarin

TextToSpeech

Speak(“Hello World”);

AVSpeechSynthesizer SpeechSynthesizer

Page 55: Microsoft Tech Summit - Taller Xamarin

PluginsXamarin

Common API

github.com/xamarin/plugins

Page 56: Microsoft Tech Summit - Taller Xamarin

#TechSum

DEMO: PluginsPosición GPS

Page 57: Microsoft Tech Summit - Taller Xamarin

#TechSum

Gracias a todos!

http://aka.ms/MTS02

Page 58: Microsoft Tech Summit - Taller Xamarin

© 2014 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.