8

つまり、私たちが設計している新しいボタンの外観の最も基本的なものを定義するメインの ControlTemplate があるということです。しかし、このボタンに別の 3 つのコントロール テンプレートを作成して、それらに異なる色を設定できるようにしたいと考えています。ただし、メインの ControlTemplate をコピーして貼り付けて色を変更したくはありません。代わりに、そこから「継承」して (Style の BasedOn プロパティのように)、継承された ControlTemplate の色を変更します。

これは可能ですか？

ありがとう！

4

2 に答える 2

6

解決策を見つけました。ControlTemplates を拡張するのではなく、必要なすべての基本的な動作を定義してから、スタイルまたはコントロール自体にそれを変更させます。たとえば、以下の例を見てください。ControlTemplate は OpacityMask と四角形の丸い角を設定し、Styles は各ボタンの背景色を設定します (TemplateBinding の助けを借りて)。私の解決策は次のとおりです。

    <Window.Resources>
        <ControlTemplate x:Key="BaseMainButtonTemplate" TargetType="{x:Type Button}">
            <Grid TextBlock.Foreground="White" TextBlock.FontFamily="Calibri">
                <Rectangle Stroke="#FFE8E6E6" x:Name="rectangle" RadiusX="14.5" RadiusY="14.5" Fill="{TemplateBinding Property=Background}"> <!-- This TemplateBinding takes the color set by the style and applies it to the rectangle. Doing it this way, allows the style to modify the background color -->
                    <Rectangle.OpacityMask>
                        <LinearGradientBrush EndPoint="0,1" SpreadMethod="Reflect">
                            <GradientStop Offset="0" Color="Transparent"></GradientStop>
                            <GradientStop Offset="1" Color="Gray"></GradientStop>
                        </LinearGradientBrush>
                    </Rectangle.OpacityMask>
                </Rectangle>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/>
            </Grid>
            <ControlTemplate.Triggers>
                <!-- OpacityMask when it's Focused, Defaulted and Mouse is over -->
                <Trigger Property="IsFocused" Value="True"/>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="OpacityMask" TargetName="rectangle">
                        <Setter.Value>
                            <LinearGradientBrush EndPoint="0,1" SpreadMethod="Repeat">
                                <GradientStop Offset="1" Color="Transparent"></GradientStop>
                                <GradientStop Offset="0" Color="Gray"></GradientStop>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                </Trigger>
                <!-- OpacityMask when it's pressed -->
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Stroke" TargetName="rectangle">
                        <Setter.Value>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF223472" Offset="0"/>
                                <GradientStop Color="#FFF2F0F0" Offset="0.911"/>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="StrokeThickness" TargetName="rectangle" Value="3"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
        <Style x:Key="BlueButtonStyle" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Blue" />
            <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}">
            </Setter>
        </Style>
        <Style x:Key="RedButtonStyle" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Red" />
            <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}">
            </Setter>
        </Style>
        <Style x:Key="GreenButtonStyle" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Green" />
            <Setter Property="Template" Value="{StaticResource BaseMainButtonTemplate}">
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <StackPanel>
            <Button Style="{StaticResource BlueButtonStyle}" Height="30" Content="Test">
            </Button>
            <Button Style="{StaticResource RedButtonStyle}" Height="30" Content="Test">
            </Button>
            <Button Style="{StaticResource GreenButtonStyle}" Height="30" Content="Test">
            </Button>
        </StackPanel>
    </Grid>
于 2009-10-09T21:44:02.983 に答える
0

別の方法として、コントロール テンプレート内の任意の依存関係プロパティへの "DynamicResource" 参照を定義し、利用可能なリソースが存在する場合にその値を解決することもできます。たとえば、Background="{DynamicResource SomeBrushColorVariable}" を設定すると、App.xaml ファイルにマージされたさまざまな ResourceDictionaries を指定して SomeBrushColorVariable を変更したり、ユーザー設定の表示設定や配色を指定してユーザーが設定したりすることができます。

于 2016-09-01T18:02:34.143 に答える