Hover Focus exceeding the ListViewItem width in UWP C# - c#

I have a simple horizontal ListView where it will show trending anime. It is a horizontal ListView. But as in this image, in the One-Piece anime, the hover is present. but due to screenshot, the hover is hidden. when the hovered ListViewItem is focused, it is showing some extra sapces on both sides of the main element, How do I rectify it??
Any Ideas...
My ListView is below:
<ListView ScrollViewer.IsHorizontalRailEnabled="True"
ScrollViewer.HorizontalScrollMode="Enabled"
ScrollViewer.HorizontalScrollBarVisibility="Hidden"
ScrollViewer.VerticalScrollMode="Disabled"
ScrollViewer.IsVerticalRailEnabled="False"
SelectionMode="None"
IsSwipeEnabled="False"
IsItemClickEnabled="True"
x:Name="AnimeTrendingList"
ItemClick="AnimeTrendingList_ItemClick"
UseSystemFocusVisuals="False">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate x:DataType="data:MediaElement">
<Grid
Width="150"
Height="300"
CornerRadius="10">
<Grid.ContextFlyout>
<MenuFlyout>
<MenuFlyoutItem
x:Name="AnimeSaveImage"
Text="Save Image"
Click="AnimeSaveImage_Click"
Tag="{x:Bind CoverImage.ExtraLarge.AbsoluteUri}"/>
<MenuFlyoutItem
x:Name="AnilistUrlCopy"
Text="Copy AniList URL"
Click="AnilistUrlCopy_Click"
Tag="{x:Bind SiteUrl.ToString()}"/>
<MenuFlyoutItem
x:Name="AnilistOpenUrl"
Text="Open in Browser"
Click="AnilistOpenUrl_Click"
Tag="{x:Bind SiteUrl.ToString()}"/>
<MenuFlyoutItem
x:Name="EmbedableBannerSave"
Text="Save Embeddable Image"
Click="EmbedableBannerSave_Click"
Tag="{x:Bind Id.ToString()}"/>
</MenuFlyout>
</Grid.ContextFlyout>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid Width="150">
<Image Stretch="UniformToFill">
<Image.Source>
<BitmapImage UriSource="{x:Bind CoverImage.Large.AbsoluteUri}"/>
</Image.Source>
</Image>
<!--<Canvas ToolTipService.ToolTip="Currently Airing">
<Rectangle Canvas.Top="5"
Canvas.Left="5"
Width="25"
Height="25"
Fill="{StaticResource CustomAcrylicInAppLuminosity}"/>
<Ellipse Width="15"
Height="15"
Canvas.Left="10"
Canvas.Top="10"
Fill="LightGreen"/>
</Canvas>-->
</Grid>
<StackPanel
Width="150"
Background="{ThemeResource SystemAltLowColor}"
Grid.Row="1"
BorderThickness="1"
Canvas.ZIndex="2">
<TextBlock Text="{x:Bind Title.UserPreferred}"
TextTrimming="CharacterEllipsis"
FontSize="15"
FontWeight="Bold"
Margin="5, 15, 5, 2"
ToolTipService.ToolTip="{x:Bind Title.UserPreferred}"/>
<TextBlock Text="{x:Bind Studios.Nodes[0].Name}"
FontStyle="Italic"
FontSize="12"
Margin="5, 0, 5, 5"
Foreground="{ThemeResource SystemBaseMediumHighColor}"/>
<TextBlock Text="{x:Bind sys:String.Format(x:Null, '{0} • {1} Episodes', Format, Episodes)}"
FontSize="12"
Margin="5, 2, 5, 5"/>
<Grid Margin="5, 0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0"
Orientation="Horizontal"
Margin="5">
<FontIcon Glyph=""
FontSize="12"
Foreground="Yellow"/>
<TextBlock Text="{x:Bind Trending.ToString()}"
FontSize="12"
Margin="5, 0, 0, 0"
VerticalAlignment="Center"/>
</StackPanel>
<StackPanel Grid.Column="1"
Orientation="Horizontal"
Margin="5"
HorizontalAlignment="Left">
<FontIcon Glyph=""
FontSize="12"
Foreground="Red"/>
<TextBlock Text="{x:Bind Favourites.ToString()}"
FontSize="12"
Margin="5, 0, 0, 0"
VerticalAlignment="Center"/>
</StackPanel>
</Grid>
</StackPanel>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

Hover Focus exceeding the ListViewItem width in UWP C#
It looks the default ListViewItem background, and it will highlight when point over or point pressed. you could set them as Transparent to disable this behavior. please refer to the following code taht place in the app resource dictionary.
<Application.Resources>
<SolidColorBrush x:Key="ListViewItemBackgroundPointerOver" Color="Transparent" />
<SolidColorBrush x:Key="ListViewItemBackgroundPressed" Color="Transparent" />
</Application.Resources>

Related

WinRT - Thumbnail instead of Bing Map control

In a windows store project i have a page that creates several big squares, with this format
<DataTemplate x:Key="MyMeetingsWithMapSquares">
<Grid Width="350" Height="290" DataContext="{Binding}" >
<StackPanel >
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0,1" >
<GradientStop Color="#FF0072C6" Offset="0"/>
<GradientStop Color="#FF008FD4" Offset="1"/>
</LinearGradientBrush>
</StackPanel.Background>
<Grid DataContext="{Binding}">
<Grid.RowDefinitions>
<RowDefinition Height="90"/>
<RowDefinition Height="60"/>
<RowDefinition Height="50"/>
<RowDefinition Height="150"/>
</Grid.RowDefinitions>
<Border BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<StackPanel Grid.Row="0">
<Grid DataContext="{Binding}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="220"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal">
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareDayNumber}" Width="40" FontFamily="Segoe UI Semibold" FontSize="33" FontWeight="SemiBold" VerticalAlignment="Top"/>
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareMonthText}" Width="60" FontFamily="Segoe UI Regular" FontSize="33" FontWeight="Normal" VerticalAlignment="Top"/>
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareYearText}" Width="60" FontFamily="Segoe UI Light" FontSize="33" FontWeight="Light" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</StackPanel>
<TextBlock Grid.Row="1" Margin="0,5,0,0" Text="Business meeting" FontFamily="Segoe UI Semibold" FontSize="24" FontWeight="SemiBold" VerticalAlignment="Center"/>
</Grid>
<StackPanel Grid.Column="1" VerticalAlignment="Center">
<TextBlock Text="{Binding MyMeetingSquareDayHour}" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,10,0"/>
</StackPanel>
</Grid>
</StackPanel>
</Border>
<Border Grid.Row="1" BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<StackPanel >
<TextBlock Text="{Binding MyMeetingSquareSummary}" FontFamily="Segoe UI Light" FontSize="16" Margin="0,10,0,10" TextWrapping="Wrap"/>
</StackPanel>
</Border>
<StackPanel Grid.Row="2">
<Border BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<ScrollViewer VerticalScrollBarVisibility="Hidden" VerticalScrollMode="Disabled" HorizontalScrollBarVisibility="Hidden" HorizontalScrollMode="Enabled">
<GridView ItemContainerStyle="{StaticResource GridViewItemStyle2}" ItemsSource="{Binding MyMeetingsSquareUsers}" ItemTemplateSelector="{StaticResource meetingSelector}" Grid.Row="1" Margin="0,10,0,0" SelectionMode="None" HorizontalContentAlignment="Left" VerticalContentAlignment="Bottom">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid Orientation="Vertical" MaximumRowsOrColumns="1"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
</ScrollViewer>
</Border>
</StackPanel>
<StackPanel Grid.Row="3" Height="150" DataContext="{Binding}" Background="Red">
<Grid Tapped="Map_DoubleTappedOverride">
<StackPanel Height="55" Width="190" Canvas.ZIndex="11" Margin="10,0,0,60" VerticalAlignment="Center" HorizontalAlignment="Center" Orientation="Vertical">
<StackPanel.Background>
<ImageBrush Stretch="Uniform" ImageSource="ms-appx:///Images/Meetings/meetingAddress.png"/>
</StackPanel.Background>
<ScrollViewer HorizontalScrollBarVisibility="Disabled" HorizontalScrollMode="Disabled" VerticalScrollBarVisibility="Hidden" Width="175" Margin="5,0,0,0" Height="50" VerticalAlignment="Center" HorizontalAlignment="Center" >
<TextBlock Text="{Binding Address}" Margin="10,0,0,0" FontFamily="Segoe UI Semilight" FontSize="14" Foreground="Black" Width="170" TextWrapping="WrapWholeWords" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</ScrollViewer>
</StackPanel>
<Maps:Map x:Name="miniMap" Tag="{Binding MyMeetingSquareLat}" Loaded="Map_Loaded" DataContext="{Binding}" ZoomLevel="15" Margin="0,10,0,0" ShowBreadcrumb="False" Height="150" ShowNavigationBar="False" ShowScaleBar="False" ShowTraffic="True" ShowBuildings="True" Width="350" Credentials="AnZKLHgAfKSwa5BAB2Kr-g8KENJBm1US3tVieyOxxxxxxxJZVXyUgRIwM" >
<Maps:Map.Children>
<Maps:Pushpin Foreground="{x:Null}">
<Maps:Pushpin.RenderTransform>
<CompositeTransform />
</Maps:Pushpin.RenderTransform>
<Maps:Pushpin.Background>
<ImageBrush Stretch="Fill" ImageSource="ms-appx:///Images/Meetings/meetingsPushpin.png"/>
</Maps:Pushpin.Background>
<Maps:MapLayer.Position>
<Maps:Location Latitude="{Binding MyMeetingSquareLat}" Longitude="{Binding MyMeetingSquareLng}" />
</Maps:MapLayer.Position>
</Maps:Pushpin>
</Maps:Map.Children>
</Maps:Map>
</Grid>
</StackPanel>
</Grid>
</StackPanel>
</Grid>
</DataTemplate>
My problem was that i was having performance issues, mainly some high memory usage. If i removed the Map part from my template the memory usage would drop to 1/4.
My question is if Bing maps has some sort of thumb preview or how can i replace my map with a image of the pushpin location on the map. Having a bunch of map controls on same page seems to affect performance.
Yes, its called the Bing Maps REST Static Imagery Service: https://msdn.microsoft.com/en-us/library/ff701724.aspx

Winrt - Binding values to Latitude and Longitude on Bing Map

I have this DataTemplate that contains a Map
<DataTemplate x:Key="MyMeetingsWithMapSquares">
<Grid Width="350" Height="290" DataContext="{Binding}" >
<StackPanel >
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0,1" >
<GradientStop Color="#FF0072C6" Offset="0"/>
<GradientStop Color="#FF008FD4" Offset="1"/>
</LinearGradientBrush>
</StackPanel.Background>
<Grid DataContext="{Binding}">
<Grid.RowDefinitions>
<RowDefinition Height="90"/>
<RowDefinition Height="60"/>
<RowDefinition Height="50"/>
<RowDefinition Height="150"/>
</Grid.RowDefinitions>
<Border BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<StackPanel Grid.Row="0">
<Grid DataContext="{Binding}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="220"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal">
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareDayNumber}" Width="40" FontFamily="Segoe UI Semibold" FontSize="33" FontWeight="SemiBold" VerticalAlignment="Top"/>
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareMonthText}" Width="60" FontFamily="Segoe UI Regular" FontSize="33" FontWeight="Normal" VerticalAlignment="Top"/>
<TextBlock Grid.Row="0" Margin="0,16,0,0" Text="{Binding MyMeetingSquareYearText}" Width="60" FontFamily="Segoe UI Light" FontSize="33" FontWeight="Light" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</StackPanel>
<TextBlock Grid.Row="1" Margin="0,5,0,0" Text="Business meeting" FontFamily="Segoe UI Semibold" FontSize="24" FontWeight="SemiBold" VerticalAlignment="Center"/>
</Grid>
<StackPanel Grid.Column="1" VerticalAlignment="Center">
<TextBlock Text="{Binding MyMeetingSquareDayHour}" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,10,0"/>
</StackPanel>
</Grid>
</StackPanel>
</Border>
<Border Grid.Row="1" BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<StackPanel >
<TextBlock Text="{Binding MyMeetingSquareSummary}" FontFamily="Segoe UI Light" FontSize="16" Margin="0,10,0,10" TextWrapping="Wrap"/>
</StackPanel>
</Border>
<StackPanel Grid.Row="2">
<Border BorderBrush="#0166a0" BorderThickness="0,0,0,1" Margin="10,0,10,0">
<ScrollViewer VerticalScrollBarVisibility="Hidden" VerticalScrollMode="Disabled" HorizontalScrollBarVisibility="Hidden" HorizontalScrollMode="Enabled">
<GridView ItemContainerStyle="{StaticResource GridViewItemStyle2}" ItemsSource="{Binding MyMeetingsSquareUsers}" ItemTemplateSelector="{StaticResource meetingSelector}" Grid.Row="1" Margin="0,10,0,0" SelectionMode="None" HorizontalContentAlignment="Left" VerticalContentAlignment="Bottom">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid Orientation="Vertical" MaximumRowsOrColumns="1"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
</ScrollViewer>
</Border>
</StackPanel>
<StackPanel Grid.Row="3" Height="150" DataContext="{Binding}">
<Maps:Map Tag="{Binding MyMeetingSquareLat}" Margin="0,10,0,0" DoubleTappedOverride="Map_DoubleTappedOverride" ShowBreadcrumb="False" Height="150" ShowNavigationBar="False" ShowScaleBar="False" ShowTraffic="False" Width="350" Credentials="AnZKLHgAfKSwa5BAB2Kr-g8KENJBm1US3txxxxxxzCDUAgxhgJZVXyUgRIwM" ViewChanged="Map_ViewChanged" >
<Maps:Map.Center>
<Maps:Location Latitude="{Binding MyMeetingSquareLat}" Longitude="{Binding MyMeetingSquareLng}"/>
</Maps:Map.Center>
</Maps:Map>
</StackPanel>
</Grid>
</StackPanel>
</Grid>
</DataTemplate>
Im trying to bind values to its latitude and longitude, but for some reason they are allways 0. i tried binding one of the values to the Map tag and it worked, the tag was 49.597378 but the latitude was 0.
how do i pass the values to the map lat and lng ?
EDIT
so i've changed some things on my code and added a pushpin
<StackPanel Grid.Row="3" Height="150" DataContext="{Binding}">
<Maps:Map Tag="{Binding MyMeetingSquareLat}" DataContext="{Binding}" ZoomLevel="5" Margin="0,10,0,0" DoubleTappedOverride="Map_DoubleTappedOverride" ShowBreadcrumb="False" Height="150" ShowNavigationBar="False" ShowScaleBar="False" ShowTraffic="False" Width="350" Credentials="AnZKLHgAfKSwa5BAB2Kr-g8KENJBmxxxxxxyOCEwbJzCDUAgxhgJZVXyUgRIwM" ViewChanged="Map_ViewChanged" >
<Maps:Map.Center>
<Maps:Location Latitude="{Binding MyMeetingSquareLat}" Longitude="{Binding MyMeetingSquareLng}"/>
</Maps:Map.Center>
<Maps:Map.Children>
<Maps:Pushpin >
<Maps:Pushpin.Background>
<ImageBrush Stretch="Fill" ImageSource="ms-appx:///Assets/Pdf/edit.png"/>
</Maps:Pushpin.Background>
<Maps:MapLayer.Position>
<Maps:Location Latitude="{Binding MyMeetingSquareLat}" Longitude="{Binding MyMeetingSquareLng}" />
</Maps:MapLayer.Position>
</Maps:Pushpin>
</Maps:Map.Children>
</Maps:Map>
</StackPanel>
</Grid>
</StackPanel>
The pushpins appear in the correct position, but the map center continues to go to point 0 0 , it doesnt read the binded values for some reason.
You are binding a string (as you said in the comments) to the Latitude property of Maps:Location. However Maps:Location expects a double for this value.
You need to convert this value into a double with the following code:
Double.Parse(myStringValue);
If the value MyMeetingSquareLat can't be changed to a string itself, then add another property like this, and bind to it instead:
public Double MyMeetingSquareLatDouble
{
get
{
return Double.Parse(this.MyMeetingSquareLat);
}
}

How to access a specific item in a Listbox with DataTemplate

I am using Telerik, HubSection is like Pivot with WP8.
<HubSection x:Uid="Section4Header" Header="All note" >
<DataTemplate>
<ListBox x:Name="listBoxobj" Background="Transparent" Margin="6" Height="auto" BorderThickness="2" MaxHeight="580" Grid.Row="1" SelectionChanged="listBoxobj_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Width="350" >
<Border Margin="5" BorderBrush="White" BorderThickness="1">
<Grid Holding="Grid_Holding" VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem x:Name="EditButton"
Text="Export To PDF"
Click="EditButton_Click"
/>
<MenuFlyoutItem x:Name="EditButton1"
Text="Export To PDF syncfu"
Click="EditButton1_Click"
/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<TextBlock Margin="5,0,0,0" Grid.Row="0" x:Name="NameTxt" TextWrapping="Wrap" Text="{Binding Name}" FontSize="28" Foreground="White"/>
<TextBlock HorizontalAlignment="Right" Margin="0,0,35,0" Grid.Row="3" x:Name="CreateddateTxt" Foreground="White" FontSize="18" TextWrapping="Wrap" Text="{Binding CreationDate}" />
</Grid>
</Border>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</DataTemplate>
</HubSection>
C#
private void ReadWritePadFileContentList_Loaded(object sender, RoutedEventArgs e)
{
ReadAllWritePadFileContent dbnote = new ReadAllWritePadFileContent();
DB_ContactList = dbnote.GetAllContacts();//Get all DB contacts
if (DB_ContactList.Count > 0)
deleteAppBarButton.IsEnabled = true;
else
deleteAppBarButton.IsEnabled = false;
listBoxobj.ItemsSource = DB_ContactList.OrderByDescending(i => i.Id).ToList();//Binding DB data to LISTBOX and Latest contact ID can Display first.
}
listBoxobj is name of ListBox
the problem is So how can I acces the the listbox?
The name 'listBoxobj' does not exist in the current context
As Mike said, You wont be able to directly access the listbox from the hub's code, as its in a DataTemplate.
However, you can create a UserControl eg, MyUserControl1.
Put your ListBox inside the MyUserControl1.xaml file, and its related c# code in MyUserControl1.cs file.
Then, add the user control in your HubSection.
<HubSection x:Uid="Section4Header" Header="All note" >
<DataTemplate>
<local:MyUserControl1 x:Name="ListControl"/>
</DataTemplate>
</HubSection>
EDIT: Put your ListBox code inside the <Grid> your UserControl code:
<ListBox x:Name="listBoxobj" Background="Transparent" Margin="6" Height="auto" BorderThickness="2" MaxHeight="580" Grid.Row="1" SelectionChanged="listBoxobj_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Width="350" >
<Border Margin="5" BorderBrush="White" BorderThickness="1">
<Grid Holding="Grid_Holding" VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem x:Name="EditButton"
Text="Export To PDF"
Click="EditButton_Click"
/>
<MenuFlyoutItem x:Name="EditButton1"
Text="Export To PDF syncfu"
Click="EditButton1_Click"
/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<TextBlock Margin="5,0,0,0" Grid.Row="0" x:Name="NameTxt" TextWrapping="Wrap" Text="{Binding Name}" FontSize="28" Foreground="White"/>
<TextBlock HorizontalAlignment="Right" Margin="0,0,35,0" Grid.Row="3" x:Name="CreateddateTxt" Foreground="White" FontSize="18" TextWrapping="Wrap" Text="{Binding CreationDate}" />
</Grid>
</Border>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
You won't be able to do that directly as it's within a DataTemplate and your ListBox is therefore generated at runtime.
You might have some joy following the steps in this article to pull your ListBox out of the visual tree:
http://blogs.msdn.com/b/wpfsdk/archive/2007/04/16/how-do-i-programmatically-interact-with-template-generated-elements-part-ii.aspx

How to bind two different collections to two different ListPickers

I'm new to Windows Phone development.
I've tried to bind two different collections to two listpickers. When I clicked on either listpickers, the names of colors or poop types are not shown as I expected. I always get errors like this
System.Windows.Data Error: BindingExpression path error: 'colors' property not found on 'Maroon' 'System.String' (HashCode=68540248). BindingExpression: Path='colors' DataItem='Maroon' (HashCode=68540248); target element is 'System.Windows.Controls.TextBlock' (Name=''); target property is 'Text' (type 'System.String')..
This is my code
public partial class Poop_info_page : PhoneApplicationPage
{
public Poop_info_page()
{
InitializeComponent();
//DataContext = ColorExtensions.AccentColors();
//DataContext = ShapeData.ShapeNames();
var colors = ColorExtensions.AccentColors();
colorPicker.ItemsSource = colors;
var poopType = ShapeData.ShapeNames();
shapePicker.ItemsSource = poopType;
}
}
Data1
public static class ShapeData
{
private static string[] _shapeNames = { "Separated hard lumps",
"Lumpy sausage",
"Sausage with cracks surface",
"Smooth soft snake",
"Soft blobs with clear cut",
"Mushy and fluffy pieces",
"Entirely liquid" };
public static ReadOnlyCollection<string> ShapeNames()
{
return new ReadOnlyCollection<string>(_shapeNames);
}
}
Data2
public static class ColorExtensions
{
/// <summary>
/// An array of all the names of the accent colors.
/// </summary>
private static string[] _accentColors = { "Maroon",
"Medium Brown",
"Light Brown",
"Orange",
"Yellow",
"Red",
"Dark Green",
"Clay",
"Black" };
/// <summary>
/// Returns an array of all the names of the accent colors.
/// </summary>
public static ReadOnlyCollection<string> AccentColors()
{
return new ReadOnlyCollection<string>(_accentColors);
}
}
XML
<phone:PhoneApplicationPage.Resources>
<data:AccentColorNameToBrush x:Key="ColorNameToBrushConverter" />
<data:ShapeTypeToImg x:Key="ShapeNameToImg" />
</phone:PhoneApplicationPage.Resources>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel Grid.Row="0" Margin="12,17,0,0">
<TextBlock Text="POOPOR" Style="{StaticResource PhoneTextNormalStyle}" FontSize="24" Foreground="#FF787B7C"/>
<TextBlock Text="New poop" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="78.667" Foreground="#FF787B7C" FontFamily="Segoe WP SemiLight"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Margin="0,15">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<toolkit:ListPicker x:Name="colorPicker" ItemsSource="{Binding colors}" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Edit" TextAlignment="Center"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0 21 0 20">
<Rectangle Fill="{Binding Converter={StaticResource ColorNameToBrushConverter}}" Width="43" Height="43"/>
<TextBlock Text="{Binding colors}"
Margin="16 0 0 0"
FontSize="43"
FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
<StackPanel Margin="15,0,0,0" Grid.Column="1" Width="120">
<TextBlock TextWrapping="Wrap" Text="COLOR" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="32" Margin="0,7,0,0"/>
<TextBlock x:Name="colorResult_text" TextWrapping="Wrap" Foreground="#FF787B7C" Margin="0">
<Run FontSize="17.333" Text="Light Brown "/>
<Run FontSize="14.667" Text="(Detected result)"/>
</TextBlock>
</StackPanel>
<es:Arc x:Name="colorResult" ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FFCB9453" Margin="30,0,0,0" Stretch="None" Stroke="Black" StrokeThickness="0" StartAngle="0" UseLayoutRounding="False" Width="107"/>
</Grid>
<Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom">
<Border.BorderBrush>
<SolidColorBrush Color="#FF727272" Opacity="0.5"/>
</Border.BorderBrush>
</Border>
<Grid Margin="0,15" Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<toolkit:ListPicker x:Name="shapePicker" ItemsSource="{Binding poopType}" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Edit" TextAlignment="Center"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate x:Name="dataTemplate">
<StackPanel Orientation="Horizontal" Margin="0 21 0 20">
<Image Source="{Binding Converter={StaticResource ShapeNameToImg}}" Width="107" />
<TextBlock Text="{Binding poopType}"
Margin="16 0 0 0"
FontSize="32"
FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
<StackPanel Margin="15,0,0,0" Grid.Column="1" Width="120">
<TextBlock TextWrapping="Wrap" Text="SHAPE" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="32" Margin="0,4,0,0"/>
<TextBlock x:Name="shapeResult_text" TextWrapping="Wrap" Foreground="#FF787B7C" Margin="0" Text="Separate hard lumps"/>
</StackPanel>
<Image x:Name="shapeResult" Margin="30,0,0,0" HorizontalAlignment="Center" Width="107"/>
</Grid>
<Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom" Grid.Row="1">
<Border.BorderBrush>
<SolidColorBrush Color="#FF727272" Opacity="0.5"/>
</Border.BorderBrush>
</Border>
<StackPanel Orientation="Horizontal" Margin="0,15" Grid.Row="2">
<Image x:Name="pain_level_picture" HorizontalAlignment="Center" Width="108" Margin="30,0,0,0" Source="/Assets/img/painLevel/nohurt.png"/>
<StackPanel Margin="15,0,0,0" Width="311">
<TextBlock TextWrapping="Wrap" Text="PAIN LEVEL" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="24"/>
<TextBlock x:Name="pain_level_description" TextWrapping="Wrap" Foreground="#FF787B7C" FontSize="17.333" Text="Normal pain"/>
<Slider x:Name="painLevel_slider" FontSize="18.667" Padding="0"
Margin="-24,-5,24,0" Foreground="#FF1BA1E2" BorderBrush="Black" BorderThickness="2"
Maximum="5" Minimum="1" SmallChange="1"
>
<Slider.Background>
<ImageBrush ImageSource="Assets/img/slider.png"/>
</Slider.Background>
</Slider>
</StackPanel>
</StackPanel>
<Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom" Grid.Row="2">
<Border.BorderBrush>
<SolidColorBrush Color="#FF727272" Opacity="0.5"/>
</Border.BorderBrush>
</Border>
<StackPanel Orientation="Horizontal" Margin="0,15" Grid.Row="3">
<Image x:Name="blood_amount_picture" HorizontalAlignment="Center" Width="108" Margin="30,0,0,-1" Source="/Assets/img/bloodAmount/noblood.png"/>
<StackPanel Margin="15,0,0,0">
<TextBlock TextWrapping="Wrap" Text="BLOOD AMOUNT" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="24"/>
<TextBlock x:Name="blood_amount_description" TextWrapping="Wrap" Foreground="#FF787B7C" FontSize="17.333" Text="5 Blood Amount Measurement"/>
<Slider x:Name="blood_amount_slider" FontSize="18.667" Padding="0"
Margin="-24,-5,24,0" Foreground="#FF1BA1E2" BorderBrush="Black" BorderThickness="2"
Maximum="5" Minimum="1" SmallChange="1"
Width="311"
>
<Slider.Background>
<ImageBrush ImageSource="Assets/img/slider.png"/>
</Slider.Background>
</Slider>
</StackPanel>
</StackPanel>
</Grid>
<Button x:Name="newPoop_submit_button" Content="Submit" VerticalAlignment="Center" Grid.Row="2" Background="#FF1BA1E2" FontSize="30.667" Click="newPoop_submit_button_Click"/>
</Grid>
Ps. When I do like this
DataContext = ColorExtensions.AccentColors();
DataContext = ShapeData.ShapeNames();
It works fine but I can use either ColorExtensions data or ShapeData data.
regards
Thank you very much
Try like this:
public partial class Poop_info_page : PhoneApplicationPage
{
public Poop_info_page()
{
InitializeComponent();
colorPicker.ItemsSource = ColorExtensions.AccentColors();
shapePicker.ItemsSource = ShapeData.ShapeNames();
}
}
And in XAML - remove Preperty Path (colors) and ItemsSource (as you set it in code) - similar with second ListPicker:
<toolkit:ListPicker x:Name="colorPicker" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Edit" TextAlignment="Center"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0 21 0 20">
<Rectangle Fill="{Binding Converter={StaticResource ColorNameToBrushConverter}}" Width="43" Height="43"/>
<TextBlock Text="{Binding}"
Margin="16 0 0 0"
FontSize="43"
FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
Binding works to Property and you declared Path as colors, which is not a property (in any DataContext).

AG_E_PARSER_BAD_PROPERTY_VALUE (Line 7;Position 51)

This is my XAML code in my project, in this first i display MainListBox then display ChatListBox depending on user selection. When user select to chat then i got run time Xaml parseing exception.
this is my whole Xaml code...
<phone:PhoneApplicationPage
x:Class="DocomoMessenger.View.Buddies"
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
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="126"/>
<RowDefinition Height="580*"/>
<RowDefinition Height="75"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="2,2,0,2">
<ProgressBar Height="3" Name="waitprogess" Margin="0,2,0,0" />
<TextBlock x:Name="txtload" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,5,12,0" />
<TextBlock x:Name="PageTitle" Text="page name" Margin="1,0,0,0" Style="{StaticResource PhoneTextTitle1Style}" HorizontalAlignment="Center" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="2,0,2,0">
<Border BorderThickness="5" BorderBrush="DarkGray" CornerRadius="10" Name="buddyborder">
<ListBox x:Name="MainListBox" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Height="100" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="{Binding IM}" Stretch="Fill" Width="50" Height="50" VerticalAlignment="Center" HorizontalAlignment="Center" ></Image>
<StackPanel Margin="1,4,0,0" Grid.Column="1" x:Name="details" Height="100">
<TextBlock Text="{Binding Name}" Style="{StaticResource PhoneTextNormalStyle}" Foreground="Brown" Padding="10"/>
<TextBlock Text="{Binding StatusMsg}" FontSize="{StaticResource PhoneFontSizeSmall}" TextWrapping="Wrap" Padding="10" />
</StackPanel>
<Image Tag="{Binding Name}" Source="{Binding IMChat}" Grid.Column="2" Stretch="Uniform" Width="40" Height="40" VerticalAlignment="Center" HorizontalAlignment="Center" Name="imgchat" MouseLeftButtonUp="imgchat_MouseLeftButtonUp"></Image>
<Line Stretch="UniformToFill" Grid.ColumnSpan="3" Stroke="DarkGray" StrokeThickness="2" Margin="0,10,0,0" X1="10" Y1="10" Y2="10" VerticalAlignment="Bottom" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Border>
<ListBox x:Name="ChatListBox" Margin="2,2,0,0" Opacity="1" Visibility="Collapsed" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Name="megrid" Margin="3,5,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="40*"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding FirstCol}"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="{Binding LastCol}"/>
</Grid.ColumnDefinitions>
<Image Name="imgbud" Source="{Binding IM}" Grid.Column="{Binding ImgCol}" Grid.Row="1" Stretch="Uniform" Width="50" Height="50"/>
<Rectangle Grid.RowSpan="2" RadiusY="20" RadiusX="20" Grid.Column="{Binding RectCol}" Fill="{Binding Bru}" />
<TextBlock Text="{Binding Name}" Grid.Row="0" TextWrapping="Wrap" Grid.Column="{Binding RectCol}" Padding="10" />
<TextBlock Text="{Binding Time}" Grid.Row="1" Grid.Column="{Binding RectCol}" Padding="10" />
<Path Data="{Binding Obj}" Fill="{Binding Bru}" Margin="0,0,-5,0" HorizontalAlignment="{Binding HorAlig}" Grid.Row="1" Grid.Column="1" VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
<Grid x:Name="sendmsg" Height="75" VerticalAlignment="Bottom" Grid.Row="2" Visibility="Collapsed">
<TextBox Name="txtmsg" Text="type" Padding="5" Opacity="0.8" MouseLeftButtonUp="txtmsg_MouseLeftButtonUp" Width="370" HorizontalAlignment="Left" />
<Image Name="imgsend" Width="100" Height="46" Source="/DocomoMessenger;component/Themes/send.png" HorizontalAlignment="Right" Stretch="UniformToFill" Margin="0,12,4,17" MouseLeftButtonUp="imgsend_MouseLeftButtonUp"/>
</Grid>
</Grid>
<!--Sample code showing usage of ApplicationBar-->
<!--<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="MenuItem 1"/>
<shell:ApplicationBarMenuItem Text="MenuItem 2"/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>-->
when I run this code i got following XamlParsinException error.
Anyone help me.
Thanks in Advance
Pavan.
I can't pin it down, it is a nearly generic message that doesn't say much.
Here is what I would do:
Comment out all content so you are left with <PhoneApplicationPage ...>
Comment out all C# code that depends on the XAML you just commented out
Make sure the application compiles.
Now slowly, step by step, add xaml elements back in. Until you find the offending line.
If 4. is too hard you could reverse this trick; comment out part by part.
whats in your PhoneApplicationPage_Loaded method?
apart from a missing end tag
</phone:PhoneApplicationPage>
in your snippet above I was able to build and run this in WP7 7.1. I did have to omit your Loaded and MouseLeftButtonUp refers though as I don't have your full code.

Categories