新按钮模板的WPF绑定属性

本文关键字:WPF 绑定 属性 按钮 新按钮 | 更新日期: 2023-09-27 18:26:29

好的,我为Buttons制作了一个新样式,我想在我的应用程序中使用它。一般的想法是有一个10平方的Button,其中我将有一个Image,在这个TextBlock下。我的问题是,我想为每个Button设置不同的Image.SourceTextBlock.Text。我做的是:

<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="Border" CornerRadius="5" BorderThickness="1" Background="Gray" BorderBrush="Orange">
   <Grid>
     <Grid.RowDefinitions>
       <RowDefinition Height="Auto"/>
       <RowDefinition Height="*"/>
     </Grid.RowDefinitions>
        <Image Margin="0,5,0,0" Grid.Row="0" Width="25"  Height="25" VerticalAlignment="Center" HorizontalAlignment="Center"/>
     <TextBlock FontSize="12"/>
   </Grid>
</Border>

我应该怎么做才能像这样利用我的风格?

<Button Style="{DynamicResource MenuButtons}" Text="????" x:Name="LiveB" Source="????" Click="Live_Click"/>

提前谢谢。

新按钮模板的WPF绑定属性

如果您需要的只是一个图像和一些文本,您可以使用按钮的.Tag.Content:使其工作(错误)

<Style x:Key="MenuButtons" ...
    ...
    <ControlTemplate TargetType="{x:Type Button}" >
        <Border x:Name="Border" CornerRadius="5" BorderThickness="1" Background="Gray" BorderBrush="Orange">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Image Width="25"  Height="25" VerticalAlignment="Center" HorizontalAlignment="Center"
                       Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Tag}" />
                <TextBlock FontSize="12" Text="{TemplateBinding Content}" Grid.Row="1" />
            </Grid>
        </Border>
    </ControlTemplate>
    ...

然后:

<Button Style="{DynamicResource MenuButtons}" x:Name="LiveB" 
        Content="MyText la la la..." Tag="http://programming.enthuses.me/1.png" 
        Click="Live_Click" />

如果你需要更多的自定义内容,你需要看看康斯坦丁·朱科夫的评论和Attached Properties

(为什么不能只使用"{TemplateBinding Tag}"而不是"...{RelativeSource TemplatedParent}..."?我不知道,但TemplateBinding通常是一个非常脆弱的快捷方式,它并不总是做它应该做的事情…)

您需要做的是创建一个类,该类将充当按钮的DataContext

Class ButtonDataContext
{
    public String TextBlockText {get;set;}
    public String ImageSource {get;set;}
}

然后进行

LiveB.DataContext = new ButtonDataContext(){TextBlockText = "text", ImageSource = "Image Path"};

在控制模板XAML 中

<Image Source="{Binding Path=ImageSource}" Margin="0,5,0,0" Grid.Row="0" Width="25"  Height="25" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="{Binding Path=TextBlockText}" FontSize="12"/>