使用ivalueconverter进行模板键入

Question

我想在WPF项目中生成一个自定义按钮。我希望按钮以这种方式更改其背景颜色，以减少不透明度。

因此，我有一个带有默认按钮样式的资源词典：

<Style x:Key="DefaultStyle" TargetType="{x:Type Button}">
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{Binding Path=Background, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource OpacityConverter}}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="GreenButton" TargetType="{x:Type Button}" BasedOn="{StaticResource DefaultStyle}">
        <Setter Property="Background" Value="{StaticResource Green}"/>
        <Setter Property="Foreground" Value="Black"/>
</Style>

使用我的自定义转换器：

<conv:OpacityConverter x:Key="OpacityConverter"/>

在 xmlns中实现：cons =“ clr-namespace：projectNamespace.converter”：

public class OpacityConverter : IValueConverter
{

    public OpacityConverter()
    {

    }

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        SolidColorBrush brush = ((SolidColorBrush)value).Clone();
        brush.Opacity = 0.5;
        return brush;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        SolidColorBrush brush = ((SolidColorBrush)value).Clone();
        brush.Opacity = 1;
        return brush;
    }
}

在我的窗口中，我使用了这样的按钮：

<Button Grid.Row="1" Grid.Column="2" 
        Style="{StaticResource GreenButton}">
   <TextBlock Text="neues Projekt anlegen" TextWrapping="Wrap" TextAlignment="Center"/>
</Button>

按钮看起来像这样：

我想让这样的外观（如果Ismouseover == true）：

但是，此刻，使用ismouseover = = true启动，背景完全白色，按钮看起来像这样：

“ https://i.sstatic.net/a8fes.png” alt =“在此处输入图像说明”>

我缺少什么？

Answer 1

由于您尚未为触发器中的设置器指定targetName，因此它隐含地涉及该按钮并导致圆形引用。要修复它，请命名边框并在setter中指定该名称。

<ControlTemplate TargetType="Button">
    <Border x:Name="border"
            Background="{TemplateBinding Background}">
        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="border"
                    Property="Background"
                    Value="{Binding Background, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource OpacityConverter}}"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>