APAC Webinar: Say Hello To Xamarin.Forms
2 likes17,845 views
This document introduces Xamarin.Forms, which allows building native mobile apps for iOS, Android, and Windows Phone from a single C# codebase. It discusses how Xamarin.Forms works, including using a portable class library or shared project, platform renderers to render controls natively, and the dependency service to access platform-specific features. It also covers data binding, custom renderers, and where to find more information on Xamarin.Forms.
![Dependency Service
Easily call into platform-specific code
■
In the common code
■
Code to an Interface
■
Use DependencyService
■
For each platform
■
implement the Interface
[assembly: Xamarin.Forms.Dependency (typeof (Speech))]
public class Speech : ITextToSpeech
{
public Speech () { }
public void Speak (string text)
{
var speechSynthesizer = new AVSpeechSynthesizer ();
var speechUtterance = new AVSpeechUtterance (text) {
Rate = AVSpeechUtterance.MaximumSpeechRate/4,
Voice = AVSpeechSynthesisVoice.FromLanguage ("en-US"),
Volume = 0.5f,
PitchMultiplier = 1.0f
} ;
speechSynthesizer.SpeakUtterance (speechUtterance);
}
}](https://image.slidesharecdn.com/sayhellotoxamarin-150427014026-conversion-gate02/85/APAC-Webinar-Say-Hello-To-Xamarin-Forms-30-320.jpg)
![Dependency Service
Easily call into platform-specific code
■
In the common code
■
Code to an Interface
■
Use DependencyService
■
For each platform
■
implement the Interface
■
use Dependency
attribute on the
assembly
[assembly: Xamarin.Forms.Dependency (typeof (Speech))]
public class Speech : ITextToSpeech
{
public Speech () { }
public void Speak (string text)
{
var speechSynthesizer = new AVSpeechSynthesizer ();
var speechUtterance = new AVSpeechUtterance (text) {
Rate = AVSpeechUtterance.MaximumSpeechRate/4,
Voice = AVSpeechSynthesisVoice.FromLanguage ("en-US"),
Volume = 0.5f,
PitchMultiplier = 1.0f
} ;
speechSynthesizer.SpeakUtterance (speechUtterance);
}
}](https://image.slidesharecdn.com/sayhellotoxamarin-150427014026-conversion-gate02/85/APAC-Webinar-Say-Hello-To-Xamarin-Forms-31-320.jpg)
APAC Webinar: Say Hello To Xamarin.Forms
- 1. Say Hello To Xamarin.Forms Nish Anil @nishanil | nish@xamarin.com
- 2. Traditional Xamarin Development Using the Native UI SDKs ■ Build native UIs ■ UIKit & Storyboards on iOS ■ AXML for Android ■ XAML for Windows Phone ■ Write shared C# code ■ Database, Web Services ■ Business Logic ■ Share 60-80% of the code UIKit Layout XAML
- 3. Using Xamarin.Forms Shared UI Code! To Build the User Interface ■ Use the same strategies for sharing ■ Database, Web Services ■ Business Logic ■ Build the UI with a single shared codebase ■ Share 99% of the code UIKit Layout XAML
- 4. Using Xamarin.Forms Shared UI Code! ■ Code sharing/re-use ■ Native look and feel ■ Access to native SDKs using Custom Renderers and DependencyService ■ Camera, accelerometer, GPS, ■ NFC & more on Android ■ PassKit & more on iOS ■ Tiles & more on Windows Phone Benefits UIKit Layout XAML Shared C# User Interface Code
- 5. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 6. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 7. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 8. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 9. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 10. Meet Xamarin.Forms Build native UIs for iOS, Android and Windows Phone from a single, shared C# codebase.
- 11. Meet Xamarin.Forms public class HelloWorld : ContentPage { public HelloWorld () { var button = new Button { Text = "Say Hello" } ; button.Clicked += SayHelloClicked; Content = new StackLayout { new Label { Text = "Hello World" } , button }; } void SayHelloClicked (object s, EventArgs e) { // do something } } <?xml version="1.0" encoding="UTF-8"?> <ContentPage xmlns="http://xamarin.com/schemas/2014/fo x:Class="HelloForms.HelloWorld"> <StackLayout> <Label Text="Hello World" /> <Button Text="Say Hello" OnClick="SayHelloClicked" /> </StackLayout> </ContentPage> public partial class HelloWorld : ContentPage { public HelloWorld () { InitializeComponent (); } void SayHelloClicked (object s, EventArgs e) { // do something } } C# XAML
- 12. Demo ■ File > New Project ■ Create a screen ■ Add some code ■ Run on iOS, Android, & Windows Phone
- 14. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project
- 15. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project ■ NuGet Package
- 16. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project ■ NuGet Package ■ App Class
- 17. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project ■ NuGet Package ■ App Class ■ Android app
- 18. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project ■ NuGet Package ■ App Class ■ Android app ■ iOS app
- 19. How Xamarin.Forms works Anatomy of a Xamarin.Forms Solution ■ PCL or Shared Project ■ NuGet Package ■ App Class ■ Android app ■ iOS app ■ Windows Phone app
- 20. Platform Renderers Taking Xamarin.Forms UI to the people (devices) ? ? ?
- 21. Platform Renderers Taking Xamarin.Forms UI to the people
- 22. Platform Renderers Taking Xamarin.Forms UI to the people
- 23. Platform Renderers Taking Xamarin.Forms UI to the people
- 24. Xamarin.Forms brings common UX to everyone iOS does not have a native control for the iPhone, however Xamarin.Forms uses UISplitViewController on iPad. Android has a native 'drawer' control which Xamarin.Forms uses. Windows Phone doesn’t have a comparable UI metaphor, so Xamarin.Forms provides an implementation. MasterDetailPage
- 25. Xamarin.Forms brings common UX to everyone iOS has the UINavigationController which Xamarin.Forms leverages. Android has the navigation stack built in, but Xamarin.Forms adds the automatic 'back' button for API consistency. Windows Phone also has a back- stack with hardware button, so Xamarin.Forms takes advantage of that. NavigationPage
- 26. 140+ new Controls! http://components.xamarin.com From our Partners!
- 27. Demo ■ Write Platform Specific Code
- 28. Dependency Service Easily call into platform-specific code ■ In the common code ■ Code to an Interface public interface ITextToSpeech { void Speak (string text); }
- 29. Dependency Service Easily call into platform-specific code ■ In the common code ■ Code to an Interface ■ Use DependencyService public interface ITextToSpeech { void Speak (string text); } DependencyService.Get<ITextToSpeech>().Speak("Hello from Xamarin Forms");
- 30. Dependency Service Easily call into platform-specific code ■ In the common code ■ Code to an Interface ■ Use DependencyService ■ For each platform ■ implement the Interface [assembly: Xamarin.Forms.Dependency (typeof (Speech))] public class Speech : ITextToSpeech { public Speech () { } public void Speak (string text) { var speechSynthesizer = new AVSpeechSynthesizer (); var speechUtterance = new AVSpeechUtterance (text) { Rate = AVSpeechUtterance.MaximumSpeechRate/4, Voice = AVSpeechSynthesisVoice.FromLanguage ("en-US"), Volume = 0.5f, PitchMultiplier = 1.0f } ; speechSynthesizer.SpeakUtterance (speechUtterance); } }
- 31. Dependency Service Easily call into platform-specific code ■ In the common code ■ Code to an Interface ■ Use DependencyService ■ For each platform ■ implement the Interface ■ use Dependency attribute on the assembly [assembly: Xamarin.Forms.Dependency (typeof (Speech))] public class Speech : ITextToSpeech { public Speech () { } public void Speak (string text) { var speechSynthesizer = new AVSpeechSynthesizer (); var speechUtterance = new AVSpeechUtterance (text) { Rate = AVSpeechUtterance.MaximumSpeechRate/4, Voice = AVSpeechSynthesisVoice.FromLanguage ("en-US"), Volume = 0.5f, PitchMultiplier = 1.0f } ; speechSynthesizer.SpeakUtterance (speechUtterance); } }
- 32. Data Binding Sync views and models ■ Enables MVVM-style development ■ SetBinding in C# ■ {Binding} in XAML ■ also supports the Command pattern
- 33. Custom Renderers Extend or Create Xamarin.Forms Controls ■ Subclass the built-in Platform Renderers ■ Build your own Xamarin.Forms control and renderers (eg. OxyPlot)
- 34. Further Reading… ■ developer.xamarin.com ■ forums.xamarin.com ■ Creating Mobile Apps with Xamarin.Forms - Charles Petzold Available as a FREE download
- 35. Thanks! Nish Anil @nishanil | nish@xamarin.com