Uploaded byXamarin
Desktop Developer’s Guide to Mobile with Visual Studio Tools for Xamarin
The document outlines an agenda for a session on Xamarin and Visual Studio tools, covering mobile UI approaches, user experience, and shared code base resources. It discusses frameworks for building native mobile apps using .NET languages and libraries, and emphasizes design principles such as simplicity and async usage. Additionally, it provides links to resources for further learning and development in Xamarin.
Desktop Developer’s Guide to Mobile with Visual Studio Tools for Xamarin
- 2. Principal Program Manager XamarinUniversity @marksm github.com/markjulmar
- 6. Agenda • Intro toVisual Studio Tools for Xamarin • Mobile UI approaches • Shifting to mobile APIs • Consider the User Experience • Resources and Q & A
- 7. from a sharedcode base
- 8. Visual Studio for Windowsor Mac .NET Languages .NET Libraries
- 9. If you’re a.NET developer, you can build native mobile apps
- 11. 3 native UIdefinitions Shared App Logic Shared C# Logic Windows C#Android C#iOS C#
- 12. Shared C# Logic WindowsC#Android C#iOS C# Shared UI definition Single shared UI definition Shared App Logic
- 13. 90s 2002 20062011 2015 * Green doesn't mean "simple,” it means that the frameworks have the most in common
- 14.
- 16. Talks to a webservice Parses a data format Performs processing or logic Uses a database
- 17. Accesses system information Uses filesand folders on the device Accesses personal information Uses external devices
- 20.
- 21.
- 22. <Label Text="Text={Binding Source={StaticResourceresourceKey}, Path=PropertyName, Mode=OneWay}" Source Target Any Object Any public property BindableObject BindablePropertyBinding label.SetBinding(Label.TextProperty, new Binding("PropertyName", source: someObject));
- 23. this.DataContext = newMainViewModel(); this.BindingContext = new MainViewModel();
- 24. Text={Binding ElementName=otherControl, Path=Text} Text={BindingSource={x:Reference otherControl}, Path=Text}
- 25. Layout containers organize children "Measureand Arrange" layout algorithm Can create custom panels for unique requirements
- 26. WPF / UWPXamarin.Forms Layout Style StackPanel StackLayout Left-to-right, or top-to-bottom infinite stacking Grid Grid Tabular format (rows and columns); Xamarin.Forms does not support dynamic splitting DockPanel n/a Dock to edges of window Canvas AbsoluteLayout Pixel/Coordinate positioning WrapPanel n/a Wrapping stack RelativePanel RelativeLayout Relative rule-based positioning UniformGrid n/a Provides a tabular grid of uniform size ScrollViewer ScrollViewer Provides scrolling container for content
- 27. WPF Xamarin.Forms LayoutStyle Horizontal Alignment Horizontal Options Align an element to left/start, center, or right/end of the parent container VerticalAlignment VerticalOptions Align an element to the top/start, middle, or bottom/end of the parent container Margin Margin Add spacing on the outside of an element Padding Padding Add spacing to the inside of an element n/a Spacing Property exposed by layout containers to provide spacing around each child contained in the panel
- 28.
- 29. Content Page MasterDetail Page Navigation Page Tabbed Page Carousel Page
- 30.
- 31.
- 32. StackLayout stack =new StackLayout(); #if __IOS__ var segmentControl = new UISegmentedControl { Frame = new CGRect(20, 20, 280, 40) }; segmentControl.InsertSegment("One", 0, false); segmentControl.InsertSegment("Two", 1, false); segmentControl.SelectedSegment = 1; segmentControl.ValueChanged += async (sender, e) => { var id = (sender as UISegmentedControl).SelectedSegment; await MainPage.DisplayAlert( $"Native Segmented Control Clicked {id}", "Whoa!!!!!!", "OK"); }; stack.Children.Add(segmentControl); #endif
- 35. Embrace minimalism • Simplify:what are users’ core tasks? • Avoid multiple information columns • Design each screen to do one thing
- 40.
- 41. Steven Hoober ,UX Matters Images: Stephanie Walter
- 42. Do you wantto close it? Wait OK Embrace async
- 43. Embrace vector graphics •Use properly sized images • Include multiple sizes, based on the supported device form factors • Prefer vector formats (.svg or .pdf)
- 44.
- 45. Pew Research Center,2015 Global Web Index, 2016 Think with Google, 2016 66% have multiple devices 21% use them concurrently
- 47.
- 48. Tap, Double Tap, LongPress Swipe and Scroll Hardware Buttons (Back and Menu buttons) Enter Text Clear Text Capture Screenshot
- 49.
- 52.
- 53. • Slides andDemos github.com/markjulmar/desktop-to-Xamarin • Create your free Visual Studio Mobile Center account mobile.azure.com • Register an account and access free training resources university.xamarin.com • More documentation developer.xamarin.com/desktop