I am not able to display HTML content in Browser Field. My HTML:
namespace webviewTest
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}
private const string htmlFragment =
"<html><body><h2>This is an HTML fragment</h2></body></html>";
WebView.NavigateToString(htmlFragment);
}
}
Xaml code:
<phone:PhoneApplicationPage
x:Class="webviewTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--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="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" 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="WebView"></phone:WebBrowser>
</Grid>
</Grid>
I know I am doing some nonsense here. Please tell me how I can achieve this.
It works for me, could it be the way you've structured your code?
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}
private const string htmlFragment =
"<html><body><h2>This is an HTML fragment</h2></body></html>";
protected override void OnNavigatedTo(NavigationEventArgs e)
{
WebView.NavigateToString(htmlFragment);
}
}
Xaml
<phone:PhoneApplicationPage
x:Class="webviewTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<Grid x:Name="ContentPanel" Margin="12,0,12,0">
<phone:WebBrowser x:Name="WebView" />
</Grid>
</phone:PhoneApplicationPage>
Related
I would use a portion of PhoneAplicationFrame for to display a set of controls on every page of my application.
One of these controls would be an Image control, which would display images obtained at runtime.
But the image never display its content.
By adding the same control in a grid of PhonePage it is displayed.
How can I do that?
APP.XAML:
<Application
x:Class="PhoneApp1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone">
<Application.Resources>
<local:LocalizedStrings xmlns:local="clr-namespace:PhoneApp1" x:Key="LocalizedStrings"/>
<ControlTemplate x:Name="TheControlTemplate">
<Grid>
<ContentPresenter/>
<Grid x:Name="TheGridAbove"/>
</Grid>
</ControlTemplate>
</Application.Resources>
<Application.ApplicationLifetimeObjects>
<shell:PhoneApplicationService
Launching="Application_Launching" Closing="Application_Closing"
Activated="Application_Activated" Deactivated="Application_Deactivated"/>
</Application.ApplicationLifetimeObjects>
</Application>
APP.XAML.CS CONTRUCTOR
static public Grid TheGridAbove = null;
public App()
{
UnhandledException += Application_UnhandledException;
InitializeComponent();
InitializePhoneApplication();
InitializeLanguage();
if (Debugger.IsAttached){
Application.Current.Host.Settings.EnableFrameRateCounter = true;
PhoneApplicationService.Current.UserIdleDetectionMode = IdleDetectionMode.Disabled;}
RootFrame.Template = Resources["TheControlTemplate"] as ControlTemplate;
RootFrame.ApplyTemplate();
TheGridAbove = (VisualTreeHelper.GetChild(RootFrame, 0) as FrameworkElement).FindName("TheGridAbove") as Grid;
}
MainPage.xaml
<phone:PhoneApplicationPage
x:Class="PhoneApp1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="163,172,0,0" VerticalAlignment="Top" Click="button_Click"/>
</Grid>
</phone:PhoneApplicationPage>
MAINPAGE.XAML.CS button_Click
private void button_Click(object sender, RoutedEventArgs e)
{
Grid grid = new Grid();
grid.Background = new SolidColorBrush(Colors.Red);
Image img = new Image();
img.Source = new BitmapImage(new Uri("/Common/Lenna.jpg", UriKind.Relative));
grid.Children.Add(img);
PhoneApp1.App.TheGridAbove.Children.Add(grid); // DON'T DISPLAY
//LayoutRoot.Children.Add(grid); // THIS DISPLAY
}
CODE CAN BE DOWNLOADED HERE: http://www.filedropper.com/code
I have parsed RSS feed http://www.teluguone.com/videosongs/videoSongsXml.php?cat_id=6.
And displayed songpics in Horizontal List view. As shown below
When I click on a particular song it was playing in the space above.
But,here I want to get default video along with Horizontal list view.And when I click on a particular video it should be played.
How to get the default video along with List view.
XAML code:
<phone:PhoneApplicationPage
x:Class="PhoneApp1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:delay="clr-namespace:Delay;assembly=PhonePerformance"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--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="Teluguone" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Songs" 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">
<MediaElement x:Name="player" AutoPlay="True" Margin="0,0,0,282"/>
<ScrollViewer HorizontalScrollBarVisibility="Hidden" Height="Auto" Margin="-60,411,-93,10" >
<ListBox x:Name="videosongList" ScrollViewer.HorizontalScrollBarVisibility="Auto"
ScrollViewer.VerticalScrollBarVisibility="Disabled" Height="200" Width="1000" SelectionChanged="videosongList_SelectionChanged" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,50,0,0" Orientation="Horizontal">
<Image x:Name="img1" Source="{Binding songpic}" ></Image>
<TextBlock Text="{Binding songname}" TextWrapping="NoWrap" VerticalAlignment="Bottom"
FontSize="20" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemsPanel >
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"></StackPanel>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</ScrollViewer>
</Grid>
</Grid>
Code for XAML.cs:
namespace PhoneApp1
{
public partial class MainPage : PhoneApplicationPage
{
public MainPage()
{
InitializeComponent();
}
private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
// is there network connection available
if (!System.Net.NetworkInformation.NetworkInterface.GetIsNetworkAvailable())
{
MessageBox.Show("No network connection available!");
return;
}
// start loading XML-data
WebClient downloader = new WebClient();
Uri uri = new Uri("http://www.teluguone.com/videosongs/videoSongsXml.php?cat_id=6", UriKind.Absolute);
downloader.DownloadStringCompleted += new DownloadStringCompletedEventHandler(VideosongsDownloaded);
downloader.DownloadStringAsync(uri);
}
void VideosongsDownloaded(object sender, DownloadStringCompletedEventArgs e)
{
if (e.Result == null || e.Error != null)
{
MessageBox.Show("There was an error downloading the XML-file!");
}
else
{
// Deserialize if download succeeds
XDocument document = XDocument.Parse(e.Result);
XmlSerializer serializer = new XmlSerializer(typeof(videosongs));
videosongs videosongs = (videosongs)serializer.Deserialize(document.CreateReader());
videosongList.ItemsSource = videosongs.Collection;
}
}
private async void videosongList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
Songsdetails song = (Songsdetails)videosongList.SelectedItem;
var url = await YouTube.GetVideoUriAsync(song.songcode, YouTubeQuality.Quality480P);
player.Source = url.Uri;
}
}
}
Anybody please give me any suggestion of getting default video playing along with horizontal list view.
Many Thanks.
Did you try playing Youtube videos using the Youtube class from Codeplex.
Youtube Class
or else you could refer the sample from msdn:
Youtube Video sample
I have problem with AppBarUtils, Eariler I have command in my appBar and when it run. However something broke. My Main.xaml
<phone:PhoneApplicationPage
x:Class="OsiągnijCelPhoneApp.Views.Main"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:appBarUtils="clr-namespace:AppBarUtils;assembly=AppBarUtils"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
DataContext="{Binding Source={StaticResource Locator}, Path=Main}"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d"
shell:SystemTray.IsVisible="True">
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="login"/>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
<!--<i:Interaction.Behaviors>
<appBarUtils:AppBarItemCommand Id="login" Command="{Binding LoginIn,Mode=TwoWay}"/>
</i:Interaction.Behaviors>-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock Text="page name" 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">
<Button Margin="25,0,0,355" Content="Zaloguj" Command="{Binding LoginIn,Mode=TwoWay}" />
</Grid>
</Grid>
</phone:PhoneApplicationPage>
I use Telerik, MVVM light, and AppBarUtils. I preinstalled AppBarUtils.
When I deploy my on phone, that I got
A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in System.Windows.ni.dll Additional information: Unknown parser error: Scanner 2148474880. [Line: 25 Position: 29]
I think that it is problem with System.Windows.Interactive, because if I comment it, rest run.I debug on arm.
You havent set the interaction triggers. See this example http://allenlooplee.wordpress.com/2011/08/26/how-to-do-command-binding-for-application-bar-with-appbarutils-in-xaml/
I have a Metro App with a ListView that contains this definition:
<ListView Grid.Row="0" x:Name="lv" CanDragItems="True" CanReorderItems="True" IsTabStop="True" SelectionMode="Extended" VirtualizingStackPanel.VirtualizationMode="Recycling">
<ListView.ItemTemplate>
<DataTemplate>
<Grid Width="{Binding ElementName=lv, Path=ActualWidth}">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="65"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" x:Name="tb1" Foreground="{StaticResource SecondaryColourBrush}" HorizontalAlignment="Stretch"/>
<TextBlock Grid.Column="4" x:Name="tb2" Foreground="{StaticResource SecondaryColourBrush}" HorizontalAlignment="Right"/>
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="65"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" x:Name="tb3" Foreground="{StaticResource QuadColourBrush}" HorizontalAlignment="Stretch" TextTrimming="WordEllipsis"/>
<TextBlock Grid.Column="1" x:Name="tb4" Foreground="{StaticResource QuadColourBrush}" HorizontalAlignment="Right"/>
</Grid>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
When the ListView has an item selected, I want to change the Foreground of tb1 and tb2 ONLY to White. How do I go about doing this?
I tried overriding Themed Brushes and VisualStateGroup SelectionStates for Selected, which hasn't helped. A working code example would be appreciated.
Finally RESOLVED this, thanks to this article for giving me the idea:
http://blog.davemdavis.net/2012/11/12/controlling-the-datatemplate/
Created a BooleanToColourConverter
public sealed class BooleanToColourConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
return (value is bool && (bool)value) ? AppResources.TertiaryColourBrush : AppResources.PrimaryColourBrush;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
return value is SolidColorBrush && ((SolidColorBrush)value).Color == AppResources.TertiaryColourBrush.Color;
}
}
Added this in App.xaml
<common:BooleanToColourConverter x:Key="BooleanToColourConverter"/>
Then used it like this:
Foreground="{Binding Tag, Converter={StaticResource BooleanToColourConverter}, Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}"
I have a TextBlock in the datatemplate of ListFooterTemplate of LongListSelector,to which I give a Collection as Itemssource,I want to bind the Text Property of TextBlock to a string in the Codebehind. Please tell me how to do it. Here is the xaml.
I am using VS2012 and WP8 SDK.
<toolkit:LongListSelector ItemsSource="{Binding Collection}">
<toolkit:LongListSelector.ListFooterTemplate>
<DataTemplate>
<TextBlock Text= "{Binding footertext}" />
</DataTemplate>
</toolkit:LongListSelector.ListFooterTemplate>
</toolkit:LongListSelector>
footertext is the string I have defined in the codebehind. I have implemented INotifyPropertyChanged also but footer doesnt show the text.
Just guessing here, but the most likely reason you're not seeing any footer is that you're not binding to the right object. The LongListSelector is binding to properties on its DataContext. If the Collection property lives on a different object than the footertext property that would cause this problem.
Here's some sample code that works for me:
Code-behind
namespace LongListSelector
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
SomeText = "This is my footer text from the code-behind";
}
public string SomeText { get; private set; }
}
}
XAML
<phone:PhoneApplicationPage
x:Class="LongListSelector.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:LongListSelector"
mc:Ignorable="d"
x:Name="page"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<phone:PhoneApplicationPage.DataContext>
<local:SampleData/>
</phone:PhoneApplicationPage.DataContext>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
<TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<phone:LongListSelector ItemsSource="{Binding Collection}">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"/>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
<phone:LongListSelector.ListFooterTemplate>
<DataTemplate>
<TextBlock Text="{Binding SomeText,ElementName=page}"/>
</DataTemplate>
</phone:LongListSelector.ListFooterTemplate>
<phone:LongListSelector.ListHeaderTemplate>
<DataTemplate>
<TextBlock Text="{Binding DataContext.HeaderText, ElementName=page, Mode=OneWay}"/>
</DataTemplate>
</phone:LongListSelector.ListHeaderTemplate>
</phone:LongListSelector>
</Grid>
</Grid>
</phone:PhoneApplicationPage>
Sample data object
using System.Collections.ObjectModel;
namespace LongListSelector
{
public class SampleData
{
public SampleData()
{
Collection = new ObservableCollection<string>( new string[] { "Item 1", "Item 2", "Item 3" } );
HeaderText = "This is my header text";
}
public ObservableCollection<string> Collection { get; private set; }
public string HeaderText { get; private set; }
}
}
Note that the ItemsSource property on the LongListSelector binds to the DataContext (as does the header) while footer binds to a property in the code-behind class.
Hope this helps.