Bagikan melalui

Gaya dan Template ContextMenu

  • Artikel

Topik ini menjelaskan gaya dan templat untuk ContextMenu kontrol. Anda dapat memodifikasi default ControlTemplate untuk memberi kontrol tampilan yang unik. Untuk informasi selengkapnya, lihat Membuat templat untuk kontrol.

Bagian ContextMenu

Kontrol ContextMenu tidak memiliki bagian bernama.

Saat Anda membuat ControlTemplate untuk ContextMenu, templat Anda mungkin berisi ItemsPresenter dalam ScrollViewer. (Menampilkan ItemsPresenter setiap item di ContextMenu; mengaktifkan ScrollViewer pengguliran dalam kontrol). ItemsPresenter Jika bukan anak langsung dari ScrollViewer, Anda harus memberikan ItemsPresenter nama, ItemsPresenter.

Status ContextMenu

Tabel berikut mencantumkan status visual untuk ContextMenu kontrol.

Nama VisualState Nama VisualStateGroup Deskripsi
Valid ValidationStates Kontrol menggunakan Validation kelas dan properti terlampir Validation.HasError adalah false.
InvalidFocused ValidationStates Properti Validation.HasError terlampir memiliki true kontrol memiliki fokus.
Tidak validUnfocused ValidationStates Properti Validation.HasError terlampir memiliki true kontrol tidak memiliki fokus.

Contoh ContextMenu ControlTemplate

Contoh berikut menunjukkan cara menentukan ControlTemplate untuk ContextMenu kontrol.

<Style TargetType="{x:Type ContextMenu}">
  <Setter Property="SnapsToDevicePixels"
          Value="True" />
  <Setter Property="OverridesDefaultStyle"
          Value="True" />
  <Setter Property="Grid.IsSharedSizeScope"
          Value="true" />
  <Setter Property="HasDropShadow"
          Value="True" />
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type ContextMenu}">
        <Border x:Name="Border"
                Background="{StaticResource MenuPopupBrush}"
                BorderThickness="1">
          <Border.BorderBrush>
            <SolidColorBrush Color="{StaticResource BorderMediumColor}" />
          </Border.BorderBrush>
          <StackPanel IsItemsHost="True"
                      KeyboardNavigation.DirectionalNavigation="Cycle" />
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="HasDropShadow"
                   Value="true">
            <Setter TargetName="Border"
                    Property="Padding"
                    Value="0,3,0,3" />
            <Setter TargetName="Border"
                    Property="CornerRadius"
                    Value="4" />
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

menggunakan ControlTemplate sumber daya berikut.

<!--Control colors.-->
<Color x:Key="WindowColor">#FFE8EDF9</Color>
<Color x:Key="ContentAreaColorLight">#FFC5CBF9</Color>
<Color x:Key="ContentAreaColorDark">#FF7381F9</Color>

<Color x:Key="DisabledControlLightColor">#FFE8EDF9</Color>
<Color x:Key="DisabledControlDarkColor">#FFC5CBF9</Color>
<Color x:Key="DisabledForegroundColor">#FF888888</Color>

<Color x:Key="SelectedBackgroundColor">#FFC5CBF9</Color>
<Color x:Key="SelectedUnfocusedColor">#FFDDDDDD</Color>

<Color x:Key="ControlLightColor">White</Color>
<Color x:Key="ControlMediumColor">#FF7381F9</Color>
<Color x:Key="ControlDarkColor">#FF211AA9</Color>

<Color x:Key="ControlMouseOverColor">#FF3843C4</Color>
<Color x:Key="ControlPressedColor">#FF211AA9</Color>


<Color x:Key="GlyphColor">#FF444444</Color>
<Color x:Key="GlyphMouseOver">sc#1, 0.004391443, 0.002428215, 0.242281124</Color>

<!--Border colors-->
<Color x:Key="BorderLightColor">#FFCCCCCC</Color>
<Color x:Key="BorderMediumColor">#FF888888</Color>
<Color x:Key="BorderDarkColor">#FF444444</Color>

<Color x:Key="PressedBorderLightColor">#FF888888</Color>
<Color x:Key="PressedBorderDarkColor">#FF444444</Color>

<Color x:Key="DisabledBorderLightColor">#FFAAAAAA</Color>
<Color x:Key="DisabledBorderDarkColor">#FF888888</Color>

<Color x:Key="DefaultBorderBrushDarkColor">Black</Color>

<!--Control-specific resources.-->
<Color x:Key="HeaderTopColor">#FFC5CBF9</Color>
<Color x:Key="DatagridCurrentCellBorderColor">Black</Color>
<Color x:Key="SliderTrackDarkColor">#FFC5CBF9</Color>

<Color x:Key="NavButtonFrameColor">#FF3843C4</Color>

<LinearGradientBrush x:Key="MenuPopupBrush"
                     EndPoint="0.5,1"
                     StartPoint="0.5,0">
  <GradientStop Color="{DynamicResource ControlLightColor}"
                Offset="0" />
  <GradientStop Color="{DynamicResource ControlMediumColor}"
                Offset="0.5" />
  <GradientStop Color="{DynamicResource ControlLightColor}"
                Offset="1" />
</LinearGradientBrush>

<LinearGradientBrush x:Key="ProgressBarIndicatorAnimatedFill"
                     StartPoint="0,0"
                     EndPoint="1,0">
  <LinearGradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#000000FF"
                    Offset="0" />
      <GradientStop Color="#600000FF"
                    Offset="0.4" />
      <GradientStop Color="#600000FF"
                    Offset="0.6" />
      <GradientStop Color="#000000FF"
                    Offset="1" />
    </GradientStopCollection>
  </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

Untuk sampel lengkapnya, lihat Menata dengan Sampel ControlTemplates.

Baca juga