Xamarin Forms
-
Upload
pranav-ainavolu -
Category
Technology
-
view
244 -
download
0
Transcript of Xamarin Forms
PowerPoint Presentation
Pranav AinavoluRealPage | MUGH@a_pranav | http://pranavon.net/Xamarin.Forms Do More With LessCross Platform Mobile Development Road Show - Hyderabad
1
Build native UIs for iOS, Android, and Windows Phone from a single, shared C# codebase.Meet Xamarin.Forms
Xamarin Forms is a new set of APIs allowing you to quickly and easily write shared User Interface code that is still rendered natively on each platform, while still providing direct access to the underlying SDKs if you need it.
2
Xamarin + Xamarin.FormsTraditional Xamarin ApproachWith Xamarin.Forms:More code-sharing, all native iOS C# UI Windows C# UIAndroid C# UI
Shared C# Backend
Shared UI CodeShared C# Backend
We see here the Xamarin approach we talked about earlierThis enables you to be highly productive, share code, but build out UI on each platform and access platform APIsWith Xamarin.Forms you now have a nice Shared UI Code layer, but still access to platform APIsYou can start from native, pick a few screens, or start with forms, and replace with native later
3
Xamarin.Forms Native Interface
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM4
DatePicker Control using Xamarin.Forms
demoRenders natively in iOS and Android
GreenR:16 G:124 B:16OrangeR:216 G:59 B:1BlueR:0 G:120 B:215Light GrayR:210 G:210 B:210Light OrangeR:255 G:140 B:0YellowR:255 G:185 B:0Main colorsSecondary colors (use only when necessary)Dark RedR:168 G:0 B:0Light BlueR:16 G:124 B:16Dark BlueR0 G32 B80
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM5
Write once, render natively.
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM6
And its free and open source!
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM7
Xamarin.Forms Saves Time
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM8
How Forms Saves You TimeDont have to re-implement stuffEasier to maintainBuilds on prior knowledge (for .NET developers)
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM9
Whats included 40+ Pages, layouts, and controls (Build from code behind or XAML) Two-way data binding Navigation Animation API Dependency Service Messaging Center
Shared C# Backend
Shared UI Code
Xamarin.Forms is much more that just a framework and includes everything you need to get up and running to build out full native applications.
If you are used to MVVM type of development you will feel right at home.10
LayoutsPagesStackAbsoluteRelativeGridContentViewScrollViewFrame
ContentMasterDetailNavigationTabbedCarousel
First you have a set of pages for each screen of your applicationThere are things like Content, and MasterDetail which gives you a nice flyoutWith a tabbed view you get the correct look on each platformiOS on bottom, Android on top, and on WP you have a Pivot control
Inside of a page are layoutsA lot of options from something simple like a stack panel to complex and powerful grids
11
ActivityIndicatorBoxViewButtonDatePickerEditorEntryImageLabelListViewMapOpenGLViewPickerProgressBarSearchBarSliderStepperTableViewTimePickerWebViewEntryCellImageCellSwitchCellTextCellViewCellControls
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 FieldOn iOS it is mapped to UITextFieldAndroid it is EditTextWindows Phone it is a TextBox12
ExtensibilityEmbed Custom Views Anywhere
Not only are Xamarin.Forms pages mixable with custom screens, you can embed custom views built directly against Xamarin.iOS and Xamarin.Android into Xamarin.Forms pages.
Call Platform APIs via Shared Services
Need platform-specific functionality within a Xamarin.Forms page, such as querying the accelerometer? Weve included services that quickly and easily abstract platform-specific API calls to keep you writing as much shared code as possible.
Easy migration to the Xamarin Platform
When your native platform integration requirements outgrow Xamarin.Forms, your shared code is easily migrated to Xamarin.iOS and Xamarin.Android using the full Xamarin platform.
With Xamarin.Forms you can easily extend and embed custom views, mix and match screens, called native apis, or even easily migrate to a traditional app and share your backend logic.13
Xamarin.Forms Ecosystem
Xamarin.Forms also has a great ecosystem of controls from vendors you might know!14
WindowsXamarin.FormsStackPanelStackLayoutTextBoxEntryListBoxListViewCheckBoxSwitchProgressBarActivityIndicatorGridGridLabelLabelButtonButtonImageImageDate/TimePickerDate/TimePicker
Control Comparison
15
WindowsXamarin.FormsDataContextBindingContext{Binding Property}{Binding Property}ItemsSourceItemsSourceItemTemplateItemTemplateDataTemplateDataTemplate
Binding Comparison
16
Platform Customization
17
Native UI from shared code
Here is a quick example of a login page:
Notice the data binding on the Entries Text fields. Additionally, there is a LoginCommand.
Each has a native user interface18
Lets Take a Look
Demo: Tabbed Views
19
Whats new?
XAML Previewer
DataPages
https://developer.xamarin.com/guides/xamarin-forms/datapages/
Themes
https://developer.xamarin.com/guides/xamarin-forms/themes/
Native Embedding
Easily embed any native control into a Xamarin.Forms layout.
Native Embedding
Just add it as child to a layout.Exposed as an Extension Method.
Plugins for Xamarin
A unique aspect of Xamarin.Forms is an abstraction over the user interface, but what about the platform specific functionality that makes these devices so special?
That is where plugins for Xamarin come in.26
Shared C# Backend
What is this stuff that we talk about up here?27
PlatformSpecific CodeWhat if we didnt have to write this code?
What if we could access it from shared code?
UI+APIsUI + APIsUI + APIsBatteryGPSLightsNotificationsSettingsText To SpeechBatteryGPSLightsNotificationsSettingsText To SpeechBatteryGPSLightsNotificationsSettingsText To Speech
This is the platform specific code no matter how you are developing traditional Xamarin or with Xamarin.Forms.
However, many platform APIs are the same bit of functionality, but with different APIs.
What if we had 1 API?28
TextToSpeechSpeak(Hello World);
AVSpeechSynthesizerSpeechSynthesizer
For instance text to speech, what if we could just say Speak and it would speak text with the underlying API.29
Plugins for Xamarin Common API
github.com/xamarin/plugins
This is what Plugins for Xamarin are for! 1 API for all common APIs:
CameraGPSSettingsNotificationsBatteryAnd so much more!30
GreenR:16 G:124 B:16OrangeR:216 G:59 B:1BlueR:0 G:120 B:215Light GrayR:210 G:210 B:210Light OrangeR:255 G:140 B:0YellowR:255 G:185 B:0Main colorsSecondary colors (use only when necessary)Dark RedR:168 G:0 B:0Light BlueR:16 G:124 B:16Dark BlueR0 G32 B80
dotnetConf 2016 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.6/25/2016 9:31 PM31
GreenR:16 G:124 B:16OrangeR:216 G:59 B:1BlueR:0 G:120 B:215Light GrayR:210 G:210 B:210Light OrangeR:255 G:140 B:0YellowR:255 G:185 B:0Main colorsSecondary colors (use only when necessary)Dark RedR:168 G:0 B:0Light BlueR:16 G:124 B:16Dark BlueR0 G32 B80