Question

我想创建一个带有自定义标题的GroupBox，除了标题标题之外，我想要一个与某个MVVM绑定相关联的图标。

例如，我使用这种方法工作：

查看：

<GroupBox>
    <GroupBox.Header>
        <StackPanel Orientation="Horizontal">
            <Image Height="18" VerticalAlignment="Center" Source="{Binding BondHead2Enabled, Converter={StaticResource StateToIconConverter}}" />
            <Label Content="Bond Head 2"/>
        </StackPanel>
    </GroupBox.Header>
    <finalBondView:BondheadTemplateView Content="{Binding BondHead2Content}"/>
</GroupBox>

视图模型

public bool BondHead2Enabled => false;

public BondHeadTemplateViewModel BondHead2Content
{
    get { return _bondheadContents[1]; }
    set
    {
        if (_bondheadContents[1] != value && value != null)
        {
            _bondheadContents[1] = value;
            RaisePropertyChanged("BondHead2Content");
        }
    }
}

然而，通过这种方法，我必须在每个groupbox上重复很多代码。所以我想把它变成一个标题模板，我可以只关联一个样式而不是复制粘贴标题。因此我创造了这种风格：

风格

<Style x:Key="StatusGroupBox" TargetType="{x:Type GroupBox}">
    <Setter Property="HeaderTemplate">
        <Setter.Value>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Height="18" VerticalAlignment="Center" Source="{Binding EnabledStatus, RelativeSource={RelativeSource AncestorType=GroupBox}, Converter={StaticResource StateToIconConverter}}" />
                    <Label Content="{Binding Header, RelativeSource={RelativeSource AncestorType=GroupBox}}"/>
                </StackPanel>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

视图模型

<GroupBox Header="Bond Head 3" Margin="5" Style="{DynamicResource StatusGroupBox}">
    <finalBondView:BondheadTemplateView Content="{Binding BondHead3Content}"/>
</GroupBox>

我可以使用此样式获取标签的内容，但我无法获取布尔值，我需要知道要显示哪个图标，在样式中命名为 EnabledStatus 。那么我怎么能以通用的方式将这些信息传递给te风格呢？

Answer 1

我认为您必须更改样式中布尔值的绑定：

Source="{Binding DataContext.EnabledStatus, RelativeSource={RelativeSource AncestorType=GroupBox}, Converter={StaticResource StateToIconConverter}}"

这是因为EnabledStatus不是Groupbox本身的属性，而是它的DataContext的属性。

Answer 2

在阅读了有关推荐主题的更多内容后，我发现了一种有效的方法。我没有将一个String绑定到Header属性，而是使用Title（字符串）和status（boolean）绑定了一个结构。然后我读了风格中的每个字段。代码：

支持班级

public class StatusHeaderTemplate
{
    public string HeaderTitle { get; set; }
    public bool HeaderStatus { get; set; }

    public StatusHeaderTemplate(string title, bool status)
    {
        HeaderTitle = title;
        HeaderStatus = status;
    }
}

<强>风格

<Style x:Key="MountainTopStatusGroupBox" TargetType="{x:Type GroupBox}">
    <Setter Property="HeaderTemplate">
        <Setter.Value>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Source="{Binding HeaderStatus, Converter={StaticResource StateToIconConverter}}" />
                    <Label Content="{Binding HeaderTitle}"/>
                </StackPanel>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

查看

<GroupBox Margin="5" Header="{Binding BondHead1StatusHeader}" Style="{DynamicResource MountainTopStatusGroupBox}"> <finalBondView:BondheadTemplateView Content="{Binding BondHead1Content}"/> </GroupBox>

<强>视图模型

public StatusHeaderTemplate BondHead1StatusHeader => new StatusHeaderTemplate("Bond Head 1", true);

将GroupBox HeaderTemplate与MVVM绑定

2 个答案: