XamarinDevDays covered the traditional Xamarin approach of writing separate UI code for each platform versus using Xamarin.Forms which allows for more code sharing with a single shared UI code and backend. Xamarin.Forms was discussed in depth including over 40 pages, layouts and controls that are built from code behind or XAML, two-way data binding, navigation, animation API and more. Examples were provided of XAML code for a tabbed page app with login functionality to demonstrate how Xamarin.Forms can be used to build full apps with shared UI and backend code across platforms.

1. #XamarinDevDays

4. Traditional Xamarin
Approach
With Xamarin.Forms:
More code-sharing, all native
iOS C# UI Windows C# UIAndroid C# UI
Shared C# Backend
Shared UI Code
Shared C# Backend

5. ✓ 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

6. Layouts
Pages
Stack Absolute Relative Grid ContentView ScrollView Frame
Content MasterDetail Navigation Tabbed Carousel

7. ActivityIndicator BoxView Button DatePicker Editor
Entry Image Label ListView Map
OpenGLView Picker ProgressBar SearchBar Slider
Stepper TableView TimePicker WebView EntryCell
ImageCell SwitchCell TextCell ViewCell

8. Xamarin.Forms Ecosystem

9. 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

10. Windows Xamarin.Forms
DataContext BindingContext
{Binding Property} {Binding Property}
ItemsSource ItemsSource
ItemTemplate ItemTemplate
DataTemplate DataTemplate

12. <?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>

15. Xamarin.Forms
is Open Source!
open.xamarin.com

17. ✓ Improves scrolling performance
✓ Old behavior is currently the default (but likely to change)

18. XAML
Parsed and inflated
Parsed & turned
into IL
XAMLC

19. ✓ Faster Loading
✓ Smaller App Size
✓ See XAML errors at build time

22. • Embeddable
Carousel
• ItemTemplate &
DataTemplates
• Highly customizable
& Virtualized

23. ✓ Custom renderer “lite”
✓ Change properties on the native control
✓ Optional
✓ “stringly-typed”
X No methods or events
X No replacing the control

24. entry.Effects.Add (Effect.Resolve("Xamarin.BorderEffect"));

25. Native Embedding

31. https://developer.xamarin.com/guides/xamarin-forms/datapages/

32. https://developer.xamarin.com/guides/xamarin-forms/themes/

33. 20 Minute Break
Rui
Marinho
Software Engineer – Xamarin Forms
rumar@microsoft.com Github.com/rmarinho @ruiespinho