T U T O R I A L  2009 Pearson Education, Inc. All rights reserved Weather Viewer Application Introducing Microsoft Silverlight, XML, LINQ to XML and Web Services

 2009 Pearson Education, Inc. All rights reserved. 2 Outline 32.1 Platform Overview 32.2 Silverlight 2 Runtime and Tools Installation 32.3 Test-Driving the Weather Viewer Application 32.4 Overviewing the Weather Viewer Application 32.5 Creating the Weather Viewer Application

 2009 Pearson Education, Inc. All rights reserved. 3 Outline 32.6 Calling a Web Service and Using LINQ to XML to Process the Results 32.7 Customizing the Data Presentation 32.8 Creating a Customized Silverlight Control 32.9 Final Weather Viewer Application Code

 2009 Pearson Education, Inc. All rights reserved. 4 In this tutorial you will learn: ■Use Silverlight to create a rich Internet application. ■Create Silverlight user interfaces in XAML. ■Use LINQ to XML to convert XML into a collection of Visual Basic objects. ■Use XML Axis properties to manipulate XML content in Visual Basic. ■Customize the appearance of existing Silverlight controls. ■Create a custom Silverlight control. Objectives

Application Requirements  2009 Pearson Education, Inc. All rights reserved Test-Driving the Weather Viewer Application You have been asked to create a web-based application that allows the user to enter a zip code and displays the weather forecast for the corresponding United States city. To obtain the weather forecast, you must use a web service. The application should display the days of the week returned by the web service and the image that represents the weather for each day. The user should then be able to click the appropriate day to see the high and low temperatures for that day in both Fahrenheit and Celsius.

 2009 Pearson Education, Inc. All rights reserved. 6 ■Silverlight TM is Microsoft’s platform for Rich Internet Applications –These applications that offer the responsiveness and rich GUI features of desktop applications. ■Silverlight runs as a browser plug-in compatible with most browsers and operating systems. ■The user interface is described in XAML and a code-behind file contains the program logic Platform Overview

 2009 Pearson Education, Inc. All rights reserved. 7 Silverlight 2’s.NET Platform Subset ■Silverlight is a robust, cross-platform, cross-browser subset of the.NET platform. ■Silverlight supports.NET collections, input/output, generics, multithreading, globalization, XML and LINQ. ■Silverlight also includes APIs for interacting with other elements in a web page Platform Overview (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 8 Graphics and GUI Capabilities ■Silverlight’s graphics are a subset of the WPF framework. ■Figure 32.1 shows the default list of controls that you can use in Silverlight. Figure 32.1 | Default controls listed in the IDE’s Toolbox for Silverlight applications Platform Overview

 2009 Pearson Education, Inc. All rights reserved. 9 ■Data Binding –Silverlight’s data-binding model makes it easy for you to display data from objects, collections, databases, and XML. ■Networking –Silverlight’s networking support allows you to write browser-based applications that invoke web services and other networking technologies Platform Overview (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 10 ■Download and install the following software: –Silverlight 2 Runtime –Silverlight Tools Beta 1 for Visual Studio 2008 ■Silverlight is not currently available for Visual Studio Express Edition Silverlight 2 Runtime and Tools Installation

 2009 Pearson Education, Inc. All rights reserved. 11 Test-Driving the WeatherViewer Application ■Run the completed Weather Viewer application (Fig. 32.2). Figure 32.2 | Weather Viewer application before the user enters a zip code. Note that the screen captures in this tutorial were taken in Internet Explorer 8 beta, but the application runs in any browser with the Silverlight 2 runtime installed TextBox in which the user enters the zip code

 2009 Pearson Education, Inc. All rights reserved. 12 Test-Driving the WeatherViewer Application (Cont.) ■Enter a US zip code in the TextBox (Fig. 32.3), then press the Get Weather Button to obtain the weather forecast. Figure 32.3 | Displaying the weather forecast for the specified zip code. User selects a day to see the detailed forecast for that day

 2009 Pearson Education, Inc. All rights reserved. 13 Test-Driving the WeatherViewer Application (Cont.) ■Click one of the days in the forecast to see the complete details for that day (Fig. 32.4). Figure 32.4 | Complete weather details for the selected day. Customized control displays the detailed forecast and blocks the user from accessing the rest of the GUI until the Close Button is clicked

 2009 Pearson Education, Inc. All rights reserved. 14 When the user presses the Get Weather Button: Obtain the US zip code from the Zip Code… TextBox Use a WebClient object to invoke the WeatherForecast web service fromw When the response data is received from the web service: Convert the XML weather forecast into WeatherData objects Use data binding to display the Weather Data objects in a ListBox 32.4 Overviewing the Weather Viewer Application

 2009 Pearson Education, Inc. All rights reserved. 15 When the user selects a particular day in the weather forecast: Display the complete details of the forecast for that day When the user clicks the Close Button in details view: Close the details view When the user changes the text in the Zip Code… TextBox: Clear the contents of the ListBox 32.4 Overviewing the Weather Viewer Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 16 ■Use an ACE table to convert the pseudocode into Visual Basic (Fig. 32.5). Figure 32.5 | Weather Viewer application’s ACE table. (Part 1 of 2.) Action/Control/Event (ACE) Table for the Weather Viewer Application

 2009 Pearson Education, Inc. All rights reserved. 17 Figure 32.5 | Weather Viewer application’s ACE table. (Part 2 of 2.) Action/Control/Event (ACE) Table for the Weather Viewer Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 18 ■In Visual Studio, select File > New Project (Fig 28.6). ■Under Visual Basic Silverlight project types, select Silverlight Application. ■Name your project WeatherViewer. Creating a Silverlight Application Figure 32.6 | Creating a new Silverlight Application project. Silverlight Application project template

 2009 Pearson Education, Inc. All rights reserved. 19 ■Select Add a new Web to the solution for hosting the control and choose Web Application Project. ■Your IDE should now appear similar to Figure Creating a Silverlight Application (Cont.) Figure 32.7 | New Silverlight application in Visual Studio. Design view split into a designer and XAML editor

 2009 Pearson Education, Inc. All rights reserved. 20 Basics of a Silverlight Application Project ■A basic Silverlight application has two XAML files: – Page.xaml defines the application’s GUI. – App.xaml declares your application’s shared resources, such as styles for GUI elements. ■It also has two code-behind files. – Page.xaml.vb declares the GUI event handlers and other methods. – App.xaml.vb defines application-level event handlers Creating the Weather Viewer Application

 2009 Pearson Education, Inc. All rights reserved. 21 ■The Page.xaml file is similar to the default XAML for a WPF application. ■In Silverlight, the main element is a UserControl. ■A Silverlight application is packaged as a.xap file. ■The web page in which the Silverlight application will be hosted references the application’s.xap file to launch the Silverlight Runtime Creating the Weather Viewer Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 22 Laying Out and Building the GUI ■There are three types of layout containers in Silverlight— Canvas, StackPanel and Grid. –A Canvas enables you to precisely control positioning. –A StackPanel enables you to place a set of controls horizontally or vertically. –A Grid enables you to specify rows and columns with fixed sizes or with auto-size Creating the Weather Viewer Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 23 ■Remove White from the Background attribute (Fig. 32.8), then type Ctrl + Space to display an IntelliSense window. –Specify any color you wish as a hexadecimal value of the form #RRGGBB. ■Insert the ShowGridLines attribute so that you can see the grid layout better as you design. Defining the Layout Using Grid s Figure 32.8 | Changing the background color of the Grid and displaying grid lines. Grid layout container with Background of LightSkyBlue and gridlines displayed

 2009 Pearson Education, Inc. All rights reserved. 24 ■Split the Grid into two rows and one column (Fig. 32.9). –The first row’s height should be 35 pixels. –The asterisk ( * ) indicates that the row should occupy all remaining space. Defining the Layout Using Grid s (Cont.) Figure 32.9 | Defining the rows and column in the main Grid. Defines two rows in the Grid

 2009 Pearson Education, Inc. All rights reserved. 25 ■The first row of the GUI contains three elements. –Lines 16–26 of Fig define the Grid element that manages the GUI controls in the first row. –Lines 21–25 create a Grid.ColumnDefinitions element containing three ColumnDefinition s. Defining the Layout Using Grid s (Cont.) Figure | Defining a Grid that will contain the first row of elements in the GUI. Defines a nested Grid with one row and three columns

 2009 Pearson Education, Inc. All rights reserved. 26 ■The Border element (Fig ) contains a TextBlock element. –The Grid.Row and Grid.Column attributes indicate the row and column in which the Border is placed. –The Border has a CornerRadius of 10 (which rounds its corners). Defining the Layout Using Grid s (Cont.) Figure | Inserting controls into the nested Grid. Defines a Border containing a TextBlock in row 0 and column 0 of the nested Grid Defines a TextBox in row 0 and column 1 of the nested Grid Defines a Button in row 0 and column 2 of the nested Grid

 2009 Pearson Education, Inc. All rights reserved. 27 ■A TextBlock (Fig ) is used here just to show you that there is a second row. Defining the Layout Using Grid s (Cont.) Figure | Inserting an element in the second row of the main Grid. Defines a TextBlock in row 1 of the main Grid

 2009 Pearson Education, Inc. All rights reserved. 28 ■Run the application (Fig ). ■Notice that the application does not resize automatically. Defining the Layout Using Grid s (Cont.) Figure | Weather Viewer running in a browser.

 2009 Pearson Education, Inc. All rights reserved. 29 ■Remove the main UserControl ’s Width and Height attributes. ■The application now occupies the entire browser window (Fig ). Defining the Layout Using Grid s (Cont.) Figure | Resizable Weather Viewer running in a browser. Removing the Width and Height attributes from the UserControl enables the application to resize with the browser window

 2009 Pearson Education, Inc. All rights reserved. 30 ■A web service is a software component stored on one computer that can be accessed via method calls over a network. ■Web services have important implications for business-to-business transactions. –They enable businesses to conduct transactions via standardized, web services rather than relying on proprietary applications. –Web services typically are platform and language independent, so companies can collaborate without worrying about compatibility Calling a Web Service and Using LINQ to XML to Process the Results

 2009 Pearson Education, Inc. All rights reserved. 31 ■Web services can be invoked directly from a web browser using a technique called Representational State Transfer (REST). –Each operation is identified by a unique URL Calling a Web Service and Using LINQ to XML to Process the Results (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 32 ■Remove the TextBlock at lines 40–41, then double click the DataGrid control in the Toolbox to insert a DataGrid control (Fig ). Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler Figure | Inserted DataGrid element. Defines a DataGrid control

 2009 Pearson Education, Inc. All rights reserved. 33 ■The DataGrid control (Fig ) is in a separate library (known as an assembly) from the other Silverlight controls. ■An assembly (represented as a.dll file) is the mechanism used to package compiled.NET code for reuse. Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler (Cont.) Figure | Reformatting the UserControl start tag for readability.

 2009 Pearson Education, Inc. All rights reserved. 34 ■The DataGrid ’s x:Name attribute (Fig ) indicates the control’s name for use in Visual Basic code. ■The attribute AutoGenerateColumns indicates that the DataGrid should determine its columns from the source of its data. Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler (Cont.) Figure | Configuring the DataGrid. DataGrid control configured to appear in row 1 of the main Grid

 2009 Pearson Education, Inc. All rights reserved. 35 ■Right click Page.xaml in the Solution Explorer and selecting View Code. ■At the top of the Code view, the Class Name ComboBox (Fig ) lists classes and objects. Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler (Cont.) Figure | Selecting submitButton from the Class Name ComboBox. Selecting submitButton from the Class Name ComboBox

 2009 Pearson Education, Inc. All rights reserved. 36 ■Select submitButton from the Class Name ComboBox, then select Click from the Method Name ComboBox (Fig ). ■This generates a Click event handler for the Button. Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler (Cont.) Figure | Selecting the Click event in the Method Name ComboBox. Selecting Click event from the Method Name ComboBox

 2009 Pearson Education, Inc. All rights reserved. 37 ■When the user presses the Get Weather Button, the application should use the zip code to invoke the web service (Fig ). Adding a DataGrid to the GUI and Creating the submitButton ’s Click Event Handler (Cont.) Figure | Get Weather Button ’s event handling code. Changing the Cursor to the Wait cursor to indicate that the application is awaiting a response Defining the web service URL Asynchronously calling the web service

 2009 Pearson Education, Inc. All rights reserved. 38 ■You must import the System.Net namespace (Fig ). Creating a WebClient Object and Using It to Invoke a Web Service Figure | Importing the System.Net namespace. Importing namespace System.Net

 2009 Pearson Education, Inc. All rights reserved. 39 ■A WebClient object must be used an instance variable (Fig ). –The keyword WithEvents indicates that events are associated with the object. –When the DownloadStringCompleted event occurs, the application processes and displays the information. Creating a WebClient Object and Using It to Invoke a Web Service (Cont.) Figure | Creating a WebClient object. Creating a WebClient object to invoke the web service

 2009 Pearson Education, Inc. All rights reserved. 40 Figure | Calling DisplayWeatherForecast in response to the WebClient ’s DownloadStringCompleted event. Display the results if there are results to process Creating a WebClient Object and Using It to Invoke a Web Service (Cont.) ■In Code view, select the weatherService object for the Class Name and select DownloadStringCompleted for the Method Name (Figure 32.23). Changing the Cursor to the Arrow cursor to indicate that the response has been received

 2009 Pearson Education, Inc. All rights reserved. 41 Creating a WebClient Object and Using It to Invoke a Web Service (Cont.) ■The property Error is used to determine whether an error occurred. ■If the Result property (a String ) contains the substring "Day" there is information you can display, and you call method DisplayWeather­Forecast.

 2009 Pearson Education, Inc. All rights reserved. 42 ■Right click the project in Solution Explorer and select Add > Existing Item. –Navigate to C:\Examples\Tutorial32\ and select WeatherData.vb. ■Add line 2 (Fig ) to the Page.xaml.vb code- behind file. Notice that the IDE reports an error, indicating that the namespace cannot be found. Using LINQ to XML to Convert XML Data into a Collection of Objects Figure | Importing the System.Xml.Linq namespace. Importing namespace System.Xml.Linq

 2009 Pearson Education, Inc. All rights reserved. 43 ■Right click the project in Solution Explorer and select Add Reference. –In the.NET tab, select the assembly System.Xml.Linq (Fig ) and click OK. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Adding a reference to the System.Xml.Linq assembly. Selecting the System.Xml.Linq assembly to add to your project

 2009 Pearson Education, Inc. All rights reserved. 44 ■XML uses namespaces in a manner similar to Visual Basic applications. ■To enable XML data processing of weather data, you must import the namespace contained in the XML (Fig ). Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Importing the XML namespace for the weather-forecast information. Importing the XML namespace used in the XML data

 2009 Pearson Education, Inc. All rights reserved. 45 ■This method (Fig ) receives the String containing the XML returned by the web service. ■Line 52 creates an XDocument variable and uses method XDocument.Parse to convert the String object into XML. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Adding the DisplayWeatherForecast method. Parsing the XML response String to prepare it for use with LINQ to XML

 2009 Pearson Education, Inc. All rights reserved. 46 ■This LINQ query (Fig ) converts the XML data into a collection of WeatherData objects. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Converting XML to WeatherData objects with LINQ to XML. Selecting the XML’s WeatherData elements that are Creating a new object of class WeatherData from each XML WeatherData element Using XML property syntax to access the XML elements within each WeatherData element and assign their values to properties of the new WeatherData object

 2009 Pearson Education, Inc. All rights reserved. 47 ■The From clause indicates that we are selecting items from the weatherXML XDocument object. –The ellipsis notation (... ) represents the new XML descendants property that is used to select XML elements. –In this case, indicates that all the WeatherData elements in the XML document should be selected. ■The Select clause creates a new WeatherData object for each WeatherData element in the XML. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 48 ■The With keyword indicates that the new WeatherData object should be used implicitly to access the object’s properties. ■The notation uses Visual Basic’s new XML child property syntax to access the child element of the WeatherData element. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 49 ■Save your files to ensure that the forecastList is recognized by IntelliSense, then insert lines 72–73 (Fig ). ■WPF’s powerful data-binding capabilities make it easy for you to display the weather data in the DataGrid. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Binding the DataGrid ’s ItemsSource property to the collection of WeatherData objects. Specifying the DataGrid’s ItemsSource from which it will extract data to display

 2009 Pearson Education, Inc. All rights reserved. 50 ■Run the application (Fig ). ■Enter a zip code and press the Get Weather Button to invoke the web service. Using LINQ to XML to Convert XML Data into a Collection of Objects (Cont.) Figure | Displaying the weather forecast in a DataGrid. DataGrid showing the data from a collection of WeatherData objects

 2009 Pearson Education, Inc. All rights reserved. 51 Replacing the DataGrid with a ListBox ■Replace lines 41–42 in Page.xaml with lines 41–42 of Fig ■Once you’ve added the ListBox, remove the xmlns:my declaration in line 2—it is no longer needed. Figure | Replacing the DataGrid with a ListBox. Replacing the DataGrid with a ListBox

 2009 Pearson Education, Inc. All rights reserved. 52 ■Run the application (Fig ). Enter a zip code and press the Get Weather button to invoke the web service. ■By default, a ListBox shows the String representation of each item in its ItemsSource. ■Since we did not define a ToString method for the WeatherData class, the ListBox shows the name of the class. Replacing the DataGrid with a ListBox (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 53 Figure | Showing the String representation of WeatherData objects in the ListBox. ListBox rendering its items as Strings Replacing the DataGrid with a ListBox (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 54 ■The ListBox.ItemTemplate element (Fig ) customizes the ListBox ’s appearance. ■The DataTemplate element binds data from a data source to the ListBox ’s items. ■The Image control’s Source attribute specifies the location of the image to display. –This uses Binding markup extension to obtain the attribute’s value from the WeatherImage property of an object. Changing the ListBox ’s ItemTemplate to Display the Date and the Weather Image

 2009 Pearson Education, Inc. All rights reserved. 55 Figure | Changing the ListBox ’s ItemTemplate. Creating a custom ListBox ItemTemplate that displays the weather image and date for each WeatherData object Changing the ListBox ’s ItemTemplate to Display the Date and the Weather Image (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 56 ■Run the application (Fig ). ■Enter a zip code and press the Get Weather Button to invoke the web service. Changing the ListBox ’s ItemTemplate to Display the Date and the Weather Image (Cont.) Figure | Displaying an image and the day of the week for each day in the weather forecast. ListBox items rendered with a custom ItemTemplate

 2009 Pearson Education, Inc. All rights reserved. 57 Changing the ListBox ’s ItemsPanel to Arrange the Items Horizontally ■The ListBox.ItemsPanel element (Fig ) specifies how the items in the ListBox should be organized. ■The ItemsPanelTemplate specifies the orientation of the ListBox ’s elements. Figure | Changing the ListBox ’s ItemsPanel. Creating a custom ListBox ItemsPanel that arranges the ListBox items horizontally in a StackPanel

 2009 Pearson Education, Inc. All rights reserved. 58 Changing the ListBox ’s ItemsPanel to Arrange the Items Horizontally (Cont.) ■Run the application (Fig ). ■Enter a zip code and press the Get Weather Button. Figure | Displaying the ListBox items horizontally. ListBox items rendered horizontally with a custom ItemsPanel

 2009 Pearson Education, Inc. All rights reserved. 59 Adding a UserControl to the Application ■Right click the WeatherViewer project in the Solution Explorer and select Add > New Item…. ■Select the Silverlight User Control template and name the file WeatherDetailsView.xaml (Fig ). Figure | Adding a new UserControl to a Silverlight application. Silverlight User Control template

 2009 Pearson Education, Inc. All rights reserved. 60 ■Remove the new UserControl ’s Width and Height attributes so that the control fits the layout container. ■Replace the Grid element with the XAML shown in lines 4–34 of Figure Adding a UserControl to the Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 61 Adding a UserControl to the Application Figure | Adding controls to a new UserControl.

 2009 Pearson Education, Inc. All rights reserved. 62 ■The Rectangle control has its HorizontalAlignment and VerticalAlignment attributes set to Stretch, so the Rectangle fills the entire Grid cell. –The Rectangle ’ s Fill attribute specifies its fill color and its Opacity attribute specifies that the Rectangle should be semitransparent. ■The Border element encloses all the other elements in the custom control. –The BorderBrush attribute specifies the color of the Border, and the BorderThickness attribute controls the thickness of the Border. ■A Binding markup extension is used to specify the WeatherData property that is bound to the control. Adding a UserControl to the Application (Cont.)

 2009 Pearson Education, Inc. All rights reserved. 63 ■Right click in the XAML for the WeatherDetailsView and select View Code. ■In the Class Name ComboBox, select closeButton, then select Click for the Method Name (Fig ). Adding a UserControl to the Application (Cont.) Figure | Click event handler for the Close Button. Hides the custom control when the user clicks the Close Button

 2009 Pearson Education, Inc. All rights reserved. 64 Displaying the Complete Weather Details for the Selected Day ■The XML namespace called Weather (Fig ) represents the WeatherViewer namespace in the project. ■Save your project so that it becomes aware of the new namespace. Figure | Adding a custom control’s namespace to the application’s Page.xaml file. XML namespace that enables you to use the new WeatherDetailsView in the GUI

 2009 Pearson Education, Inc. All rights reserved. 65 Displaying the Complete Weather Details for the Selected Day (Cont.) ■The Visibility attribute (Fig ) is set to Collapsed —it is not currently displayed. ■The Grid.RowSpan attribute is set to 2 —when this control is displayed, it will occupy both rows of the Grid. Figure | Adding a WeatherDetailsView custom control to the GUI. WeatherDetailsView is initially hidden and will span both rows of the main Grid when it is displayed

 2009 Pearson Education, Inc. All rights reserved. 66 ■In Page.xaml.vb, select forecastListBox from the Class Name ComboBox, then select SelectionChanged for the Method Name (Fig ). Displaying the Complete Weather Details for the Selected Day (Cont.) Figure | forecastListBox ’s SelectionChanged event handler. Specifies that the currently selected ListBox item will supply the data for the WeatherDetailsView Shows the WeatherDetailsView

 2009 Pearson Education, Inc. All rights reserved. 67 ■Select inputTextBox from the Class Name ComboBox, then select TextChanged for the Method Name (Fig ). ■When a ListBox ’s ItemsSource property is set to Nothing, no items will display. Displaying the Complete Weather Details for the Selected Day (Cont.) Figure | TextChanged event handler for the inputTextBox. Clears the ListBox when the user changes the text in the TextBox

 2009 Pearson Education, Inc. All rights reserved. 68 ■Run the application. ■Enter a zip code and press the Get Weather Button. ■Once the weather forecast displays, click a day in the forecast (Fig ). Displaying the Complete Weather Details for the Selected Day (Cont.) Figure | Displaying the WeatherDetailsView for a specific day. WeatherDetailsView displayed after the user selected a specific day from the ListBox

 2009 Pearson Education, Inc. All rights reserved. 69 ■Figures 32.45–32.48 present the source code for the application. Outline (1 of 4 ) XML namespace for custom WeatherDetailsView control Defining rows in the main Grid

 2009 Pearson Education, Inc. All rights reserved. 70 Outline (2 of 4 ) Defining rows in the nested Grid Defining a Border containing a TextBlock

 2009 Pearson Education, Inc. All rights reserved. 71 Outline (3 of 4 ) Defining a TextBox for user input Defining a Button to invoke the web service Defining a ListBox with a custom look-and-feel to display the weather forecast

 2009 Pearson Education, Inc. All rights reserved. 72 Outline (4 of 4 ) Defining a WeatherDetailsView to display the complete details view for a selected day

 2009 Pearson Education, Inc. All rights reserved. 73 Outline System.Net (1 of 6 ) Importing namespaces for class WebClient and for LINQ to XML Importing the XML namespace used in the XML returned by the web service Creating a WebClient to invoke the web service

 2009 Pearson Education, Inc. All rights reserved. 74 Outline Defining the URL for invoking the web service Invoking the web service asynchronously via the WebClient object System.Net (2 of 6 )

 2009 Pearson Education, Inc. All rights reserved. 75 Outline Indicates that this event handler responds to the WebClient’s DownloadStringCompleted event Uses class XDocument to parse the results of the web service for processing with LINQ to XML System.Net (3 of 6 )

 2009 Pearson Education, Inc. All rights reserved. 76 Outline Uses LINQ to XML and XML property syntax to select all of the non-empty WeatherData elements from the XML and convert them to WeatherData objects System.Net (4 of 6 )

 2009 Pearson Education, Inc. All rights reserved. 77 Outline Specifying that the ListBox should be populated from the collection of WeatherData objects Specifying that the WeatherDetailsView should obtain its data from the selected item in the ListBox Showing the WeatherDetailsView System.Net (5 of 6 )

 2009 Pearson Education, Inc. All rights reserved. 78 Outline Clearing the ListBox when the user begins typing a new zip code System.Net (6 of 6 )

 2009 Pearson Education, Inc. All rights reserved. 79 Outline (1 of 2 ) Creating a Rectangle to hide the other controls on the GUI when a WeatherDetailsView is displayed Using data binding to display WeatherData properties in the WeatherDetailsView

 2009 Pearson Education, Inc. All rights reserved. 80 Outline (2 of 2 )

 2009 Pearson Education, Inc. All rights reserved. 81 Outline Hiding the WeatherDetailsView when its Close Button is pressed