c# - 将数据模板和样式放置到生成的按钮上

我该怎么办
我将在放置SubMenuButton的页面的 View 模型中的代码后面生成的ItemControl上添加一些ItemControl s(以下代码)。我尝试了2种解决方案，并给了我2种不同的结果。

我尝试过的第一种解决方案
代码
这是我上的课:

public class SubMenuButton : Button
{
    public Page TargetPage { get; set; }
    public FontAwesomeIcon Icon { get; set; }
    public string Text { get; set; }

    public SubMenuButton()
    {
        Style = App.Current.FindResource("submenuButtonStyle") as Style;
        // comment line above for 2nd solution I've tried
    }

    public SubMenuButton(string text, Page targetPage, ICommand command,
                                                            FontAwesomeIcon icon) : this()
    {
        Icon = icon;
        Text = text;
        TargetPage = targetPage;
        CommandParameter = targetPage;
        Command = command;
    }
}

对于这个类，我还制作了一个Style来显示图标和文本以及ser和一些属性，以使其变得更好。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
                    xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
                    xmlns:fa="http://schemas.fontawesome.io/icons/"
                    xmlns:uie="clr-namespace:Provar2.Client.DesktopApp.UIElements">

    <Style x:Key="transparantButtonStyle" TargetType="{x:Type Button}">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="{x:Null}"/>
        <Setter Property="Width" Value="auto"/>
        <Setter Property="Height" Value="auto"/>
        <Setter Property="Margin" Value="0,5"/>
        <Setter Property="Width" Value="auto"/>
        <Setter Property="VerticalAlignment" Value="Top"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="FontWeight" Value="Bold"/>
        <Setter Property="Cursor" Value="Hand"/>
    </Style>

    <Style x:Key="submenuButtonStyle" BasedOn="{StaticResource transparantButtonStyle}"
           TargetType="{x:Type uie:SubMenuButton}">

        <Setter Property="CommandParameter" Value="{Binding TargetPage}" />

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type uie:SubMenuButton}">
                    <Canvas Height="auto">
                        <fa:FontAwesome Icon="{Binding Icon}" Width="30" Height="30"/>
                        <TextBlock Text="{Binding Text}"/>
                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="White" />
                <Setter Property="Foreground" Value="Black" />
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>

这是必须生成SubMenuButton的地方

<ItemsControl Grid.Column="0" Grid.Row="1" VerticalAlignment="Stretch"
              HorizontalAlignment="Stretch" Background="Gray"
              ItemsSource="{Binding SubMenuItems}" />

结果
但是对于这个解决方案，我有一个异常(exception):


我尝试过的第二种解决方案
代码
我还尝试将属性ItemTemplate添加到我的ItemsControl中。

<ItemsControl ItemTemplate="{StaticResource submenuButtonTemplate}" Grid.Column="0"
              Grid.Row="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
              Background="Green" ItemsSource="{Binding SubMenuItems}" />

我还在SubMenuButton的空构造函数中的代码中注释了几行。
并添加此数据模板

<DataTemplate x:Key="submenuButtonTemplate" DataType="{x:Type scr:SubMenuButton}">
    <Canvas Height="auto">
        <fa:FontAwesome Icon="{Binding Icon}" Width="30" Height="30"/>
        <TextBlock Text="{Binding Text}"/>
    </Canvas>
</DataTemplate>

结果
现在，我没有异常(exception)，但是我知道了:

绿色矩形是我的ItemTemplate，我用黄色笔圈了2个SubMenuButton(因为我生成了2个SubMenuButton)。

问题
你能解决我的问题吗？

最佳答案

TextBlock尝试从DataContext获得Text属性，而TextContext没有它。添加RelativeSource参数以指出Text属于uie:SubMenuButton

<TextBlock Text="{Binding Text, RelativeSource={RelativeSource AncestorType=uie:SubMenuButton}}"/>

如果Text被实现为DependencyProperty，它将通知更改，支持绑定(bind)等

关于c# - 将数据模板和样式放置到生成的按钮上，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36474601/