In this article we are going to see how to display dynamic web content in a Web browser control in Windows Phone application development. So generating a dynamic web content and applying to the web browser control is straight forward by using the NavigateToString(string) method of the web browser control. In this article we will see on how programmatically create a dynamic content and assign it to a web browser to load the content. Let us see the steps on how to achieve this task in our Windows Phone application development. Open Visual Studio 2012 IDE and create a new Windows Phone project with a valid project name as shown in the screen below. [more]
Clicking on OK will create the project and the solution with the list of default files and folders that are required to run the application. It will take some time to create these files based on your system configuration, so once everything is ready we can see the Visual Studio IDE with the project as shown in the screen below.
Let us add some control basically to trigger an event to dynamically load the web content on to a webbrowser control. We will add a button control and web browser control from the toolbox and we can see the XAML code as below.
XAML code:
[code:c#]<!–TitlePanel contains the name of the application and page title–>
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="F5debug How to Series" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="WebBrowser" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!–ContentPanel – place additional content here–>
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<phone:WebBrowser x:Name="WB1" HorizontalAlignment="Left" Margin="24,124,0,0" VerticalAlignment="Top" Width="406" Height="402"/>
</Grid>
<Button Content="Load Dynamic Page" HorizontalAlignment="Left" Margin="69,22,0,0" Grid.Row="1" VerticalAlignment="Top" Width="347" Click="Button_Click"/>
Now we need to write our code in the button click event where we need to programmatically create a dynamic content and load it to the Webbrowser control NavigateToString method as shown in the code below.
C# Code:
[Code:C#]private void Button_Click(object sender, RoutedEventArgs e)
{
string strDyanamic = "<html><head><meta name=’viewport’ content=’width=480, user-scalable=yes’ /></head><body>F5debug Content to Showcase</body></html>";
WB1.NavigateToString(strDyanamic);
}
Now we are done with the code, just run the application by pressing F5 directly from the keyboard or we can use the Build and execute the project option from the tool bar to run the application. Once the Build is successful we can see the Windows Phone emulator with the application and the expected outputs as shown in the screen below.
