ToolTip のスタイルとテンプレートToolTip Styles and Templates

このトピックは、のスタイルとテンプレートについて説明します、ToolTipコントロール。This topic describes the styles and templates for the ToolTip control. 既定値を変更することができますControlTemplateコントロールの外観を一意にします。You can modify the default ControlTemplate to give the control a unique appearance. 詳細については、「ControlTemplate の作成による既存のコントロールの外観のカスタマイズ」を参照してください。For more information, see Customizing the Appearance of an Existing Control by Creating a ControlTemplate.

ツールヒントのパーツToolTip Parts

ToolTipコントロールには、その名前付きの部分はありません。The ToolTip control does not have any named parts.

ツール ヒントの状態ToolTip States

次の表に、用ビジュアル状態、ToolTipコントロール。The following table lists the visual states for the ToolTip control.

VisualState 名VisualState Name VisualStateGroup 名VisualStateGroup Name 説明Description
ClosedClosed OpenStatesOpenStates 既定の状態です。The default state.
開くOpen OpenStatesOpenStates ToolTipが表示されます。The ToolTip is visible.
有効Valid ValidationStatesValidationStates コントロールを使用して、ValidationクラスおよびHasError添付プロパティはfalseします。The control uses the Validation class and the HasError attached property is false.
InvalidFocusedInvalidFocused ValidationStatesValidationStates HasError添付プロパティはtrueがコントロールにフォーカスします。The HasError attached property is true has the control has focus.
InvalidUnfocusedInvalidUnfocused ValidationStatesValidationStates HasError添付プロパティはtrueがコントロールにフォーカスがないです。The HasError attached property is true has the control does not have focus.

ツールヒント ControlTemplate の例ToolTip ControlTemplate Example

次の例は、定義する方法を示します、ControlTemplateToolTipコントロール。The following example shows how to define a ControlTemplate for the ToolTip control.

<Style x:Key="{x:Type ToolTip}"
       TargetType="ToolTip">
  <Setter Property="OverridesDefaultStyle"
          Value="true" />
  <Setter Property="HasDropShadow"
          Value="True" />
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="ToolTip">
        <Border Name="Border"
                BorderThickness="1"
                Width="{TemplateBinding Width}"
                Height="{TemplateBinding Height}">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0"
                                 EndPoint="0,1">
              <LinearGradientBrush.GradientStops>
                <GradientStopCollection>
                  <GradientStop Color="{DynamicResource ControlLightColor}"
                                Offset="0.0" />
                  <GradientStop Color="{DynamicResource ControlMediumColor}"
                                Offset="1.0" />
                </GradientStopCollection>
              </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>

          </Border.Background>
          <Border.BorderBrush>
            <SolidColorBrush Color="{DynamicResource BorderMediumColor}" />
          </Border.BorderBrush>
          <ContentPresenter Margin="4"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top" />
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="HasDropShadow"
                   Value="true">
            <Setter TargetName="Border"
                    Property="CornerRadius"
                    Value="4" />
            <Setter TargetName="Border"
                    Property="SnapsToDevicePixels"
                    Value="true" />
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

前の例では、次のリソースの 1 つ以上を使用します。The preceding example uses one or more of the following resources.

<!--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>

完全なサンプルについては、Styling with ControlTemplates Sampleを参照してください。For the complete sample, see Styling with ControlTemplates Sample.

関連項目See Also

Style
ControlTemplate
コントロールのスタイルとテンプレートControl Styles and Templates
コントロールのカスタマイズControl Customization
スタイルとテンプレートStyling and Templating
ControlTemplate の作成による既存のコントロールの外観のカスタマイズCustomizing the Appearance of an Existing Control by Creating a ControlTemplate