Building out-of-the-ordinary UI's with Xamarin.Forms custom renderers

Xamarin.Forms is a powerful framework that uses UI abstractions to enable 100% code reuse for UI code whilst still delivering 100% native user experiences. In general, for simple data driven apps, Xamarin.Forms is a good fit. But what if you need to build a UI that is a little less ordinary? Can you still do that with Xamarin.Forms? This session explains how you can use Custom Renderers to go beyond standard.

Transcript

2. Building out-of-the-ordinary UIs with Xamarin.Forms Roy Cornelissen Lead Consultant @ Xpirit
5. Goal Shared app logic Raise the level of code reuse even further…
6. Shared app logic Shared UI …by abstracting common UI paradigms into a library Goal
8. Page abstractions
9. Layout abstractions
10. Control abstractions
11. tinyurl.com/xamarin-forms
12. tinyurl.com/xamarin-forms
13. tinyurl.com/xamarin-forms
14. UILabel TextView TextBlock LabelRenderer LabelRenderer LabelRenderer Label
15. ListView LongListSelector ListViewRenderer UITableView ListView ListViewRenderer ListViewRenderer
16. MyEntry Entry MyEntryRenderer_Windows MyEntryRenderer_Android MyEntryRenderer_iOS Xamarin.Platform Windows.EntryRenderer Xamarin.Platform Android.EntryRenderer Xamarin.Platform iOS.EntryRenderer Platform specific Shared code
17. Typical PCL
18. Typical Shared
19. targets PCL / Shared Project Phone 8 Silverlight Windows Store Phone RT iPhone iPad Phone Tablet
21. MVVM framework
22. with IoC MyViewModel IMediaPicker WindowsMediaPicker: IMediaPicker AndroidMediaPicker: IMediaPicker iOSMediaPicker: IMediaPicker DependencyService.Get<IMediaPicker>(); [assembly: Dependency (typeof (WindowsMediaPicker))]
23. using Device class Device.Styles Styles for controls, e.g. labels & lists Device.GetNamedSize Font sizes Device.Idiom Tablet or phone specific code / behavior Device.OS Target platform specific code Device.OnPlatform() Target platform specific values Device.OpenUri() Device.StartTimer() Device.BeginInvokeOnMainThread()
24. center Messaging Center Master Subscribes Receives msg Detail Sends message
27. Party time! We want an app for ~300 people They must be able to sign up for the party And post pictures to a gallery
31. Yes… well actually, we want it a little bit more festive. Something like…
34. Using the Parse API is still possible
35. Dealing with data and pictures is still possible
36. App has pretty basic navigation flow We can still use
37. Although round and fancy, all in all they’re just buttons (abstraction) We can still use
38. Taking pictures We learned about
39. Using custom renderers to deal with the round buttons We learned about
40. Shared
42. @roycornelissen roycornelissen.wordpress.com rcornelissen@xpirit.com bit.ly/XpiritMagazine
43. Your feedback is important! Scan the QR Code and let us know via the TechDays App. Laat ons weten wat u van de sessie vindt! Scan de QR Code via de TechDays App. Bent u al lid van de Microsoft Virtual Academy?! Op MVA kunt u altijd iets nieuws leren over de laatste technologie van Microsoft. Meld u vandaag aan op de MVA Stand. MVA biedt 7/24 gratis online training on-demand voor IT- Professionals en Ontwikkelaars.