次の方法で共有

TextBox ControlTemplate の例

  • [アーティクル]

更新 : 2007 年 11 月

Windows Presentation Foundation (WPF) のコントロールには、そのコントロールのビジュアル ツリーを含む ControlTemplate があります。コントロールの構造や外観を変更するには、そのコントロールの ControlTemplate を変更します。コントロールのビジュアル ツリーの一部だけを置き換えることはできません。コントロールのビジュアル ツリーを変更するには、コントロールの Template プロパティをその新しい完全な ControlTemplate に設定する必要があります。

このトピックでは、WPFTextBox コントロールの ControlTemplate を示します。

ms752068.alert_caution(ja-jp,VS.90).gif重要 :

TextBox の ControlTemplate には、コンテンツ ホスト要素であることが示された要素を 1 つだけ含める必要があります。この要素は、TextBox のコンテンツの描画に使用されます。要素がコンテンツ ホストであることを示すには、その要素に特別な名前 PART_ContentHost を付けます。コンテンツ ホスト要素は、ScrollViewer または AdornerDecorator でなければなりません。コンテンツ ホスト要素で子要素をホストすることはできません。

このトピックには次のセクションが含まれています。

  • 必要条件
  • TextBox ControlTemplate の例
  • 関連トピック

必要条件

このトピックの例を実行するには、WPF アプリケーションの作成方法を理解する必要があります。詳細については、「Windows Presentation Foundation の概要」を参照してください。また、WPF でスタイルがどのように使用されるかについても理解しておく必要があります。詳細については、「スタイルとテンプレート」を参照してください。

TextBox ControlTemplate の例

この例には TextBox の ControlTemplate に既定で定義されるすべての要素が含まれていますが、各値は単なる例と考えてください。

<Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBoxBase}">
  <Setter Property="SnapsToDevicePixels" Value="True"/>
  <Setter Property="OverridesDefaultStyle" Value="True"/>
  <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
  <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
  <Setter Property="MinWidth" Value="120"/>
  <Setter Property="MinHeight" Value="20"/>
  <Setter Property="AllowDrop" Value="true"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type TextBoxBase}">
        <Border 
          Name="Border"
          CornerRadius="2" 
          Padding="2"
          Background="{StaticResource WindowBackgroundBrush}"
          BorderBrush="{StaticResource SolidBorderBrush}"
          BorderThickness="1" >
          <ScrollViewer Margin="0" x:Name="PART_ContentHost"/>
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}"/>
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBackgroundBrush}"/>
            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

<!-- SimpleStyles: RichTextBox -->

<Style x:Key="{x:Type RichTextBox}"
     BasedOn="{StaticResource {x:Type TextBox}}"
     TargetType="{x:Type RichTextBox}">
  <Style.Resources>
    <Style x:Key="{x:Type FlowDocument}"
         TargetType="{x:Type FlowDocument}">
      <Setter Property="OverridesDefaultStyle"
          Value="true"/>
    </Style>
  </Style.Resources>
</Style>

<!-- SimpleStyles: PasswordBox -->

<Style x:Key="{x:Type PasswordBox}" TargetType="{x:Type PasswordBox}">
  <Setter Property="SnapsToDevicePixels" Value="true"/>
  <Setter Property="OverridesDefaultStyle" Value="true"/>
  <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
  <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
  <Setter Property="FontFamily" Value="Verdana"/>
  <Setter Property="PasswordChar" Value="●"/>
  <Setter Property="MinWidth" Value="120"/>
  <Setter Property="MinHeight" Value="20"/>
  <Setter Property="AllowDrop" Value="true"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type PasswordBox}">
        <Border 
          Name="Border"
          CornerRadius="2" 
          Padding="2" 
          Background="{StaticResource WindowBackgroundBrush}"
          BorderBrush="{StaticResource SolidBorderBrush}"
          BorderThickness="1" >
          <ScrollViewer x:Name="PART_ContentHost" />
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}"/>
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBackgroundBrush}"/>
            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

前の例では、次の 1 つ以上のリソースを使用しています。

<!-- Fill Brushes -->

<LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#CCC" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="HorizontalNormalBrush" StartPoint="0,0" EndPoint="1,0">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#CCC" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="LightBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#EEE" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="HorizontalLightBrush" StartPoint="0,0" EndPoint="1,0">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#EEE" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="DarkBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#AAA" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="PressedBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#BBB" Offset="0.0"/>
      <GradientStop Color="#EEE" Offset="0.1"/>
      <GradientStop Color="#EEE" Offset="0.9"/>
      <GradientStop Color="#FFF" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />

<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="#EEE" />

<SolidColorBrush x:Key="WindowBackgroundBrush" Color="#FFF" />

<SolidColorBrush x:Key="SelectedBackgroundBrush" Color="#DDD" />

<!-- Border Brushes -->

<LinearGradientBrush x:Key="NormalBorderBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#CCC" Offset="0.0"/>
      <GradientStop Color="#444" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="HorizontalNormalBorderBrush" StartPoint="0,0" EndPoint="1,0">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#CCC" Offset="0.0"/>
      <GradientStop Color="#444" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="DefaultedBorderBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#777" Offset="0.0"/>
      <GradientStop Color="#000" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="PressedBorderBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#444" Offset="0.0"/>
      <GradientStop Color="#888" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

<SolidColorBrush x:Key="DisabledBorderBrush" Color="#AAA" />

<SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />

<SolidColorBrush x:Key="LightBorderBrush" Color="#AAA" />

<!-- Miscellaneous Brushes -->
<SolidColorBrush x:Key="GlyphBrush" Color="#444" />

<SolidColorBrush x:Key="LightColorBrush" Color="#DDD" />

サンプル全体については、「ControlTemplate を使用したスタイル設定のサンプル」を参照してください。

参照

概念

スタイルの設定が可能なコントロールを設計するためのガイドライン

その他の技術情報

ControlTemplate の例