{"id":623,"date":"2011-03-14T23:37:00","date_gmt":"2011-03-14T23:37:00","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/vbteam\/2011\/03\/14\/visual-basic-windows-phone-7-series-10-how-to-create-a-panorama-and-pivot-effect-for-windows-phone-7\/"},"modified":"2024-07-05T12:40:12","modified_gmt":"2024-07-05T19:40:12","slug":"visual-basic-windows-phone-7-series-10-how-to-create-a-panorama-and-pivot-effect-for-windows-phone-7","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/vbteam\/visual-basic-windows-phone-7-series-10-how-to-create-a-panorama-and-pivot-effect-for-windows-phone-7\/","title":{"rendered":"Visual Basic Windows Phone 7 Series #10. How to create a panorama and pivot effect for Windows Phone 7"},"content":{"rendered":"<p><a href=\"http:\/\/blogs.msdn.com\/b\/vbteam\/archive\/2011\/03\/11\/visual-basic-windows-phone-7-series-how-to-create-a-keyboard-input-scope-application-for-windows-phone-7.aspx\"><span style=\"font-size: small\">Previously<\/span><\/a><span style=\"font-size: small\">, I explained how to create a keyboard input scope application for Windows Phone 7. In this blog post, I want to share a sample that will help you to create a panorama and pivot effect in Windows Phone 7. A <b>Panorama<\/b> is any wide-angle view or representation of a physical space, whether in painting, drawing, photography, or a three-dimensional model. This feature allows you to view controls, data, and services by using a long horizontal canvas that extends beyond the confines of the screen. A <b>Pivot<\/b> is a page orientation in which a rectangular page is oriented for normal viewing. It helps you to easily manage views or pages. In this application, I will demonstrate how to create both panoramic and pivot experience for Windows Phone 7. Sounds interesting? So let&rsquo;s begin. <\/span><\/p>\n<p><i><span style=\"font-size: small\">But hey, wait a minute! Before you create the panorama and pivot effect application, you need to install the following applications:<\/span><\/i><\/p>\n<ul>\n<\/ul>\n<ul>\n<\/ul>\n<ul>\n<\/ul>\n<ul>\n<li><span style=\"font-size: small\"><i>Visual Studio 2010 Professional, Premium,\nor Ultimate. If you do not have any of the releases, you can download any of\nthe following trial versions as per your preference: <\/i><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=26bae65f-b0df-4081-ae6e-1d828993d4d0&amp;displaylang=en\"><i>Professional<\/i><\/a><i>, <\/i><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=7038e207-329c-4006-b620-16d1af1c42c1&amp;displaylang=en\"><i>Premium<\/i><\/a><i>, or <\/i><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=e2a1a098-995e-4468-816d-7fdbe0a64f38&amp;displaylang=en\"><i>Ultimate<\/i><\/a><i>.<\/i><\/span><\/li>\n<li><span style=\"font-size: small\"><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=04704acf-a63a-4f97-952c-8b51b34b00ce&amp;displaylang=en\"><i>Windows Phone Developer Tools\nRTW<\/i><\/a><\/span><\/li>\n<li><span style=\"font-size: small\"><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=4e97ea70-e479-4c05-814f-639d71690e5d&amp;displaylang=en\"><i>Visual Basic\nfor Windows Phone Developer Tools &#8211; RTW<\/i><\/a><em><br \/><\/em><\/span><span style=\"font-size: small\"><em>Note: You can install the newer version- <\/em><em><a href=\"http:\/\/www.microsoft.com\/downloads\/en\/details.aspx?FamilyID=77586864-ab15-40e1-bc38-713a95a56a05&amp;displaylang=en\">Windows Phone Developer Tools 7.1 Beta<\/a>\n instead of the above mentioned two tools as it will take comparatively\nless time. However, this sample was created using the previous version.<\/em><\/span><\/li>\n<\/ul>\n<ul>\n<\/ul>\n<ul>\n<\/ul>\n<p><span style=\"font-size: small\">The panorama and pivot effect can be created in 7 easy steps as follows:<\/span><\/p>\n<ol>\n<li><span style=\"font-size: small\">Create a sample application and add controls and event handlers<\/span><\/li>\n<li><span style=\"font-size: small\">Create a pivot page <\/span><\/li>\n<li><span style=\"font-size: small\">Add controls to the pivot page<\/span><\/li>\n<li><span style=\"font-size: small\">Create a panorama page and set the background image<\/span><\/li>\n<li><span style=\"font-size: small\">Add controls to the panorama page<\/span><\/li>\n<li><span style=\"font-size: small\">Build and debug the application<\/span><\/li>\n<li><span style=\"font-size: small\">Rebuild in the release mode before publishing<\/span><\/li>\n<\/ol>\n<h3>Step 1 &#8211; Create a sample application and add controls and event handlers<\/h3>\n<h4>Create a sample application<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Create a new project and browse to the &ldquo;Silverlight for Windows Phone&rdquo; node. <\/span><\/li>\n<li><span style=\"font-size: small\">Select the &ldquo;Windows Phone Application&rdquo; template. <\/span><\/li>\n<li><span style=\"font-size: small\">Enter a name for the application.<br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/0624.Sel_App.bmp\" border=\"0\" \/><\/span><\/li>\n<li><span style=\"font-size: small\">Click OK. The MainPage.xaml page is displayed.<br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/2287.Init_App1.gif\" border=\"0\" \/><\/span><\/li>\n<li><span style=\"font-size: small\">In Solution Explorer, right-click the application name, and then add a new item. The Add New Item dialog box is displayed.<\/span><\/li>\n<li><span style=\"font-size: small\">Select the &ldquo;Silverlight for Windows Phone&rdquo; node, and then select the &ldquo;Windows Phone Panorama Page&rdquo; template.<br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/7343.Add_XAML-1.gif\" border=\"0\" \/><\/span><\/li>\n<li><span style=\"font-size: small\">Enter the name as &ldquo;PanoramaPage1.xaml&rdquo;, and then click Add. The PanoramaPage1.xaml page is displayed.<\/span><\/li>\n<li><span style=\"font-size: small\">In Solution Explorer, right-click the application name, and then add a new item. The Add New Item dialog box is displayed.<\/span><\/li>\n<li><span style=\"font-size: small\">Select the &ldquo;Silverlight for Windows Phone&rdquo; node, and then select the &ldquo;Windows Phone Pivot Page&rdquo; template.<\/span><\/li>\n<li><span style=\"font-size: small\">Enter the name as &ldquo;PivotPage1.xaml&rdquo;, and then click Add. The PivotPage1.xaml page is displayed.<\/span><\/li>\n<\/ol>\n<h4>Add controls<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Open the MainPage.xaml page. <\/span><\/li>\n<li><span style=\"font-size: small\">Click the MY APPLICATION text. In the Properties window, change the text property to &ldquo;PANORAMA AND PIVOT CONTROLS&rdquo;.<\/span><\/li>\n<li><span style=\"font-size: small\">Click the page name text. In the Properties window, change the Text property to &ldquo;select&rdquo;.<\/span><\/li>\n<li><span style=\"font-size: small\">From the toolbox, drag and drop the Button control to the design surface.<\/span><\/li>\n<li><span style=\"font-size: small\">Click the Button control. In the Properties window, change the Text property to &ldquo;Panorama Experience&rdquo;.<\/span><\/li>\n<li><span style=\"font-size: small\">From the toolbox, drag and drop another Button control to the design surface.<\/span><\/li>\n<li><span style=\"font-size: small\">Click the Button control. In the Properties window, change the Text property to &ldquo;Pivot Experience&rdquo;.<\/span><\/li>\n<li><span style=\"font-size: small\">Add the following code, to set the height, width, and the alignment of both the controls:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 94px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Button<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Content<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Panorama Experience&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Height<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;168&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">HorizontalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Left&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Margin<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;35,82,0,0&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Name<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;btnPanorama&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">VerticalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Top&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Width<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;383&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Click<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;btnPanorama_Click&#8221; \/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Button<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Content<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Pivot Experience&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Height<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;168&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">HorizontalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Left&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Margin<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;35,297,0,0&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Name<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;btnPivot&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">VerticalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Top&#8221;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Width<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;383&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Click<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;btnPivot_Click&#8221; \/&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h4>Add event handlers<\/h4>\n<p><span style=\"font-size: small\">It is essential to add an event handler to the application because it helps to navigate to the panorama or the pivot screen depending on the button clicked. <\/span><\/p>\n<p><span style=\"font-size: small\">To add an event handler, do the following:<\/span><\/p>\n<ol>\n<li><span style=\"font-size: small\">Double-click the Panorama Experience button. The MainPage.xaml.vb is displayed.<\/span><\/li>\n<li><span style=\"font-size: small\">Replace the button1_Click event handler with the following code.This method will navigate the user to the screen to view the panorama effect.\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 97px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">PrivateSub<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\">btnPanorama_Click(<span style=\"color: blue\">ByVal<\/span> sender <span style=\"color: blue\">As<\/span>System.<span style=\"color: #2b91af\">Object<\/span>,<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">ByVal<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"> e <span style=\"color: blue\">As<\/span>System.Windows.<span style=\"color: #2b91af\">RoutedEventArgs<\/span>)<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">NavigationService.Navigate(<span style=\"color: blue\">New<\/span><span style=\"color: #2b91af\">Uri<\/span>(<span style=\"color: #a31515\">&#8220;\/PanoramaPage1.xaml&#8221;<\/span>, <span style=\"color: #2b91af\">UriKind<\/span>.Relative))<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">EndSub<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To define the event handler for the Pivot effect, add the following code. This method will navigate the user to the screen to view the pivot effect.\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 93px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">PrivateSub<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\">btnPivot_Click(<span style=\"color: blue\">ByVal<\/span> sender <span style=\"color: blue\">As<\/span>System.<span style=\"color: #2b91af\">Object<\/span>,<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">ByVal<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"> e <span style=\"color: blue\">As<\/span>System.Windows.<span style=\"color: #2b91af\">RoutedEventArgs<\/span>)<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">NavigationService.Navigate(<span style=\"color: blue\">New<\/span><span style=\"color: #2b91af\">Uri<\/span>(<span style=\"color: #a31515\">&#8220;\/PivotPage1.xaml&#8221;<\/span>, <span style=\"color: #2b91af\">UriKind<\/span>.Relative))<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">EndSub<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h3>Step 2 &#8211; Create a pivot page <\/h3>\n<ol>\n<li><span style=\"font-size: small\">Open the PivotPage1.xaml page, and add the following XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Pivot Control&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Pivot<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Title<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;PIVOT CONTROL&#8221;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Pivot item one&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item1&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;<\/span><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Pivot item two&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item2&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\"><span>&nbsp;<\/span>&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Pivot item three&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item3&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;<\/span><span>&nbsp;<\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span>&nbsp;<\/span><span>&nbsp;<\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Pivot<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To add the third PivotItem, add the following XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 83px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Pivot item three&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item3&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PivotItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h3>Step 3 &#8211; Add controls to the pivot page<\/h3>\n<h4>Add controls to the first pivot item<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Add a TextBlock control containing wrapping text.<\/span><\/li>\n<li><span style=\"font-size: small\">To create first pivot item, add the following XAML code after the &lt;controls:PivotItem Header=&#8221;item1&#8243;&gt; tag.\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Added textbox control with formatted text&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>TextWrapping<\/span><span style=\"color: blue\">=&#8221;Wrap&#8221;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>Style<\/span><span style=\"color: blue\">=&#8221;{<\/span><span style=\"color: #a31515\">StaticResource<\/span><span style=\"color: red\"> PhoneTextLargeStyle<\/span><span style=\"color: blue\">}&#8221;&gt;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Run<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">This is a simple sample for the pivot control adding text.<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Run<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">LineBreak<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">LineBreak<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Run<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">You can put any content you want here&#8230;<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Run<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h4>Add controls to the second pivot item<\/h4>\n<p><span style=\"font-size: small\">To create second pivot item, add the following XAML code after the &lt;controls:PivotItem Header=&#8221;item2&#8243;&gt; tag.<\/span> <\/p>\n<p><span style=\"font-size: small\"><\/p>\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Added background image and text content&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Border<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>BorderBrush<\/span><span style=\"color: blue\">=&#8221;{<\/span><span style=\"color: #a31515\">StaticResource<\/span><span style=\"color: red\"> PhoneForegroundBrush<\/span><span style=\"color: blue\">}&#8221;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>BorderThickness<\/span><span style=\"color: blue\">=&#8221;{<\/span><span style=\"color: #a31515\">StaticResource<\/span><span style=\"color: red\"> PhoneBorderThickness<\/span><span style=\"color: blue\">}&#8221;&gt;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Image<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>Source<\/span><span style=\"color: blue\">=&#8221;samplePhoto.jpg&#8221;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>Stretch<\/span><span style=\"color: blue\">=&#8221;UniformToFill&#8221;\/&gt;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;<\/span><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>Text<\/span><span style=\"color: blue\">=&#8221;Here is some generic content to take up space.&#8221;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>TextWrapping<\/span><span style=\"color: blue\">=&#8221;Wrap&#8221;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span style=\"color: red\"><span>&nbsp;<\/span>Style<\/span><span style=\"color: blue\">=&#8221;{<\/span><span style=\"color: #a31515\">StaticResource<\/span><span style=\"color: red\"> PhoneTextExtraLargeStyle<\/span><span style=\"color: blue\">}&#8221; \/&gt;<\/span><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Border<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-size: small\"><i>Note: This method adds an assortment of content including a background image and wrapping text. <\/i><i>&nbsp;<\/i><\/span><\/p>\n<h4>Add controls to the third pivot item<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Add the following namespace declaration in the XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 26px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">xmlns<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;clr-namespace:System;assembly=mscorlib&#8221;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To create first pivot item, add the following XAML code after the &lt;controls:PivotItem Header=&#8221;item3&#8243;&gt; tag. \n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;This code is a series of string text values&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">ListBox<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> FontSize<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> PhoneFontSizeLarge<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">This<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">item<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">has<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">a<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span><span>&nbsp;<\/span><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">short<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">list<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">of<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp; <\/span><span>&nbsp;<\/span><span>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">strings<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">that<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">you<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">can<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">scroll<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">up<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">and<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">down<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">and<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">back<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">again.<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span><\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">ListBox<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><i>Note: This method adds a series of sting text values inside a ListBox control. This allows the user to have the ability to navigate the hosted control. A user will also be able to pan the list contents vertically up or down.<\/i><i>&nbsp;<\/i><\/span><\/li>\n<\/ol>\n<h3>Step 4 &#8211; Create a panorama page and set the background image<\/h3>\n<h4>Create a panorama page<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Open the PanoramaPage1.xaml page, and add the following XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> x<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">Name<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;LayoutRoot&#8221;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Panorama<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Title<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;my pano&#8221;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Panorama item one&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item1&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Panorama item two&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item2&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';font-size: 8.5pt\">&nbsp;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Panorama<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To add an additional PanoramaItem control, add the following code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 89px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Panorama item three&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item3&#8243;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h4>Setting the background image<\/h4>\n<p>&nbsp;<\/p>\n<p><span style=\"font-size: small\">To set the background image, add the following XAML after the &lt;controls:Panorama Title=&#8221;my application&#8221;&gt; tag:<\/span> <\/p>\n<p>&nbsp;<\/p>\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 89px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;Assigns a background image to the Panorama control&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Panorama.Background<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">ImageBrush<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">ImageSource<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;samplePhoto.jpg&#8221;\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Panorama.Background<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p>&nbsp;<\/p>\n<p><span style=\"font-size: small\"><i>Note: This method sets the background image to the default &ldquo;samplePhoto.jpg&rdquo; image. You can set any other image as the background as well. The recommended dimensions for a background image is a height of 800 pixels and a width less than 2000 pixels. At a width of 2000 pixels, the picture will be clipped. If your image does not have a height of 800 pixels, it will be stretched to that height without preserving the aspect ratio.<\/i><\/span><\/p>\n<p>&nbsp;<\/p>\n<h3>Step 5 &#8211; Add controls to the Panorama page<\/h3>\n<h4>Add controls to the first panorama item<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Add twoTextBlock controls containing wrapping text. Place both the controls inside theStackPanel control. <\/span><\/li>\n<li><span style=\"font-size: small\">To create the first PanoramaItem, add the following XAML after the &lt;controls:PanoramaItem Header=&#8221;item1&#8243;&gt; tag.\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211;This code creates two TextBlock controls and places them in a StackPanel control&#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StackPanel<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"><span>&nbsp;<\/span>Text<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;This is a text added to the first panorama item control&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"><span>&nbsp;<\/span>Style<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">PhoneTextLargeStyle<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">TextWrapping<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Wrap&#8221;\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Text<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221; &#8220;\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"><span>&nbsp;<\/span>Text<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;You can put any content you want here&#8230;&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"><span>&nbsp;<\/span>Style<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">PhoneTextLargeStyle<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">TextWrapping<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Wrap&#8221;\/&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StackPanel<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<\/ol>\n<h4>Add controls to the second panorama item<\/h4>\n<ol>\n<li><span style=\"font-size: small\">To set the Orientationproperty to &ldquo;Horizontal&rdquo;, add the following XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 26px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">controls<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">PanoramaItem<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Header<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;item2&#8243;<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"> Orientation<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Horizontal&#8221;&gt;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To create the secondPanoramaItem, add the following XAML code after the &lt;controls:PanoramaItem Header=&#8221;item2&#8243; Oreintation=&rdquo;Horizontal&rdquo;&gt; tag. \n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: green;font-size: 8.5pt\">&lt;!&#8211; Assigns a border to the PanoramaItem control and background for the content section. &#8211;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Border<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">BorderBrush<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">PhoneForegroundBrush<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">BorderThickness<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">PhoneBorderThickness<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\"><span>&nbsp;<\/span>Background<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;#80808080&#8243;&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">Text<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;This content is very wide and can be panned horizontally.&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">Style<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">PhoneTextExtraLargeStyle<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">}&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">HorizontalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Center&#8221;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">VerticalAlignment<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;Center&#8221; &gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">TextBlock<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Border<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: 'Courier New';font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: 'Courier New';color: #a31515;font-size: 8.5pt\">Grid<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><i>Note: This method changes the orientation of the control to horizontal. Also, this will affect the content to extend off the screen and the user will have to pan horizontally to expose the rest of the content.<\/i><\/span><\/li>\n<\/ol>\n<h4>Add controls to the third panorama item<\/h4>\n<ol>\n<li><span style=\"font-size: small\">Add the following namespace declaration in the XAML code:\n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 28px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">xmlns<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: 'Courier New';color: red;font-size: 8.5pt\">sys<\/span><span style=\"font-family: 'Courier New';color: blue;font-size: 8.5pt\">=&#8221;clr-namespace:System;assembly=mscorlib&#8221;<\/span><\/p>\n<\/div>\n<p><\/span><\/li>\n<li><span style=\"font-size: small\">To create the thirdPanoramaItem, add the following XAML code after the, &lt;controls:PanoramaItem Header=&#8221;item3&#8243;&gt; tag. \n<div id=\"codeSnippetWrapper\" style=\"text-align: left;line-height: 12pt;background-color: #f4f4f4;margin: 20px 0px 10px;width: 94.8%;font-family: 'Courier New',courier,monospace;direction: ltr;height: 110px;max-height: 200px;font-size: 8pt;overflow: auto;cursor: text;border: silver 1px solid;padding: 4px\">\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">ListBox<\/span><span style=\"font-family: Consolas;color: red;font-size: 8.5pt\">FontSize<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">=&#8221;{<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">StaticResource<\/span><span style=\"font-family: Consolas;color: red;font-size: 8.5pt\">PhoneFontSizeLarge<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">}&#8221;&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">This<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">item<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">has<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">a<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">short<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">list<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">of<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">strings<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">that<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">you<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">can<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">scroll<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">up<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">and<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">down<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">and<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">back<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\"><span>&nbsp;&nbsp;&nbsp; <\/span>&lt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">again.<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">sys<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">:<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">String<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><span style=\"font-family: Consolas;font-size: 8.5pt\"><\/span><\/p>\n<p class=\"MsoNormal\"><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&lt;\/<\/span><span style=\"font-family: Consolas;color: #a31515;font-size: 8.5pt\">ListBox<\/span><span style=\"font-family: Consolas;color: blue;font-size: 8.5pt\">&gt;<\/span><\/p>\n<\/div>\n<p><i>Note: This method adds a series of sting text values inside a ListBox control. This allows the user to have the ability to navigate the hosted control. A user will also be able to pan the list contents vertically up or down.<\/i><i>&nbsp;<\/i><\/span><\/li>\n<\/ol>\n<p><span style=\"font-size: small\">There you are! Now your panorama and pivot effect application for Windows Phone 7 is ready! You just need to build and debug the application.<\/span><\/p>\n<h3>Step 6 &#8211; Build and debug the application<\/h3>\n<p>&nbsp;<\/p>\n<ol>\n<li><span style=\"font-size: small\">To build the application, select Debug &gt; Build Solution. The project should build without any errors. If there are errors, check the earlier steps, correct the errors, and then build the application again.<\/span><\/li>\n<li><span style=\"font-size: small\">To debug the application, set the deployment target of the application to &ldquo;Windows Phone 7 Emulator&rdquo;. <\/span><\/li>\n<li><span style=\"font-size: small\">Select Debug &gt; Start Debugging. The emulator window is displayed. <br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/6012.Emulator.bmp\" width=\"277\" border=\"0\" height=\"523\" \/><\/span><\/li>\n<li><span style=\"font-size: small\">To test the panorama settings, click &ldquo;Panorama Experience&rdquo; and presto! The Panorama settings screen is displayed.<br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/8345.Panorama.bmp\" width=\"277\" border=\"0\" height=\"539\" \/><\/span><\/li>\n<li><span style=\"font-size: small\">Do you want to test the pivot settings? No problem, click the back arrow and then click &ldquo;Pivot Experience&rdquo;. The Pivot settings screen is displayed.<br \/><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/vbteam\/wp-content\/uploads\/sites\/7\/2011\/03\/3438.Pivot_.gif\" width=\"279\" border=\"0\" height=\"518\" \/><\/span><\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p><i><span style=\"font-size: small\">Note: To stop debugging the application, select Debug &gt; Stop Debugging.<\/span><\/i><\/p>\n<h3>Step 7 -Rebuild in the release mode for publishing<\/h3>\n<ol>\n<li><span style=\"font-size: small\">On the standard toolbar, change the configuration manager to Release.<\/span><\/li>\n<li><span style=\"font-size: small\">To rebuild the application, select Build &gt; Rebuild. The XAP file of the application is generated, which is the package that you will have to submit in the marketplace to publish the application. You can also locate this XAP file in the BinRelease folder.<\/span><\/li>\n<\/ol>\n<p><span style=\"font-size: small\">Finally, to submit your application to the market place, you can refer to <\/span><a href=\"http:\/\/create.msdn.com\/en-US\/home\/about\/app_submission_walkthrough_upload\"><span style=\"font-size: small\">upload your application walkthrough<\/span><\/a><span style=\"font-size: small\">.<\/span><\/p>\n<h3>Summary<\/h3>\n<p><span style=\"font-size: small\">Voila! Wasn&rsquo;t that fun? You have successfully created a panorama and a pivot effect application for Windows Phone 7, that too in just 7 steps! It&rsquo;s very easy, right? I am sure you must have enjoyed a lot creating this application.<\/span><\/p>\n<p><span style=\"font-size: small\">You can find the full source code for the <\/span><span style=\"font-size: small\">panorama and a pivot effec<\/span><span style=\"font-size: small\"> application <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/ff431744(v=VS.92).aspx\"><span style=\"font-size: small\">here<\/span><\/a><span style=\"font-size: small\">. This application uses general Silverlight and Visual Basic features that are applicable for different application types including Windows Phone application. <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Previously, I explained how to create a keyboard input scope application for Windows Phone 7. In this blog post, I want to share a sample that will help you to create a panorama and pivot effect in Windows Phone 7. A Panorama is any wide-angle view or representation of a physical space, whether in painting, [&hellip;]<\/p>\n","protected":false},"author":260,"featured_media":8818,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[195],"tags":[137,167,180],"class_list":["post-623","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-visual-basic","tag-silverlight","tag-vb2010","tag-windows-phone"],"acf":[],"blog_post_summary":"<p>Previously, I explained how to create a keyboard input scope application for Windows Phone 7. In this blog post, I want to share a sample that will help you to create a panorama and pivot effect in Windows Phone 7. A Panorama is any wide-angle view or representation of a physical space, whether in painting, [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/posts\/623","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/users\/260"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/comments?post=623"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/posts\/623\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/media\/8818"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/media?parent=623"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/categories?post=623"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/vbteam\/wp-json\/wp\/v2\/tags?post=623"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}