Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

What's new in Xamarin.Forms

1,252 views

Published on

What's new in Xamarin.Forms

https://www.monkeyfest.io

Published in: Mobile
  • Be the first to comment

  • Be the first to like this

What's new in Xamarin.Forms

  1. 1. rumar@microsoft.com http://ruimarinho.net
  2. 2. Native User Interfaces Native API Access Native Performance
  3. 3. Silo approach iOS WindowsAndroid Objective-C/Swift Xcode C# Visual Studio Java Android Studio No shared code • Many languages and development environments • Multiple teams
  4. 4. Write once, run anywhere Lua Javascript Actionscript HTML+CSS Limited native API access • Slow performance • Poor user experience App generator
  5. 5. iOS C# UI Windows C# UIAndroid C# UI Shared C# logic Xamarin’s unique approach Shared C# codebase • 100% native API access • High performance
  6. 6. 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 C#
  7. 7. iOS – 100% API coverage MapKit UIKit iBeacon CoreGraphics CoreMotion System.Data System.Windows System.Numerics System.Core System.ServiceModel System.Net System System.IO System.Linq System.Xml C#
  8. 8. Android – 100% API coverage 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 C#
  9. 9. Xamarin Native approach 3 Native User Interfaces Shared App Logic Shared C# Logic Windows C#Android C#iOS C#
  10. 10. Xamarin.Forms- Cross Platform UI Shared Native User Interface Shared App Logic Shared C# Logic Shared UI Code
  11. 11. Layouts Pages Stack Absolute Relative Grid ContentView ScrollView Frame Content MasterDetail Navigation Tabbed Carousel
  12. 12. ActivityIndicator BoxView Button DatePicker Editor Entry Image Label ListView Map OpenGLView Picker ProgressBar SearchBar Slider Stepper TableView TimePicker WebView EntryCell ImageCell SwitchCell TextCell ViewCell Controls
  13. 13. Native UI ContentPage Label Picker Android Activity / Fragment TextView AlertDialog + LinearLayout + EditText + NumberPicker iOS UIViewController UILabel UITextField + UIPickerView + UIToolbar + UIBarButtonItem UWP Page TextBlock ComboBox developer.xamarin.com/guides/xamarin-forms/application-fundamentals/custom-renderer/renderers/
  14. 14. macOS Preview Enhanced GestureRecognizers Android Support Libraries PlatformSpecifics Fast Scroll NavigationPage Translucency Blur Behind .netstandard support Partial Collapse MasterPage Native Control Binding Map Extensibility Fast Renderers Preview Startup Time ListView Scrolling Memory Improvements XAMLC Bindable Picker Frame Corners Tizen Forms Previewer FlexLayout Preview Xamarin.Forms Embedding DataPages
  15. 15. • Aggressive bug triage • New issues reviewed within 24 hrs • Reproduction projects for quick resolution • Performance Improvements • Startup Time • Fast Renderers for Android • ListView improvements, Fast Scroll • XAMLC – 5x faster • Discussion: aka.ms/xfperformance Quality and Performance Source: Matthew Robbins - MFractor
  16. 16. 2.4.0 • .NET Standard 2.0 • Stability and Performance • Over 150 fixes • New Feature Flags API • Android Fast Renderers: Button, Image, Label • macOS Preview
  17. 17. vNext • Page Embedding • Layout Compression • Right-to-Left • ListView enhancements • Gesture enhancements • FlexLayout • VSM • macOS, GTK
  18. 18. XAML Standard • Lots of feedback! • Reconciling the APIs we can without breakage • Share implementations of • x:Bind • Visual State Manager
  19. 19. Xamarin.Forms Page Embedding Shared C# Logic Windows C#Android C#iOS C# iOS Obj-C Swift Android Java ?
  20. 20. • public class ButtonRenderer : ViewRenderer<Button, AppCompatButton>, AView.IOnAttachStateChangeListener { ButtonBackgroundTracker _backgroundTracker; TextColorSwitcher _textColorSwitcher; float _defaultFontSize; Typeface _defaultTypeface; bool _isDisposed; int _imageHeight = -1; public ButtonRenderer() { AutoPackage = false; } global::Android.Widget.Button NativeButton => Control; …..
  21. 21. • internal sealed class ButtonRenderer : AppCompatButton, IVisualElementRenderer, AView.IOnAttachStateChangeListener, AView.IOnFocusChangeListener, IEffectControlProvider, AView.IOnClickListener, AView.IOnTouchListener { public event EventHandler<VisualElementChangedEventArgs> ElementChanged; public event EventHandler<PropertyChangedEventArgs> ElementPropertyChanged; public ButtonRenderer() : base(Forms.Context) { _automationPropertiesProvider = new AutomationPropertiesProvider(this); _effectControlProvider = new EffectControlProvider(this); _textColorSwitcher = new Lazy<TextColorSwitcher>(() => new TextColorSwitcher(TextColors)); Initialize(); } …..
  22. 22. Layout Lifecycle: Invalidation Loop Has Parent? InvalidateMeasure Called Call InvalidateMeasure on Parent Queue Delay Layout Yes No 1 2 3 4
  23. 23. Has Parent? InvalidateMeasure Called Call InvalidateMeasure on Parent Queue Delay Layout Yes No 1 2 3 4 Wait for event callback to happen and trigger the layout mechanism 5 Has Children? LayoutChildren Invoked Layout called 6 7 8 Yes No Layout Cycle Completed 9 Layout Lifecycle: Layout Loop
  24. 24. Grid StackLayout ContentView Label Button WebView Grid Label Button Image ScrollView Image Panel Panel Panel LabelRenderer TextBlock ButtonRenderer Button WebViewRenderer WebView Panel LabelRenderer Label ButtonRenderer Button ImageRenderer Image ScrollViewRenderer ImageRenderer Image Forms UWP
  25. 25. Grid StackLayout ContentView Label Button WebView Grid Label Button Image ScrollView Image Panel LabelRenderer TextBlock ButtonRenderer Button WebViewRenderer WebView LabelRenderer Label ButtonRenderer Button ImageRenderer Image ScrollViewRenderer ImageRenderer Image Forms UWP+Compression
  26. 26. Grid StackLayout ContentView Label Button WebView Grid Label Button Image ScrollView Image Panel LabelRenderer ButtonRenderer WebViewRenderer WebView LabelRenderer ButtonRenderer ImageRenderer ScrollViewRenderer ImageRenderer Forms UWP+Compression+Fast Renderers
  27. 27. Pros: less renderers to create, manage and dispose less UI elements on screen Cons: compressed layouts can't have BG colors, gesture recognizers no transformation
  28. 28. FlexLayout Example <?xml version="1.0" encoding="UTF-8"?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x=http://schemas.microsoft.com/winfx/2009/xaml x:Class="FormsFlexLayoutDemo.FlexDemoPage"> <FlexLayout x:Name="flexbox”> <Label Text="Flex Element 1" /> <Label Text="Flex Element 2" /> <Label Text="Flex Element 3" /> <Label Text="Flex Element 4" /> <Label Text="Flex Element 5" /> </FlexLayout> </ContentPage> Flex Element 1 Flex Element 2 Flex Element 3 Flex Element 4 Flex Element 5
  29. 29. AlignContent AlignItems Position Overflow Wrap Order AlignSelf Flex JustifyContent IsIncluded Grow Shrink FlexLayout Properties
  30. 30. Floating Action Button An Android-only control that has no Xamarin.Forms abstraction.
  31. 31. #if to target only the desired platform
  32. 32. Add the FAB
  33. 33. • Continuously deploy & debug apps Xamarin Live Player
  34. 34. Xamarin Live Player Setup
  35. 35. Call to action • Get started: xamarin.com/download • Use Xamarin.Forms 2.4.0 today! • Try Page Embedding, Layout Compression today from the Nightly Feed: • https://github.com/xamarin/Xamarin.Forms/wiki/Nightly-Builds
  36. 36. Open Source – open.xamarin.com
  37. 37. Sponsored By
  38. 38. Thank you. Questions? Rui Marinho Software Engineer, Xamarin Forms, Mobile Developer Tools @ruiespinho

×