Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf ·...

20
4/25/15 1 © 2014 Xamarin.All rights reserved.

Transcript of Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf ·...

Page 1: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

1©   2014  Xamarin.  All   rights  reserved.

Page 2: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

2©   2014  Xamarin.  All   rights  reserved.

v

§§

v

§

Each cell is represented by some data structure which is then visualized on the screen

headshot.Source = ...;nameEntry.Text = person.Name;emailEntry.Text = person.Email;birthday.Date = person.Dob;...

nameEntry.TextChanged +=  (sender,  e)  =>  person.Name =  nameEntry.Text;emailEntry.TextChanged +=  (sender,  e)  =>  person.Email =emailEntry.Text;

Page 3: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

3©   2014  Xamarin.  All   rights  reserved.

Binding acts as an intermediary – moving the data between the source and target

Source Target

Any Object

Any public property

BindableObject

BindablePropertyBinding

Source Path Target

Can be any accessible object

Public property defined on the source object

Must be a BindableProperty

Page 4: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

4©   2014  Xamarin.  All   rights  reserved.

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;

...

Binding identifies the source of the binding data – this is where the data comes from, in this case it's a single person defined in our

application

1

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;nameBinding.Path =  "Name";

...

Binding identifies the property path which identifies a property on the source to get the data from, in this case we want to get the value from the Person.Name

property

2

Page 5: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

5©   2014  Xamarin.  All   rights  reserved.

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;nameBinding.Path =  "Name";

...

new Binding("Property")new Binding("Property.Child")new Binding("Property[Key]")new Binding("Property[1]")new Binding("Item[Key]")new Binding(".")

More Path Examples

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;nameBinding.Path =  "Name";

nameEntry.SetBinding(Entry.TextProperty, nameBinding);

Binding is associated to the target property using the BindableObject.SetBinding method

3

Page 6: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

6©   2014  Xamarin.  All   rights  reserved.

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;nameBinding.Path =  "Name";

nameEntry.SetBinding(Entry.TextProperty, nameBinding);

This is passed the specific target property the binding will work with – this must be a BindableProperty

3

Person person = new Person()   {  Name  =  "Homer  Simpson",   ...  };  

Entry nameEntry = new Entry();  

Binding nameBinding = new Binding();  nameBinding.Source = person;nameBinding.Path =  "Name";

nameEntry.SetBinding(Entry.TextProperty, nameBinding);

… and the binding which identifies the source and the property on the source to apply

3

Page 7: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

7©   2014  Xamarin.  All   rights  reserved.

<StackLayout Padding="20" Spacing="20"><StackLayout.Resources>

<ResourceDictionary><Person   x:Key="homer" Name="Homer   Simpson"   .../>

</ResourceDictionary></StackLayout.Resources><Entry Text="{Binding Name,  

Source={StaticResource homer}}" />...

</StackLayout>

{Binding}  takes the Path as the first unnamed argument

Assigned to Target property

Source supplied through resource

v

v

public class Person{

public string Name { get; set; }public string Email { get; set; }public Gender Gender { get; set; }

}

Page 8: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

8©   2014  Xamarin.  All   rights  reserved.

Person person = new Person()  {  Name  =  "Homer  Simpson",  ...  };  ...nameEntry.BindingContext =  person;nameEntry.SetBinding(Entry.TextProperty, new Binding("Name"));

Binding only identifies the Path – no source is set; it will then look to the BindingContext on the parent control as the source for the binding data

public partial class PersonDetailsPage : ContentPage{

public PersonDetailsPage (Person person){

BindingContext = person;InitializeComponent ();

}}

Can set the BindingContext once on the root page and it is then assigned to every control (child) on that page

Page 9: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

9©   2014  Xamarin.  All   rights  reserved.

Model-View-ViewModel

ModelView ViewModel

How to display information

What to displayFlow of interaction

Business LogicData objects

Events

DataData

Model-View-ViewModel

ModelView ViewModel

Xamarin.Forms Data Binding

Events

Data

Page 10: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

10©   2014  Xamarin.  All   rights  reserved.

INotifyPropertyChanged

INotifyPropertyChanged

Page 11: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

11©   2014  Xamarin.  All   rights  reserved.

INotifyPropertyChanged

INotifyPropertyChanged

Page 12: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

12©   2014  Xamarin.  All   rights  reserved.

Data Binding – XAML

Data Binding – XAML

Page 13: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

13©   2014  Xamarin.  All   rights  reserved.

Pros Cons

§Provides higher testable surface§Centralizes the visual & business logic§Can reduce converter code used to tie

models to UI§Takes advantage of binding

infrastructure

§Requires infrastructure, more for some platforms than others

§Necessitates multiple layers which may not be worth it for smaller apps

§Bindings can be hard to debug and may not be efficient for large data sets

v

v

v

BooleanToColorConverter

ArrayToStringConverter

DoubleToIntegerConverter

NotBooleanConverter

IntegerToBooleanConverter

Page 14: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

14©   2014  Xamarin.  All   rights  reserved.

Menu Button ToolbarItem TextCell

other patterns abstractions

DependencyInjection

Factory and Singleton Command

Navigation Alerts + Prompts Messages

Page 15: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

15©   2014  Xamarin.  All   rights  reserved.

v

v

Publisher

MessagingCenter

Subscriber Subscriber

MessagingCenter.Send<MainViewModel,  ItemViewModel>(this,  "Select",  selectedItem);

Publisher identifies sending type and parameter type through generic parameters

Page 16: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

16©   2014  Xamarin.  All   rights  reserved.

MessagingCenter.Subscribe<MainViewModel,  ItemViewModel> (this,  "Select",  (mainVM,  selectedItem)  => {

//  Action  to  run  when  "Select"  is  received  //  from  MainViewModel

});

Combination of the sender type, string message, and parameter type is the key for the message recipient – these must match between publisher and subscriber

Xamarin.Forms has support for dealing with a few, very common platform-specific features

Page.DisplayAlertto show simple alert

messages

Timer management using Device.StartTimer

Device.OpenUrlto launch external apps based on a URL scheme

Page 17: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

17©   2014  Xamarin.  All   rights  reserved.

UI Thread marshaling with

Device.BeginInvokeOnMainThread

Mapping and Location through

Xamarin.Forms.Maps

v

platform-specific

Dialing the phone would require platform-specific code

Page 18: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

18©   2014  Xamarin.  All   rights  reserved.

abstraction implemented by the target platform which defines the platform-specific functionality

PhoneDialerIOS

PhoneDialerDroid

PhoneDialerWP8

Platform projects implement the shared dialer interface using the platform-specific APIs

Shared code defines IDialer interface to represent required functionality

public interface IDialer{

bool MakeCall(string number);}

1 Define an interface or abstract class in the shared code project(PCL)

public interface IDialer{

bool MakeCall(string number);}

Page 19: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

19©   2014  Xamarin.  All   rights  reserved.

2 Provide implementation of abstraction in each platform-specific project

class  PhoneDialerIOS :  IDialer{

public  bool MakeCall(string number)  {//  Implementation  goes  here

}}

3 Expose platform-specific implementation using assembly-level attribute in platform-specific project

[assembly:  Dependency(typeof(PhoneDialerIOS))]

Page 20: Workshop-Part3 MVVM - SDD Conferencesddconf.com/brands/sdd/library/Xamarin_Part_3.pdf · 2015-05-08 · 4/25/15 ©2014"Xamarin."All"rights"reserved. 3 Binding acts as an intermediary–

4/25/15

20©   2014  Xamarin.  All   rights  reserved.

4Retrieve and use the dependency anywhere using DependencyService.Get<T> (both shared and platform specific projects can use this API)

IDialer dialer  =  DependencyService.Get<IDialer>();if (dialer  !=  null)  {

...}

Summary