次の方法で共有


ProgressBar ControlTemplate の例

更新 : 2007 年 11 月

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

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

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

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

必要条件

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

ProgressBar ControlTemplate の例

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

<Style x:Key="{x:Type ProgressBar}"
     TargetType="{x:Type ProgressBar}">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type ProgressBar}">
        <Grid MinHeight="14" MinWidth="200">
          <Border 
            Name="PART_Track" 
            CornerRadius="2" 
            Background="{StaticResource PressedBrush}"
            BorderBrush="{StaticResource SolidBorderBrush}"
            BorderThickness="1" />
          <Border 
            Name="PART_Indicator" 
            CornerRadius="2" 
            Background="{StaticResource DarkBrush}" 
            BorderBrush="{StaticResource NormalBorderBrush}" 
            BorderThickness="1" 
            HorizontalAlignment="Left" />
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

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

<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="SolidBorderBrush" Color="#888" />


...


<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="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>

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

参照

概念

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

その他の技術情報

ControlTemplate の例