3.1 managing application page layout

7/28/2019 3.1 Managing Application Page Layout

1/80

Session 3.1


2/80

Windows Phone

Topics


3/80

Windows Phone

Windows Phone Orientation

3


4/80

Windows Phone

Orientation Warning

4


5/80

Windows Phone

Landscape and Portrait Programs

5


6/80

Windows Phone

Landscape and Portrait Selection

6

SupportedOrientations="Portrait" Orientation="Portrait"


7/80

Windows Phone

Allowing multiple orientations

7

SupportedOrientations="PortraitOrLandscape

Orientation="Portrait"


8/80

Windows Phone

Rotating the Adding Machine

8


9/80

Windows Phone

Silverlight Element positions

9


10/80

Windows Phone


10


11/80

Windows Phone

The OrientationChanged event

11


12/80

Windows Phone


12

private void PhoneApplicationPage_OrientationChanged(

object sender, OrientationChangedEventArgs e)

{

if (e.Orientation == PageOrientation.PortraitUp) {

setPortrait();

}

else {setLandscape();

}

}


13/80

Windows Phone

Setting Landscape Mode

13

private void setLandscape()

{

firstNumberTextBox.Margin = new Thickness(8,19,0,0);

firstNumberTextBox.Width = 207;

secondNumberTextBox.Margin = new Thickness(252,19,0,0);

secondNumberTextBox.Width = 207;

plusTextBlock.Margin = new Thickness(221,35,0,0);resultTextBlock.Margin = new Thickness(538,35,0,0);

}


14/80

Windows Phone

Demo 1: Changing OrientationDemo

14


15/80

Windows Phone

Using Containers

15


16/80

Windows Phone

The StackPanel container

16


17/80

Windows Phone

Creating a StackPanel

17


18/80

Windows Phone

Stack Panel in Action

18


19/80

Windows Phone

19


20/80

Windows Phone

Demo 2: Stack PanelDemo

20


21/80

Windows Phone

Review

21


22/80

Session 3.2


23/80

Windows Phone

Topics


24/80

Windows Phone

Customer Manager

24


25/80

Windows Phone

Application Data

25


26/80

Windows Phone

The Customer class

26

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;}

}


27/80

Windows Phone

The Customers class

27

public class Customers

{public string Name { get; set; }

public Customers(string inName)

{

Name = inName;CustomerList = new List();

}

public List CustomerList;

}


28/80

Windows Phone

Sample Data

28


29/80

Windows Phone

Sample Data

29

string [] firstNames = new string [] { "Rob", "Jim",

"Joe", "Nigel", "Sally", "Tim"} ;string[] lastsNames = new string[] { "Smith", "Jones",

"Bloggs", "Miles", "Wilkinson", "Brown" };


30/80

Windows Phone

Sample Data Generator

30

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 list

result.CustomerList.Add(new Customer(name,

name + "'s House", id));

// Increase the ID for the next customerid++;

}

}

return result;

}


31/80

Windows Phone

Sample Data

31

customers = Customers.MakeTestCustomers();


32/80

Windows Phone

Displaying a List using a StackPanel

32


33/80

Windows Phone

Sample Data

33


34/80

Windows Phone

Sample Data

34

foreach (Customer c in customers.CustomerList)

{TextBlock customerBlock = new TextBlock();

customerBlock.Text = c.Name;

customersStackPanel.Children.Add(customerBlock);

}


35/80

Windows Phone

StackPanel Children

35


36/80

Windows Phone

Stackpanel Display

36


37/80

Windows Phone

Adding a ScrollViewer

37


38/80

Windows Phone

Demo 1: Stackpanel DisplayDemo

38


39/80

Windows Phone

Creating Silverlight Elements

39


40/80

Windows Phone

The Silverlight ListBox element

40


41/80

Windows Phone

Binding Complicated Data

41


42/80

Windows Phone

Creating a DataTemplate

42


43/80

Windows Phone

Using a DataTemplate in a ListBox

43


44/80

Windows Phone

Setting the ItemSource

44

customers = Customers.MakeTestCustomers();

customerList.ItemsSource = customers.CustomerList;


45/80

Windows Phone

Displaying the ListBox

45


46/80

Windows Phone

An Improved DataTemplate

46


47/80

Windows Phone

DataTemplates are Wonderful

47


48/80

Windows Phone

Selecting Items in a ListBox

48


49/80

Windows Phone

Selection Changed Events

49


50/80

Windows Phone

Selection Changed Events

50

private void customerList_SelectionChanged(object sender,

SelectionChangedEventArgs e){

// when we get here the user has selected a customer

Customer selectedCustomer =

customerList.SelectedItem as Customer;

MessageBox.Show(selectedCustomer.Name +

" is selected");

}


51/80

Windows Phone

Demo 2: Selecting ItemsDemo

51


52/80

Windows Phone

Review

52


53/80

Session 3.3


54/80

Windows Phone

Topics


55/80

Windows Phone

The Story So Far

55


56/80

Windows Phone

Multi-page applications

56


57/80

Windows Phone

Adding another page

57


58/80

Windows Phone

Pages and projects

58


59/80

Windows Phone

Page Navigation

59

private void page2Button_Click(object sender,

RoutedEventArgs e){

NavigationService.Navigate(

new Uri("/CustomerDetailPage.xaml",

UriKind.RelativeOrAbsolute));

}


60/80

Windows Phone

The UriKind

60

private void page2Button_Click(object sender,

RoutedEventArgs e){


new Uri("/CustomerDetailPage.xaml",

UriKind.RelativeOrAbsolute));

}


61/80

Windows Phone

Missing page exceptions

61


62/80

Windows Phone

Using the Back button

62


63/80

Windows Phone

Overriding the Back button

63


64/80

Windows Phone

Disabling the Back Button

64

private void PhoneApplicationPage_BackKeyPress(object sender,

System.ComponentModel.CancelEventArgs e)

{

e.Cancel = true;

}


65/80

Windows Phone

Using a MessageBox

65

private void PhoneApplicationPage_BackKeyPress(object sender,

System.ComponentModel.CancelEventArgs e)

{

if (MessageBox.Show("Do you really want to exit?",

"Page Exit",

MessageBoxButton.OKCancel)

!= MessageBoxResult.OK)

{

e.Cancel = true;

}

}


66/80

Windows Phone

Passing data between pages

66


67/80

Windows Phone

Assembling a data uri

67

// Get the selected customer from the list

Customer selectedCustomer = customerList.SelectedItemas Customer;

// Build a navigation string containing the information


new Uri("/CustomerDetailPage.xaml?" +

"name=" + selectedCustomer.Name + "&" +"address=" + selectedCustomer.Address,

UriKind.Relative));


68/80

Windows Phone

Page navigated events

68


69/80

Windows Phone

Loading data from the uri

69

protected override void OnNavigatedTo

(System.Windows.Navigation.NavigationEventArgs e){

string name, address;

if (NavigationContext.QueryString.TryGetValue("name",

out name))

nameTextBlock.Text = name;}


70/80

Windows Phone

Demo 2: Passing DataDemo

70


71/80

Windows Phone

Sharing objects between pages

71


72/80

Windows Phone

The App.xaml page

72


73/80

Windows Phone

The App class

73

public partial class App : Application

{// To be used from all pages in the application

public Customer ActiveCustomer;

}


74/80

Windows Phone

Getting a reference to the App

74

protected override void OnNavigatedTo(

System.Windows.Navigation.NavigationEventArgs e){

base.OnNavigatedTo(e);

// Get the parent App containing the active customer

App thisApp = Application.Current as App;

// Set the data context for the Grid to the selected

// customer

customerDisplayGrid.DataContext = thisApp.ActiveCustomer;

}


75/80

Windows Phone


75







// customer


}


76/80

Windows Phone


76







// customer


}


77/80

Windows Phone


77







// customer


}


78/80

Windows Phone

Setting the Edit Data Context

78







// customer


}


79/80

Windows Phone

Demo 3: Shared DataDemo

79


80/80

Review

3.1 managing application page layout

Documents