dotNetMálaga - Taller Xamarin
Descargar como PPTX, PDF0 recomendaciones3,812 vistas
El taller introducirá conceptos de Xamarin como la creación de proyectos, MVVM, diseño de interfaces y navegación. Se desarrollará una aplicación meteorológica paso a paso utilizando estas técnicas. Se explicarán también conceptos adicionales como servicios, plugins y el acceso a características nativas a través de código compartido. El objetivo es que los asistentes aprendan las bases para crear aplicaciones móviles multiplataforma con Xamarin.
dotNetMálaga - Taller Xamarin
- 3. ¿Qué vamos a ver? Introducción al taller Repaso a Xamarin Creación proyecto • Estructura proyecto • MVVM • Primeras pruebas enlace a datos La interfaz compartida • Páginas, Layouts y controles en Xamarin.Forms • Recursos y estilos • Creando la interfaz básica de nuestra App Creación de servicios • Conceptos básicos relacionados con servicios • Creación de servicios (navegación y REST) • Usando plugins Navegación • Conceptos básicos de navegación • Completar la App
- 5. • 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
- 7. No dudéis en preguntar!
- 9. Xamarin – Solución completa para el Desarrollo móvil
- 10. Código nativo iOS WindowsAndroid Objective-C Xcode C# Visual Studio Java Android Studio No se comparte código • Diferentes lenguajes & entornos de desarrollo • Diferentes equipos
- 11. Escribe una vez, corre en todos App Generator Lua Javascript Actionscript HTML+CSS Acceso limitado a APIs • Menos rendimiento • Experiencia de usuario más pobre
- 12. 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
- 13. 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
- 14. 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/Mono CoreCLRAzure Shared C# Client/Server
- 15. Xamarin ahora gratis e incluido en Visual Studio
- 16. #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.
- 17. Open Source – open.xamarin.com
- 18. Open Source • Xamarin.iOS • Xamarin.Mac • Xamarin.Android • Xamarin.Forms • Bindings & Plugins • Cómo arrancar • Guías de contribución
- 20. C# mola
- 21. Async/Await Código más simple, mantenimiento
- 22. Android ItemClick, ¿ves diferencias? C# con XamarinJava C# & Async con Xamarin
- 23. DEMO: Crear proyecto Conociendo las plantillas y contenido básico
- 25. Windows APIs Microsoft.Phone Microsoft.Networking Windows.Storage Windows.Foundation Microsoft.Devices System.Data System.Windows System.Numerics System.Core System.ServiceModel System.Net System System.IO System.Linq System.Xml
- 26. iOS – Acceso al 100% de las APIs MapKit UIKit iBeacon CoreGraphics CoreMotion System.Data System.Windows System.Numerics System.Core System.ServiceModel System.Net System System.IO System.Linq System.Xml
- 27. Android – Acceso al 100%de las APIs Text-to-speech ActionBar Printing Framework Renderscript NFC System.Data System.Windows System.Numerics System.Core System.ServiceModel System.Net System System.IO System.Linq System.Xml
- 28. Cualquier cosa que puedas hacer con Objective-C, Swift, o Java se puede hacer con C# y Visual Studio con Xamarin.
- 30. Xamarin.iOS Xamarin.Android Portable Class Libraries
- 31. 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 %
- 34. 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
- 35. ¿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
- 36. Layouts Páginas Stack Absolute Relative Grid ContentView ScrollView Frame Content MasterDetail Navigation Tabbed Carousel
- 37. 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
- 39. Windows Xamarin.Forms StackPanel StackLayout TextBox Entry ListBox ListView CheckBox Switch ProgressBar ActivityIndicator Grid Grid Label Label Button Button Image Image Date/TimePicker Date/TimePicker Comparativa de controles
- 40. Windows Xamarin.Forms DataContext BindingContext {Binding Property} {Binding Property} ItemsSource ItemsSource ItemTemplate ItemTemplate DataTemplate DataTemplate
- 42. • <?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> UI Nativa desde código compartido
- 43. DEMO: Vistas básicas XAML Love!
- 44. El patron MVVM
- 45. IDE Lenguaje Vistas iOS Android Windows Phone Xcode Android Studio Visual Studio ObjectiveC o Swift Java C# Storyboard AXML XAML MVC MVC MVVMPatrón diseño
- 46. IDE Lenguaje Vistas iOS Android Windows Phone Visual Studio Visual Studio Visual Studio C# C# C# Storyboard AXML XAML MVVM MVVM MVVMPatrón diseño
- 48. • 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.
- 49. DEMO: MVVM Enlace a datos y otros conceptos básicos
- 50. Plugins
- 52. 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ía GPS Lámpara Notificationes Settings Text To Speech Batería GPS Lámpara Notificationes Settings Text To Speech Batería GPS Lámpara Notificationes Settings Text To Speech
- 56. Gracias a todos! Hasta la próxima!
Notas del editor
- #16: Including the Free Community Edition
- #28: The same is true for Android as well.
- #29: Coming up next is bubbles
- #37: Inside of a page are layouts A lot of options from something simple like a stack panel to complex and powerful grids
- #38: You have more than 40 controls, layouts, and pages to mix and match from. These are all of the controls you have out of the box, you can of course create your own. What is unique is you get the native control and have access to it. Consider an Entry Field On iOS it is mapped to UITextField Android it is EditText Windows Phoen it is a TextBox