I want to desing this for a Windows Phone 8.1 app: https://drive.google.com/file/d/0B1DvAPVaaQiyT3dOMDhfcHNJSVk/edit?usp=sharing
I do it with hard code:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="1" Margin="0,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Common:RingSlice InnerRadius="100" Radius="150" Fill="White" StartAngle="0" EndAngle="358"/>
<Common:RingSlice InnerRadius="100" Radius="115" Fill="Maroon" StartAngle="-0.3" EndAngle="356.9"/>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="10.88" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">7:30
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="32.56" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">8:30
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="74.18" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">10:30
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="115.71" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">12:30
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="137.47" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">13:30
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="169.12" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">15:00
<TextBlock.RenderTransform>
<RotateTransform Angle="270"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="200.76" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">16:30
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="232.41" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">18:00
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="254.18" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">19:00
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="275.94" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">20:00
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="307.59" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">21:30
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="339.24" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5">23:00
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
</Grid>
</Grid>
But I want to add the textblocks with the hours with data binding, something like this:
<ItemsControl Name="cig" DataContext="{Binding FirstGroup}" d:DataContext="{Binding Groups[0], Source={d:DesignData Source=/DataModel/SampleData.json, Type=data:SampleDataSource}}" ItemsSource="{Binding Items}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Margin="0,0,0,0" RenderTransformOrigin="0.5, 0.5">
<Grid.RenderTransform>
<CompositeTransform Rotation="{Binding Angle}" CenterX="0" CenterY="0" ScaleX="1.1" ScaleY="1.1"/>
</Grid.RenderTransform>
<TextBlock VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="7" RenderTransformOrigin="0.5,0.5" Text="{Binding Title}">
<TextBlock.RenderTransform>
<RotateTransform Angle="90"/>
</TextBlock.RenderTransform></TextBlock>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
I try to do this with above code but the alignement of textblocks is not proper, and looks like the following image: https://drive.google.com/file/d/0B1DvAPVaaQiyVmpZSkthS3oxLTg/edit?usp=sharing
Please, help me!!!!
Related
So I have a ListView. It has a ItemSource and a SelectedItem.
The SelectedItem has a bool property that toggles the visibility of the Button and TextBox.
When you press in the ListViewItem I want to be able to toggle the visibility on and off, even if I just spam the row.
The solution is partly working, except that SelectedItem is only fired when the Item don't have focus. So when I have toggled one time, I have to do it to another item to toggle the first again.
I have thought about code-behind, add something to the GotFocus-method, but can't think of what I have to do there.
Suggestions?
XAML:
<ListView ScrollViewer.VerticalScrollMode="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Disabled"
ScrollViewer.IsVerticalRailEnabled="False"
Background="White"
ItemsSource="{Binding Activities}"
SelectedItem="{Binding SelectedActivity, Mode=TwoWay}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<ListViewItemPresenter
ContentTransitions="{TemplateBinding ContentTransitions}"
SelectionCheckMarkVisualEnabled="True"
CheckBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
CheckBoxBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
FocusBorderBrush="{ThemeResource SystemControlForegroundAltHighBrush}"
FocusSecondaryBorderBrush="{ThemeResource SystemControlForegroundBaseHighBrush}"
PlaceholderBackground="White"
PointerOverBackground="LightGray"
PointerOverForeground="DarkGray"
SelectedBackground="White"
SelectedForeground="DimGray"
SelectedPointerOverBackground="White"
PressedBackground="White"
SelectedPressedBackground="White"
DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
ContentMargin="{TemplateBinding Padding}"
CheckMode="Inline"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.Header>
<StackPanel Background="#8c8c8c"
Orientation="Horizontal"
FlowDirection="LeftToRight"
Padding="8,8,8,8">
<TextBlock Text="{Binding Title}"
FontSize="18"
Foreground="White"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="10,0,0,0"/>
</StackPanel>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<Grid Margin="0,10,0,10">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Vertical"
Grid.Row="0"
Grid.RowSpan="2"
Grid.Column="0"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Margin="6,2,6,2">
<TextBlock FontSize="20"
VerticalAlignment="Center"
Foreground="DimGray"
TextWrapping="WrapWholeWords"
Text="{Binding Activity.Description}"/>
<TextBlock FontSize="15"
VerticalAlignment="Center"
Foreground="DimGray"
Text="{Binding Activity.Condition}"/>
</StackPanel>
<Button Grid.Row="0"
Grid.Column="1"
Grid.RowSpan="2"
Margin="6"
VerticalAlignment="Center"
HorizontalAlignment="Right"
Background="Transparent"
BorderBrush="Transparent"
BorderThickness="0"
Command="{Binding ToggleMeasureCompletionCommand}">
<Grid>
<TextBlock FontFamily="Segoe MDL2 Assets"
FontSize="35"
Foreground="DimGray"
Text=""
Margin="8"
VerticalAlignment="Center"
HorizontalAlignment="Right"
Visibility="{Binding IsCompleted, Converter={StaticResource InverseBooleanToVisibilityConverter}}"/>
<TextBlock FontFamily="Segoe MDL2 Assets"
FontSize="35"
Foreground="DimGray"
Text=""
Margin="8"
VerticalAlignment="Center"
HorizontalAlignment="Right"
Visibility="{Binding IsCompleted, Converter={StaticResource BoolToVis}}"/>
</Grid>
</Button>
<Grid Visibility="{Binding IsInFocus, Converter={StaticResource BoolToVis}}" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Margin="0,10,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBox Grid.Column="0" PlaceholderText="Kommentar til tiltak" HorizontalAlignment="Stretch" Padding="5" Margin="0,0,10,0"/>
<Button Grid.Column="1" Content="Flag" HorizontalAlignment="Right" Foreground="White" Padding="10,5,10,5">
<Button.Background>
<SolidColorBrush Color="Red" Opacity="0.5" />
</Button.Background>
</Button>
</Grid>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
C# - property:
public SelectedItemViewModel SelectedActivity
{
get { return _selectedActivity; }
set
{
_selectedActivity = value;
SelectedActivity.IsInFocus = !SelectedActivity.IsInFocus;
OnPropertyChanged();
}
}
Write this code SelectedActivity.IsInFocus = !SelectedActivity.IsInFocus inside ItemClick event of listview.
You can write inside Taped event also
I am not able to make the scrollviewer working! The list is not scrollable. Maybe you can help me :)
<Grid x:Name="grid">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ScrollViewer Margin="0" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
<StackPanel VerticalAlignment="Top">
<ListBox x:Name="KommentareListView" ItemsSource="{Binding}" Foreground="White" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="0,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Background="#FF0083FF" Width="10" />
<StackPanel Margin="10,5,10,5" Grid.Column="1">
<TextBlock Text="{Binding Kommentar}"
FontSize="16" Margin="0,0,0,0" TextWrapping="Wrap" Foreground="Black"/>
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding Author}"
FontSize="12" Margin="0,0,0,0" Foreground="Black"/>
<TextBlock Text="{Binding Date}"
FontSize="12" Margin="30,0,0,0" Foreground="Black"/>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button x:Name="mehrKommentareLaden" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,10,0,0" Height="45" Visibility="Collapsed" Content="mehr Kommentare laden" Click="mehrKommentareLaden_Click" />
</StackPanel>
</ScrollViewer>
<StackPanel HorizontalAlignment="Left" VerticalAlignment="Bottom" Grid.Row="1">
<StackPanel x:Name="AnmeldenPanel" VerticalAlignment="Bottom" Width="456" Visibility="Collapsed">
<Button x:Name="AnmeldenButton" Content="Anmelden" VerticalAlignment="Center" BorderBrush="Black" Foreground="Black" Margin="0" Click="AnmeldenButton_Click"/>
<TextBlock TextWrapping="Wrap" Text="Du musst dich anmelden, um Kommentare zu verfassen." Margin="15,0,0,0"/>
</StackPanel>
<toolkit:PhoneTextBox x:Name="KommentarBox" Hint="Dein Kommentar..." LengthIndicatorVisible="True" LengthIndicatorThreshold="10" DisplayedMaxLength="240" TextWrapping="Wrap" Background="#BFB2B2B2" BorderBrush="#BFFFFFFF" Foreground="#91000000" SelectionBackground="#FF0083FF" SelectionForeground="White" Style="{StaticResource PhoneTextBoxWhiteBackground}" Height="74" Width="456"/>
</StackPanel>
<!--<Controls:WatermarkTextBox x:Name="KommentarTextBox" Margin="0,0,100,20" TextWrapping="Wrap" Watermark="Dein Kommentar...." Height="30" VerticalAlignment="Center" FontFamily="Calibri" FontSize="17.333" BorderBrush="#CC000000"/>-->
</Grid>
Try making the List height to auto and everything else to auto which is in between List and ScrollView like you are having StackPanel.
i have a listbox with around 150 items in it. the problem is that it is not taking any events. other listboxes have less than 90 items and they are working fine.
is there any limit or something which is preventing event handeling??
<ScrollViewer HorizontalAlignment="Left" Height="170" Margin="0,421,0,0" VerticalAlignment="Top" Width="480" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
<ListBox Name="thirdList" Tap="firstList_SelectionChanged_1" Height="170" ScrollViewer.VerticalScrollBarVisibility="Disabled" >
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragCompleted="GestureListener_DragCompleted"></toolkit:GestureListener>
</toolkit:GestureService.GestureListener>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Padding" Value="0 0 0 0 " />
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Height="170" Width="150" Background="Transparent">
<!--Replace rectangle with image-->
<Image Source="{Binding image}" Stretch="UniformToFill" Margin="0,20" HorizontalAlignment="Left" VerticalAlignment="Bottom" Height="140" Width="119"></Image>
<Grid Margin="0,-335,0,0" HorizontalAlignment="Center" Background="Transparent" Height="30">
<TextBlock TextAlignment="Center" Text="{Binding brandName}" HorizontalAlignment="Center" FontSize="15" TextWrapping="NoWrap" Foreground="#FFAA1F17" />
</Grid>
<StackPanel Width="165" Margin="0,-65,0,0" Background="Transparent">
<Grid HorizontalAlignment="Stretch" Height="55" Background="#FF9B9A9A">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center" Background="Transparent">
<TextBlock TextAlignment="Center" Text="{Binding productName}" TextWrapping="Wrap" HorizontalAlignment="Center" Foreground="White" FontSize="15" />
<TextBlock TextAlignment="Center" Text="{Binding price}" TextWrapping="Wrap" HorizontalAlignment="Center" Foreground="#99FFFFFF" FontSize="15" />
</StackPanel>
</Grid>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
vjamit please consider using LongListSelector for Windows Phone 8 applications and not the old ListBox.
I have tested LLS with more than 5k items and it loads and plays just fine.
Also there is no need at all to wrap LLS in a ScrollViewer. Check below example:
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Key="LLSTemplate">
<Grid Tap="firstList_SelectionChanged_1">
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragCompleted="GestureListener_DragCompleted"></toolkit:GestureListener>
</toolkit:GestureService.GestureListener>
<StackPanel Orientation="Vertical" Height="170" Width="150" Background="Transparent">
<!--Replace rectangle with image-->
<Image Source="{Binding image}" Stretch="UniformToFill" Margin="0,20" HorizontalAlignment="Left" VerticalAlignment="Bottom" Height="140" Width="119"></Image>
<Grid Margin="0,-335,0,0" HorizontalAlignment="Center" Background="Transparent" Height="30">
<TextBlock TextAlignment="Center" Text="{Binding brandName}" HorizontalAlignment="Center" FontSize="15" TextWrapping="NoWrap" Foreground="#FFAA1F17" />
</Grid>
<StackPanel Width="165" Margin="0,-65,0,0" Background="Transparent">
<Grid HorizontalAlignment="Stretch" Height="55" Background="#FF9B9A9A">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center" Background="Transparent">
<TextBlock TextAlignment="Center" Text="{Binding productName}" TextWrapping="Wrap" HorizontalAlignment="Center" Foreground="White" FontSize="15" />
<TextBlock TextAlignment="Center" Text="{Binding price}" TextWrapping="Wrap" HorizontalAlignment="Center" Foreground="#99FFFFFF" FontSize="15" />
</StackPanel>
</Grid>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<phone:LongListSelector x:Name="thirdList" Height="170" ItemTemplate="{StaticResource LLSTemplate}"/>
</Grid>
Let me know if the above works.
EDITED:
Try applying the following changes on the ScrollViewer: HorizontalScrollBarVisibility="Disabled". Tested with 500+ and it works. Seems like a "bug".
I have 5 horizontal listboxes with images and text in them.. the text is shown in textblock inside stackpanel(background as grey).. now if i change the background to black and opacity to 0.3, I start getting outofmemory.. what could be wrong?? here's my listbox :
<ScrollViewer x:Name="scroll1" HorizontalAlignment="Left" Height="200" Margin="0,27,0,0" VerticalAlignment="Top" Width="480" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled" >
<ListBox Name="firstList" Height="200" ScrollViewer.VerticalScrollBarVisibility="Disabled" Tap="firstList_SelectionChanged_1" >
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragCompleted="GestureListener_DragCompleted"></toolkit:GestureListener>
</toolkit:GestureService.GestureListener>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Padding" Value="0 0 0 0 " />
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Height="200" Width="150" Background="Transparent">
<!--Replace rectangle with image-->
<Image Source="{Binding image}" Margin="0,20" HorizontalAlignment="Left" VerticalAlignment="Bottom" Stretch="UniformToFill" Height="140" Width="119"></Image>
<Grid Margin="0,-335,0,0" HorizontalAlignment="Center" Background="Transparent" Height="30">
<TextBlock Text="{Binding brandName}" HorizontalAlignment="Center" FontSize="15" TextWrapping="NoWrap" Foreground="#FFAA1F17" />
</Grid>
<Grid Margin="70,-240,-10,0" Width="50" Height="50" Background="Transparent">
<!--<TextBlock Text="Discount" Foreground="White" FontSize="15" Margin="15,0,5,0"/>-->
<Image Source="{Binding imageSource}" Width="50" Height="50" ></Image>
<TextBlock Text="{Binding discountPercentage}" TextWrapping="NoWrap" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White" FontSize="15" />
</Grid>
<StackPanel Width="150" Margin="0,-35,0,0" Background="Transparent">
<Grid HorizontalAlignment="Stretch" Height="55" Background="#FF9B9A9A">
<!--<TextBlock Text="Rs" Foreground="White" FontSize="20" Margin="30,0,5,0"/>-->
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" Background="Transparent">
<TextBlock Text="{Binding productName}" TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="#99FFFFFF" FontSize="15" />
</StackPanel>
</Grid>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
I have tried this and got outofmemoryerror:
<StackPanel Orientation="Vertical" Height="200" Width="150" Background="Transparent">
<!--Replace rectangle with image-->
<Image Source="{Binding image}" Margin="0,20" HorizontalAlignment="Left" VerticalAlignment="Bottom" Stretch="UniformToFill" Height="140" Width="119"></Image>
<Grid Margin="0,-335,0,0" HorizontalAlignment="Center" Background="Transparent" Height="30">
<TextBlock Text="{Binding brandName}" HorizontalAlignment="Center" FontSize="15" TextWrapping="NoWrap" Foreground="#FFAA1F17" />
</Grid>
<Grid Margin="70,-240,-10,0" Width="50" Height="50" Background="Transparent">
<!--<TextBlock Text="Discount" Foreground="White" FontSize="15" Margin="15,0,5,0"/>-->
<Image Source="{Binding imageSource}" Width="50" Height="50" ></Image>
<TextBlock Text="{Binding discountPercentage}" TextWrapping="NoWrap" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White" FontSize="15" />
</Grid>
<StackPanel Width="150" Margin="0,-35,0,0" Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" Background="Black" Opacity="0.3">
<TextBlock Text="{Binding productName}" TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="#99FFFFFF" FontSize="15" />
</StackPanel>
</StackPanel>
self resolved. By replacing grid/stackpanel with a textblock on transparent image.
I have the following GridView
<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemsGridView"
AutomationProperties.Name="Items"
TabIndex="1"
Grid.RowSpan="2"
Padding="116,136,116,46"
SelectionMode="Single"
IsSwipeEnabled="false"
Visibility="Collapsed">
<GridView.ItemTemplate>
<DataTemplate>
<!--<Border BorderBrush="DarkSeaGreen" BorderThickness="1">-->
<Grid Background="{Binding objBackgroundColor}" Opacity="1" Width="400" Height="80">
<Grid.RowDefinitions>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<TextBlock Text="{Binding objCustomTestPaper.Name}" TextWrapping="Wrap" FontWeight="SemiBold" VerticalAlignment="Top" Foreground="{Binding objForegroundColor}" Style="{StaticResource TitleTextStyle}" FontSize="20" MaxHeight="25" Margin="10,5,10,0" />
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="120"></ColumnDefinition>
</Grid.ColumnDefinitions>
<!--<Image Grid.Column="0" Height="35" VerticalAlignment="Center" HorizontalAlignment="Center" Source="Assets/paper.png"></Image>-->
<StackPanel Grid.Column="0" Margin="5,7,0,0">
<callisto:Rating FontStretch="SemiCondensed" ItemCount="5" Value="{Binding objCustomTestPaper.TestRating}" FontWeight="Light" VerticalAlignment="Bottom" Margin="0,2,5,1" Background="Transparent" HorizontalAlignment="Left" Foreground="{Binding objForegroundColor}" IsHitTestVisible="False" FontSize="12" >
</callisto:Rating>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<TextBlock Text="Attempted by others:" Margin="4,0,0,0" FontSize="12" FontWeight="Light" Foreground="{Binding objForegroundColor}"></TextBlock>
<TextBlock Text="{Binding objCustomTestPaper.AttemptCount}" FontWeight="SemiBold" Margin="5,0,0,0" FontSize="12" Foreground="{Binding objForegroundColor}"></TextBlock>
<TextBlock Text="times" Margin="3,0,0,0" FontSize="12" FontWeight="Light" Foreground="{Binding objForegroundColor}"></TextBlock>
</StackPanel>
</StackPanel>
<StackPanel VerticalAlignment="Stretch" Grid.Column="2" Margin="0,0,0,0" >
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center">
<TextBlock Text="Time:" FontSize="16" Foreground="{Binding objForegroundColor}" VerticalAlignment="Bottom" FontWeight="SemiLight"></TextBlock>
<TextBlock Text="{Binding strTestDuration}" Margin="5,0,0,0" FontSize="18" VerticalAlignment="Bottom" Foreground="{Binding objForegroundColor}" FontWeight="SemiLight"></TextBlock>
</StackPanel>
<StackPanel Margin="0,2,0,0" Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center">
<TextBlock Text="Points:" FontSize="16" Margin="0,0,0,0" VerticalAlignment="Bottom" Foreground="{Binding objForegroundColor}" FontWeight="SemiLight"></TextBlock>
<TextBlock Text="{Binding objCustomTestPaper.TotalMarks}" Margin="5,0,0,0" VerticalAlignment="Bottom" FontSize="18" Foreground="{Binding objForegroundColor}" FontWeight="SemiLight"></TextBlock>
</StackPanel>
</StackPanel>
</Grid>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
It is working fine and loads data successfully but When I press back button the data remains in the memory (not usable) and keeps on increasing at various visits to the page. I don't know how how to clear the items of the GridView when OnNavigationFrom(,) method is called. I am trying to use objGridView.Items.Clear() but it throws some HRXXXX exception.