Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Yes, you need to modify the GridViewItem style in the ItemContainerStyle property.</p> <pre><code>&lt;GridView&gt; &lt;GridView.ItemContainerStyle&gt; &lt;Style TargetType="GridViewItem"&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="GridViewItem"&gt; &lt;Border x:Name="OuterContainer"&gt; &lt;VisualStateManager.VisualStateGroups&gt; &lt;VisualStateGroup x:Name="CommonStates"&gt; &lt;VisualState x:Name="Normal" /&gt; &lt;VisualState x:Name="PointerOver"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="PointerOverBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetName="SelectionBackground" Storyboard.TargetProperty="Fill"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ListViewItemSelectedPointerOverBorderBrush}" /&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetName="SelectedBorder" Storyboard.TargetProperty="Stroke"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ListViewItemSelectedPointerOverBorderBrush}" /&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetName="SelectedEarmark" Storyboard.TargetProperty="Fill"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ListViewItemSelectedPointerOverBorderBrush}" /&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Pressed"&gt; &lt;Storyboard&gt; &lt;TapDownThemeAnimation TargetName="ContentContainer" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Disabled"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Opacity" Duration="0" To="{StaticResource ListViewItemDisabledOpacity}" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="FocusStates"&gt; &lt;VisualState x:Name="Focused"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisual" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Unfocused" /&gt; &lt;VisualState x:Name="PointerFocused" /&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="SelectionHintStates"&gt; &lt;VisualStateGroup.Transitions&gt; &lt;VisualTransition To="NoSelectionHint" GeneratedDuration="0:0:0.65" /&gt; &lt;/VisualStateGroup.Transitions&gt; &lt;VisualState x:Name="VerticalSelectionHint"&gt; &lt;Storyboard&gt; &lt;SwipeHintThemeAnimation TargetName="SelectionBackground" ToVerticalOffset="25" ToHorizontalOffset="0" /&gt; &lt;SwipeHintThemeAnimation TargetName="ContentBorder" ToVerticalOffset="25" ToHorizontalOffset="0" /&gt; &lt;SwipeHintThemeAnimation TargetName="SelectedCheckMark" ToVerticalOffset="25" ToHorizontalOffset="0" /&gt; &lt;DoubleAnimation Storyboard.TargetName="HintGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="HorizontalSelectionHint"&gt; &lt;Storyboard&gt; &lt;SwipeHintThemeAnimation TargetName="SelectionBackground" ToHorizontalOffset="-25" ToVerticalOffset="0" /&gt; &lt;SwipeHintThemeAnimation TargetName="ContentBorder" ToHorizontalOffset="-25" ToVerticalOffset="0" /&gt; &lt;SwipeHintThemeAnimation TargetName="SelectedCheckMark" ToHorizontalOffset="-25" ToVerticalOffset="0" /&gt; &lt;DoubleAnimation Storyboard.TargetName="HintGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="NoSelectionHint" /&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="SelectionStates"&gt; &lt;VisualState x:Name="Selecting"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectionBackground" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectedBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectingGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="HintGlyphBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Selected"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectionBackground" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectedBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Unselecting"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="HintGlyphBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Unselected"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="HintGlyphBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="SelectedUnfocused"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectionBackground" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectedBorder" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="DragStates"&gt; &lt;VisualStateGroup.Transitions&gt; &lt;VisualTransition To="NotDragging" GeneratedDuration="0:0:0.650" /&gt; &lt;/VisualStateGroup.Transitions&gt; &lt;VisualState x:Name="NotDragging" /&gt; &lt;VisualState x:Name="Dragging"&gt; &lt;Storyboard&gt; &lt;DoubleAnimation Storyboard.TargetName="InnerDragContent" Storyboard.TargetProperty="Opacity" Duration="0" To="{StaticResource ListViewItemDragOpacity}" /&gt; &lt;DragItemThemeAnimation TargetName="InnerDragContent" /&gt; &lt;FadeOutThemeAnimation TargetName="SelectedCheckMarkOuter" /&gt; &lt;FadeOutThemeAnimation TargetName="SelectedBorder" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="DraggingTarget"&gt; &lt;Storyboard&gt; &lt;DropTargetItemThemeAnimation TargetName="OuterContainer" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="MultipleDraggingPrimary"&gt; &lt;Storyboard&gt; &lt;!-- These two Opacity animations are required - the FadeInThemeAnimations on the same elements animate an internal Opacity. --&gt; &lt;DoubleAnimation Storyboard.TargetName="MultiArrangeOverlayBackground" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="MultiArrangeOverlayText" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /&gt; &lt;DoubleAnimation Storyboard.TargetName="InnerDragContent" Storyboard.TargetProperty="Opacity" Duration="0" To="{StaticResource ListViewItemDragOpacity}" /&gt; &lt;FadeInThemeAnimation TargetName="MultiArrangeOverlayBackground" /&gt; &lt;FadeInThemeAnimation TargetName="MultiArrangeOverlayText" /&gt; &lt;DragItemThemeAnimation TargetName="InnerDragContent" /&gt; &lt;FadeOutThemeAnimation TargetName="SelectedCheckMarkOuter" /&gt; &lt;FadeOutThemeAnimation TargetName="SelectedBorder" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="MultipleDraggingSecondary"&gt; &lt;Storyboard&gt; &lt;FadeOutThemeAnimation TargetName="ContentContainer" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="ReorderHintStates"&gt; &lt;VisualStateGroup.Transitions&gt; &lt;VisualTransition To="NoReorderHint" GeneratedDuration="0:0:0.65" /&gt; &lt;/VisualStateGroup.Transitions&gt; &lt;VisualState x:Name="NoReorderHint" /&gt; &lt;VisualState x:Name="BottomReorderHint"&gt; &lt;Storyboard&gt; &lt;DragOverThemeAnimation TargetName="ReorderHintContent" ToOffset="{StaticResource ListViewItemReorderHintOffset}" Direction="Bottom" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="TopReorderHint"&gt; &lt;Storyboard&gt; &lt;DragOverThemeAnimation TargetName="ReorderHintContent" ToOffset="{StaticResource ListViewItemReorderHintOffset}" Direction="Top" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="RightReorderHint"&gt; &lt;Storyboard&gt; &lt;DragOverThemeAnimation TargetName="ReorderHintContent" ToOffset="{StaticResource ListViewItemReorderHintOffset}" Direction="Right" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="LeftReorderHint"&gt; &lt;Storyboard&gt; &lt;DragOverThemeAnimation TargetName="ReorderHintContent" ToOffset="{StaticResource ListViewItemReorderHintOffset}" Direction="Left" /&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="DataVirtualizationStates"&gt; &lt;VisualState x:Name="DataAvailable" /&gt; &lt;VisualState x:Name="DataPlaceholder"&gt; &lt;Storyboard&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Visibility" Duration="0"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0"&gt; &lt;DiscreteObjectKeyFrame.Value&gt; &lt;Visibility&gt;Visible&lt;/Visibility&gt; &lt;/DiscreteObjectKeyFrame.Value&gt; &lt;/DiscreteObjectKeyFrame&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderRect" Storyboard.TargetProperty="Visibility" Duration="0"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0"&gt; &lt;DiscreteObjectKeyFrame.Value&gt; &lt;Visibility&gt;Visible&lt;/Visibility&gt; &lt;/DiscreteObjectKeyFrame.Value&gt; &lt;/DiscreteObjectKeyFrame&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;/VisualStateManager.VisualStateGroups&gt; &lt;Grid x:Name="ReorderHintContent" Background="Transparent"&gt; &lt;Path x:Name="SelectingGlyph" Opacity="0" Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemHighlightBrush}" Height="13" Stretch="Fill" Width="15" HorizontalAlignment="Right" Margin="0,5.5,5.5,0" VerticalAlignment="Top" /&gt; &lt;Border x:Name="ContentContainer"&gt; &lt;!-- This extra wrapper grid is necessary because rendertransforms set by the reorder hint animations will be lost when ContentContainer becomes a LTE --&gt; &lt;Grid x:Name="InnerDragContent"&gt; &lt;Border x:Name="HintGlyphBorder" Height="40" Width="40" HorizontalAlignment="Right" VerticalAlignment="Top" Opacity="0" Margin="4"&gt; &lt;Path x:Name="HintGlyph" Opacity="0" Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemCheckHintGlyphBrush}" Height="13" Stretch="Fill" Width="15" HorizontalAlignment="Right" Margin="0,5.5,5.5,0" VerticalAlignment="Top" /&gt; &lt;/Border&gt; &lt;Rectangle x:Name="PointerOverBorder" IsHitTestVisible="False" Opacity="0" Fill="{StaticResource ListViewItemPointerOverBrush}" Margin="1" /&gt; &lt;Rectangle x:Name="FocusVisual" IsHitTestVisible="False" Opacity="0" StrokeThickness="2" Stroke="{StaticResource ListViewItemKeyboardFocusBrush}" /&gt; &lt;Rectangle x:Name="SelectionBackground" Margin="4" Fill="{StaticResource ListViewItemHighlightBrush}" Opacity="0" /&gt; &lt;Border x:Name="ContentBorder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="4"&gt; &lt;Grid&gt; &lt;ContentPresenter x:Name="contentPresenter" ContentTransitions="{TemplateBinding ContentTransitions}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" /&gt; &lt;!-- The 'Xg' text simulates the amount of space one line of text will occupy. In the DataPlaceholder state, the Content is not loaded yet so we approximate the size of the item using placeholder text. --&gt; &lt;TextBlock x:Name="PlaceholderTextBlock" Visibility="Collapsed" Text="Xg" Foreground="{x:Null}" Margin="{TemplateBinding Padding}" IsHitTestVisible="False" /&gt; &lt;Rectangle x:Name="PlaceholderRect" Visibility="Collapsed" Fill="{StaticResource ListViewItemPlaceholderRectBrush}" IsHitTestVisible="False" /&gt; &lt;Rectangle x:Name="SelectedBorder" IsHitTestVisible="False" Opacity="0" Stroke="{StaticResource ListViewItemHighlightBrush}" StrokeThickness="{StaticResource GridViewItemSelectedBorderThickness}" /&gt; &lt;/Grid&gt; &lt;/Border&gt; &lt;Border x:Name="SelectedCheckMarkOuter" IsHitTestVisible="False" HorizontalAlignment="Right" VerticalAlignment="Top" Padding="{TemplateBinding BorderThickness}" Margin="4"&gt; &lt;Grid x:Name="SelectedCheckMark" Opacity="0" Height="40" Width="40"&gt; &lt;Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z" Fill="{StaticResource ListViewItemHighlightBrush}" Stretch="Fill" /&gt; &lt;Path Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="{StaticResource ListViewItemCheckGlyphBrush}" Height="13" Stretch="Fill" Width="15" HorizontalAlignment="Right" Margin="0,5.5,5.5,0" VerticalAlignment="Top" FlowDirection="LeftToRight" /&gt; &lt;/Grid&gt; &lt;/Border&gt; &lt;Rectangle x:Name="MultiArrangeOverlayBackground" IsHitTestVisible="False" Opacity="0" Fill="{StaticResource ListViewItemDragBackgroundBrush}" Margin="4" /&gt; &lt;TextBlock x:Name="MultiArrangeOverlayText" IsHitTestVisible="False" Opacity="0" Text="{Binding TemplateSettings.DragItemsCount, RelativeSource={RelativeSource Mode=TemplatedParent}}" TextWrapping="Wrap" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="4"&gt; &lt;TextBlock.Style&gt; &lt;Style TargetType="TextBlock"&gt; &lt;Setter Property="Foreground" Value="White" /&gt; &lt;Setter Property="FontSize" Value="56" /&gt; &lt;Setter Property="FontFamily" Value="{StaticResource ContentFontFamily}" /&gt; &lt;Setter Property="FontWeight" Value="Light" /&gt; &lt;Setter Property="HorizontalAlignment" Value="Left" /&gt; &lt;Setter Property="VerticalAlignment" Value="Bottom" /&gt; &lt;Setter Property="Margin" Value="12,0,0,0" /&gt; &lt;Setter Property="TextWrapping" Value="Wrap" /&gt; &lt;Setter Property="TextTrimming" Value="WordEllipsis" /&gt; &lt;/Style&gt; &lt;/TextBlock.Style&gt; &lt;/TextBlock&gt; &lt;/Grid&gt; &lt;/Border&gt; &lt;/Grid&gt; &lt;/Border&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;/GridView.ItemContainerStyle&gt; &lt;/GridView&gt; </code></pre> <p>Note that the default style of system controls changes between versions of the OS. The Windows 10 expanded (note that the platform renders the items with simplified visual tree by default to improve performance) style of the <code>GridViewItem</code> can be found in <code>"c:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.10240.0\Generic\themeresources.xaml"</code> (or some such place in the themeresources.xaml file) by searching for <code>TargetType="GridViewItem"</code>.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload