Lecture # 6...Windows Phone Applying Data Binding 20 Windows Phone One Way binding for the answer 21...

Post on 07-Oct-2020

0 views 0 download

transcript

Engr. Ali Javed 11th March, 2014

Lecture # 6

Windows Phone

Instructor’s Information Instructor: Engr. Ali Javed

Assistant Professor

Department of Software Engineering

U.E.T Taxila

Email: ali.javed@uettaxila.edu.pk

Contact No: +92-51-9047747

Office hours: Monday, 09:00 -11:00, Office # 7 S.E.D

Engr. Ali Javed

Windows Phone

Course Information

Course Name: Mobile Application Development

Course Code: SE-5020

Course Link: http://web.uettaxila.edu.pk/CMS/SP2014/seMADms/

Engr. Ali Javed

Windows Phone

Data Binding

5

Windows Phone

One Way Data Binding

6

Windows Phone

Two Way Data Binding

7

Windows Phone

Creating an Adder class

8

Windows Phone

Creating an object to bind to

9

public class AdderClass{

private int topValue;public int TopValue{

get { return topValue; }set { topValue = value; }

}

// repeat for bottomValue

public int AnswerValue{

get { return topValue + bottomValue;}}

}

Windows Phone

The AdderClass

10

Windows Phone

Adding Notification Behaviour

11

public interface INotifyPropertyChanged{

// Summary:// Occurs when a property value changes.event PropertyChangedEventHandler PropertyChanged;

}

Windows Phone

Silverlight display elements

12

PropertyChanged(this,new PropertyChangedEventArgs("AnswerValue"));

Windows Phone

Reading back the property

13

public int AnswerValue{

get{

return topValue + bottomValue;}

}

Windows Phone

Demo

14

Windows Phone

Binding a class to the xaml

15

xmlns:local="clr-namespace:AddingMachine"

Windows Phone

Mapping a class to a resource

16

<phone:PhoneApplicationPage.Resources><local:AdderClass x:Key="AdderClass" />

</phone:PhoneApplicationPage.Resources>

Windows Phone

Adding the resource to an element

17

<Grid x:Name="LayoutRoot" Background="Transparent"DataContext="{StaticResource AdderClass}">

Windows Phone

Business Objects and Silverlight

18

Windows Phone

Binding the top line to AdderClass

19

Windows Phone

Applying Data Binding

20

Windows Phone

One Way binding for the answer

21

Windows Phone

Databinding and the DataContext

22

<TextBox Height="72" HorizontalAlignment="Left"Margin="8,19,0,0" Name="firstNumberTextBox" Text="{BindingTopValue, Mode=TwoWay}" VerticalAlignment="Top"Width="460" TextAlignment="Center" >

Windows Phone

Databinding and the DataContext

23

// Constructorpublic MainPage(){

InitializeComponent();

AdderClass adder = new AdderClass();ContentGrid.DataContext = adder;

}

Windows Phone

Demo

24

Session 4.4

Windows Phone

Topics

Windows Phone

Customer Manager

27

Windows Phone

Application Data

28

Windows Phone

The Customer class

29

public class Customer{

public string Name { get; set; }public string Address { get; set; }public int ID { get; set; }

public Customer(string inName, string inAddress, int inID)

{Name = inName;Address = inAddress;ID = inID;

}}

Windows Phone

The Customers class

30

public class Customers{

public string Name { get; set; }

public Customers(string inName) {

Name = inName;CustomerList = new List<Customer>();

}

public List<Customer> CustomerList;

}

Windows Phone

Sample Data

31

Windows Phone

Sample Data

32

string [] firstNames = new string [] { "Rob", "Jim","Joe", "Nigel", "Sally", "Tim"} ;

string[] lastsNames = new string[] { "Smith", "Jones","Bloggs", "Miles", "Wilkinson", "Brown" };

Windows Phone

Sample Data Generator

33

public static Customers MakeTestCustomers(){

int id = 0;

foreach (string lastName in lastsNames) {foreach (string firstname in firstNames) {

//Construct a customer namestring name = firstname + " " + lastName;//Add the new customer to the listresult.CustomerList.Add(new Customer(name,

name + "'s House", id));// Increase the ID for the next customerid++;

}}return result;

}

Windows Phone

Displaying a List using a StackPanel

34

Windows Phone

Sample Data

35

<StackPanel HorizontalAlignment="Left"Margin="0,0,0,0" Name="customersStackPanel"VerticalAlignment="Top"/>

Windows Phone

Sample Data

36

foreach (Customer c in customers.CustomerList){

TextBlock customerBlock = new TextBlock();customerBlock.Text = c.Name;customersStackPanel.Children.Add(customerBlock);

}

Windows Phone

StackPanel Children

37

Windows Phone

Stackpanel Display

38

Windows Phone

Adding a ScrollViewer

39

<ScrollViewer><StackPanel HorizontalAlignment="Left“

Margin="0,0,0,0" Name="customersStackPanel“VerticalAlignment="Top" />

</ScrollViewer>

Windows Phone

Demo

40

Windows Phone

The Silverlight ListBox element

41

Windows Phone

The ListBox and Data Binding

42

Windows Phone

Binding a Single Item

43

<TextBlock Height="46" HorizontalAlignment="Left"Margin="158,208,0,0" Name="resultTextBlock"Text="{Binding Path=AnswerValue}"VerticalAlignment="Top" FontSize="30" Width="160"TextAlignment="Center" />

Windows Phone

Binding Complicated Data

44

Windows Phone

Creating a DataTemplate

45

<DataTemplate><StackPanel>

<TextBlock Text="{Binding Name}"/><TextBlock Text="{Binding Address}"/>

</StackPanel></DataTemplate>

Windows Phone

Using a DataTemplate in a ListBox

46

<ListBox Name="customerList"><ListBox.ItemTemplate>

<DataTemplate><StackPanel>

<TextBlock Text="{Binding Name}"/><TextBlock Text="{Binding Address}"/>

</StackPanel></DataTemplate>

</ListBox.ItemTemplate></ListBox>

Windows Phone

Setting the ItemSource

47

customers = Customers.MakeTestCustomers();customerList.ItemsSource = customers.CustomerList;

Windows Phone

Displaying the ListBox

48

Windows Phone

An Improved DataTemplate

49

<DataTemplate><StackPanel>

<TextBlock Text="{Binding Name}"Style="{StaticResource PhoneTextExtraLargeStyle}"/><TextBlock Text="{Binding Address}"Style="{StaticResource PhoneTextSubtleStyle}"/>

</StackPanel></DataTemplate>

Windows Phone

Selecting Items in a ListBox

50

Windows Phone

Selection Changed Events

51

<ListBox Name="customerList"SelectionChanged="customerList_SelectionChanged">

Windows Phone

Selection Changed Events

52

private void customerList_SelectionChanged(object sender,SelectionChangedEventArgs e)

{// when we get here the user has selected a customerCustomer selectedCustomer =

customerList.SelectedItem as Customer;

MessageBox.Show(selectedCustomer.Name + " is selected");

}

Windows Phone

Demo

53

Windows Phone

Referencehttp://www.techopedia.com/definition/24291/isolated-storage-net

http://msdn.microsoft.com/en-us/library/3ak841sy(v=vs.110).aspx

54Engr. Ali Javed

Windows Phone

55Engr. Ali Javed

For any query Feel Free to ask