Question

我有如下资源字典，

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:uwpControls="using:Microsoft.Toolkit.Uwp.UI.Controls"
    xmlns:controls="using:Presentation.Common.Controls">
<Style x:Key="ExpanderStyleSection" TargetType="uwpControls:Expander">
        <Setter Property="HeaderStyle" Value="{StaticResource LightExpanderHeaderToggleButtonStyle}"/>
        <Setter Property="Margin" Value="4"/>
    </Style>
 <Style x:Key="LightExpanderHeaderToggleButtonStyle" TargetType="ToggleButton">
 <Setter Property="Template">
 <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Grid x:Name="RootGrid" 
                                  Background="{StaticResource BrushBeckmanAquaA1}"> <!-- I want to change the background from an other View based on some condition -->
</ControlTemplate>
</Style>
</ResourceDictionary>

现在我在另一个视图中使用该词典中的样式。

<uwpControls:Expander x:Name="ExpanderLisSharedSettings" Grid.Row="0" Style="{StaticResource ExpanderStyleSection}">
<!--Some Content here-->
</uwpControls:Expander

每当ViewModel中的属性更改时，我都想将ControlTemplate中的RootGrid背景更新为其他颜色。我该怎么做？换句话说，有一种方法可以创建类型为Brush color的依赖项属性，并绑定到ResourceDictionary中的RootGrid背景。请帮忙。

Answer 1

您可以创建一个包含SolidColorBrush属性的ViewModel并将其与RootGrid的Background绑定，并且需要在使用此样式的页面中声明DataContext。在这种情况下，它适用于绑定。

如果要在ResourceDictionary中使用 x：bind ，则需要为其创建一个类后面的代码。由于x：Bind取决于代码生成，因此它需要一个代码隐藏文件，其中包含一个构造函数，该构造函数调用InitializeComponent（以初始化生成的代码）。

这里我们以绑定为例。

Page.xaml：

<ToggleButton Style="{StaticResource LightExpanderHeaderToggleButtonStyle}"></ToggleButton>

Page.xaml.cs：

public BlankPage1()
{
    this.InitializeComponent();
    VM = new MyViewModel();
    VM.Fname = "fleegu";
    VM.MyColor = new SolidColorBrush(Colors.Green);
    this.DataContext = VM;
}
public MyViewModel VM { get; set; }

ResourceDictionary.xaml：

<Style x:Key="LightExpanderHeaderToggleButtonStyle" TargetType="ToggleButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Grid x:Name="RootGrid" Background="{Binding MyColor}">
                    <TextBlock Text="{Binding Fname}"></TextBlock>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

MyViewModel：

public class MyViewModel: INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged = delegate { };

    private string _fname { get; set; }
    private SolidColorBrush myColor { get; set; }

    public string Fname
    {
        get { return _fname; }
        set
        {
            _fname = value;
            this.OnPropertyChanged();
        }
    }

    public SolidColorBrush MyColor
    {
        get { return myColor; }
        set
        {
            myColor = value;
            this.OnPropertyChanged();
        }
    }

    public void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }
}

Answer 2

在模板中使用TemplateBinding。您可以使用<Setter>来定义默认值：

<Style x:Key="LightExpanderHeaderToggleButtonStyle" TargetType="ToggleButton">
    <Setter Property="Background" Value="{StaticResource BrushBeckmanAquaA1}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Grid x:Name="RootGrid" Background="{TemplateBinding Background}">
                    ...
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后您可以设置或绑定控件的每个实例的Background：

<uwpControls:Expander x:Name="ExpanderLisSharedSettings" Grid.Row="0" Background="Red" />

例如，如果视图模型定义了一个名为“ TheBackground”的Brush属性，则可以照常绑定到它（仅UWP支持{x:Bind}）：

<uwpControls:Expander x:Name="ExpanderLisSharedSettings" Grid.Row="0" 
                      Background="{Binding TheBackground}" />

ResourceDictionary控制模板中的模板绑定

2 个答案: