Remove/Override Windows 8.1 通用应用中的 Gridview 样式

Question

我正在开发 Windows 8.1 通用应用程序。我的应用程序中有一个 gridview。当我 press/click gridview 中的一个项目时，我看到该项目带有动画或某种类似于我们 press/hold 在按钮上出现的样式的项目。附上示例图片。

我想从 gridview 项目中删除此样式。建议我实现这一目标的方法。

Answer 1

将其用作您的 GridViewItem 的样式，我在其中注释了悬停和按下事件时突出显示的代码。

<!-- Style for Windows.UI.Xaml.Controls.GridViewItem -->
<Style TargetType="GridViewItem" x:Key="GridViewItemExpanded">
  <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
  <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
  <Setter Property="Background" Value="Transparent"/>
  <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
  <Setter Property="TabNavigation" Value="Local"/>
  <Setter Property="IsHoldingEnabled" Value="True"/>
  <Setter Property="HorizontalContentAlignment" Value="Center"/>
  <Setter Property="VerticalContentAlignment" Value="Center"/>
  <Setter Property="Margin" Value="0,0,4,4"/>
  <Setter Property="MinWidth" Value="{ThemeResource GridViewItemMinWidth}"/>
  <Setter Property="MinHeight" Value="{ThemeResource GridViewItemMinHeight}"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="GridViewItem">
        <Grid x:Name="ContentBorder"
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}">
          <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
              <VisualState x:Name="Normal">
                <Storyboard>
                  <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="PointerOver">
                <Storyboard>
                  <DoubleAnimation Storyboard.TargetName="BorderRectangle"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListLowBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                  <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Pressed">
                <--<Storyboard>
                  <DoubleAnimation Storyboard.TargetName="BorderRectangle"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListMediumBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                  <PointerDownThemeAnimation TargetName="ContentPresenter" />
                </Storyboard>-->
              </VisualState>
              <VisualState x:Name="Selected">
                <Storyboard>
                  <DoubleAnimation Storyboard.TargetName="MultiSelectCheck"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <DoubleAnimation Storyboard.TargetName="BorderRectangle"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAccentBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MultiSelectSquare" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAccentBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="PointerOverSelected">
               <--<Storyboard>
                  <DoubleAnimation Storyboard.TargetName="MultiSelectCheck"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <DoubleAnimation Storyboard.TargetName="BorderRectangle"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListAccentMediumBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MultiSelectSquare" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAccentBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                </Storyboard>-->
              </VisualState>
              <VisualState x:Name="PressedSelected">
               <--<Storyboard>
                  <DoubleAnimation Storyboard.TargetName="MultiSelectCheck"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <DoubleAnimation Storyboard.TargetName="BorderRectangle"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListAccentHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Stroke">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MultiSelectSquare" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAccentBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <PointerDownThemeAnimation TargetName="ContentPresenter" />
                </Storyboard>-->
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="DisabledStates">
              <VisualState x:Name="Enabled"/>
              <VisualState x:Name="Disabled">
                <Storyboard>
                  <DoubleAnimation Storyboard.TargetName="ContentBorder"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="{ThemeResource ListViewItemDisabledThemeOpacity}"/>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="FocusStates">
              <VisualState x:Name="Unfocused"/>
              <VisualState x:Name="Focused">
                <Storyboard>
                  <DoubleAnimation Storyboard.TargetName="FocusVisualWhite"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                  <DoubleAnimation Storyboard.TargetName="FocusVisualBlack"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1"/>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="MultiSelectStates">
              <VisualState x:Name="MultiSelectDisabled">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MultiSelectSquare" Storyboard.TargetProperty="Visibility">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                    <DiscreteObjectKeyFrame KeyTime="0:0:0.333" Value="Collapsed" />
                  </ObjectAnimationUsingKeyFrames>
                  <FadeOutThemeAnimation TargetName="MultiSelectSquare"/>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="MultiSelectEnabled">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MultiSelectSquare" Storyboard.TargetProperty="Visibility">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                  </ObjectAnimationUsingKeyFrames>
                  <FadeInThemeAnimation TargetName="MultiSelectSquare"/>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="DataVirtualizationStates">
              <VisualState x:Name="DataAvailable"/>
              <VisualState x:Name="DataPlaceholder">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Visibility">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderRect" Storyboard.TargetProperty="Visibility">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                  </ObjectAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="ReorderHintStates">
              <VisualState x:Name="NoReorderHint"/>
              <VisualState x:Name="BottomReorderHint">
                <Storyboard>
                  <DragOverThemeAnimation TargetName="ContentBorder" ToOffset="{ThemeResource GridViewItemReorderHintThemeOffset}" Direction="Bottom" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="TopReorderHint">
                <Storyboard>
                  <DragOverThemeAnimation TargetName="ContentBorder" ToOffset="{ThemeResource GridViewItemReorderHintThemeOffset}" Direction="Top" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="RightReorderHint">
                <Storyboard>
                  <DragOverThemeAnimation TargetName="ContentBorder" ToOffset="{ThemeResource GridViewItemReorderHintThemeOffset}" Direction="Right" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="LeftReorderHint">
                <Storyboard>
                  <DragOverThemeAnimation TargetName="ContentBorder" ToOffset="{ThemeResource GridViewItemReorderHintThemeOffset}" Direction="Left" />
                </Storyboard>
              </VisualState>
              <VisualStateGroup.Transitions>
                <VisualTransition To="NoReorderHint" GeneratedDuration="0:0:0.2"/>
              </VisualStateGroup.Transitions>
            </VisualStateGroup>
            <VisualStateGroup x:Name="DragStates">
              <VisualState x:Name="NotDragging" />
              <VisualState x:Name="Dragging">
                <Storyboard>
                  <DoubleAnimation Storyboard.TargetName="ContentBorder"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="{ThemeResource ListViewItemDragThemeOpacity}" />
                  <DragItemThemeAnimation TargetName="ContentBorder" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="DraggingTarget">
                <Storyboard>
                  <DropTargetItemThemeAnimation TargetName="ContentBorder" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="MultipleDraggingPrimary">
                <Storyboard>
                  <!-- These two Opacity animations are required - the FadeInThemeAnimations
                                           on the same elements animate an internal Opacity. -->
                  <DoubleAnimation Storyboard.TargetName="MultiArrangeOverlayBackground"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1" />
                  <DoubleAnimation Storyboard.TargetName="MultiArrangeOverlayText"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="1" />
                  <DoubleAnimation Storyboard.TargetName="ContentBorder"
                                   Storyboard.TargetProperty="Opacity"
                                   Duration="0"
                                   To="{ThemeResource ListViewItemDragThemeOpacity}" />
                  <FadeInThemeAnimation TargetName="MultiArrangeOverlayBackground" />
                  <FadeInThemeAnimation TargetName="MultiArrangeOverlayText" />
                  <DragItemThemeAnimation TargetName="ContentBorder" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="MultipleDraggingSecondary">
                <Storyboard>
                  <FadeOutThemeAnimation TargetName="ContentBorder" />
                </Storyboard>
              </VisualState>
              <VisualState x:Name="DraggedPlaceholder">
                <Storyboard>
                  <FadeOutThemeAnimation TargetName="ContentBorder" />
                </Storyboard>
              </VisualState>
              <VisualStateGroup.Transitions>
                <VisualTransition To="NotDragging" GeneratedDuration="0:0:0.2"/>
              </VisualStateGroup.Transitions>
            </VisualStateGroup>
          </VisualStateManager.VisualStateGroups>
          <ContentPresenter x:Name="ContentPresenter"
                            ContentTransitions="{TemplateBinding ContentTransitions}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Margin="{TemplateBinding Padding}" />
          <!-- 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. -->
          <TextBlock x:Name="PlaceholderTextBlock"
                      Visibility="Collapsed"
                      Text="Xg"
                      Foreground="{x:Null}"
                      Margin="{TemplateBinding Padding}"
                      IsHitTestVisible="False"
                      AutomationProperties.AccessibilityView="Raw"/>
          <Rectangle x:Name="PlaceholderRect"
                      Visibility="Collapsed"
                      Fill="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"/>
          <Rectangle x:Name="MultiArrangeOverlayBackground"
                      IsHitTestVisible="False"
                      Opacity="0"
                      Fill="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
                      Grid.ColumnSpan="2"/>
          <Rectangle x:Name="BorderRectangle"
                      IsHitTestVisible="False"
                      Stroke="{ThemeResource SystemControlHighlightListAccentLowBrush}"
                      StrokeThickness="2"
                      Opacity="0"/>
          <Border x:Name="MultiSelectSquare"
                  Background="{ThemeResource SystemControlBackgroundChromeMediumBrush}"
                  Width="20"
                  Height="20"
                  Margin="0,2,2,0"
                  VerticalAlignment="Top"
                  HorizontalAlignment="Right"
                  Visibility="Collapsed" >
            <FontIcon x:Name="MultiSelectCheck"
                      FontFamily="{ThemeResource SymbolThemeFontFamily}"
                      Glyph="&#xE73E;"
                      FontSize="16"
                      Foreground="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                      Opacity="0"/>
          </Border>
          <Rectangle x:Name="FocusVisualWhite"
                      IsHitTestVisible="False"
                      Stroke="{ThemeResource SystemControlForegroundAltHighBrush}"
                      StrokeEndLineCap="Square"
                      StrokeDashArray="1.0, 1.0"
                      StrokeDashOffset="1.5"
                      StrokeThickness="2"
                      Opacity="0"/>
          <Rectangle x:Name="FocusVisualBlack"
                      IsHitTestVisible="False"
                      Stroke="{ThemeResource SystemControlForegroundBaseHighBrush}"
                      StrokeEndLineCap="Square"
                      StrokeDashArray="1.0, 1.0"
                      StrokeDashOffset="0.5"
                      StrokeThickness="2"
                      Opacity="0"/>
          <TextBlock x:Name="MultiArrangeOverlayText"
                      Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DragItemsCount}"
                      Foreground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
                      FontFamily="{ThemeResource ContentControlThemeFontFamily}"
                      FontSize="26.667"
                      IsHitTestVisible="False"
                      Opacity="0"
                      TextWrapping="Wrap"
                      TextTrimming="WordEllipsis"
                      Margin="18,9,0,0"
                      AutomationProperties.AccessibilityView="Raw"
                      Grid.ColumnSpan="2"/>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Remove/Override Windows 8.1 通用应用中的 Gridview 样式

Remove/Override Gridview Style in Windows 8.1 Universal app

xaml

gridview

windows-8.1-universal