Question

我需要有许多不同的按钮：

<Button Style="{StaticResource DetailSectionButton}" Click="Button_Click_5">
   <Grid>
      <Grid.ColumnDefinitions>
         <ColumnDefinition Width="Auto"/>
         <ColumnDefinition Width="*" />
      </Grid.ColumnDefinitions>

      <Image Grid.Column="0" Stretch="None" 
                             Margin="0 0 10 0"
                             Source="../Assets/icons/info.png" />
      <TextBlock Text="info" Grid.Column="1"
                                   Margin="0 10 0 0" />
   </Grid>
</Button>

每个按钮都有您自己的Image.Source，TextBlock.Text和Button.Click事件处理程序。

如果我想要使用此按钮的所有内容都是这样的话，那么实现此按钮的方法是什么：

 <MyButton ImageSource="../Assets/icons/info.png" Text="info" Click="Button_Click_5" />

我是否需要创建UserControl，或者使用某些模板或附加属性就足够了？

Answer 1

我至少看到了两种方法。

首先从Button继承，用ImageSource Dependency属性扩展它并在DataTemplate中绑定它。

另一种方法是创建ImageSource附加属性，并在DataTemplate中绑定它，如下所示：

public class Config
{
    public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.RegisterAttached(
        "ImageSource", typeof (ImageSource), typeof (Config), new PropertyMetadata(default(ImageSource)));

    public static void SetImageSource(DependencyObject element, ImageSource value)
    {
        element.SetValue(ImageSourceProperty, value);
    }

    public static ImageSource GetImageSource(DependencyObject element)
    {
        return (ImageSource) element.GetValue(ImageSourceProperty);
    }
}

这是数据模板和按钮：

<DataTemplate x:Key="ButtonTemplate">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Image Grid.Column="0"
               Source="{Binding Path=(s:Config.ImageSource),
                                RelativeSource={RelativeSource AncestorType=Button}}"
               Stretch="None" />
        <TextBlock Grid.Column="1"
                   Margin="0 10 0 0"
                   Text="{Binding}" />
    </Grid>
</DataTemplate>

<Button Click="Button_Click_5" 
        Content="Info"
        ContentTemplate="{StaticResource ButtonTemplate}"
        s:Config.ImageSource="media_stop_red.png" />

希望这有帮助。

修改

只需使用ImageSource依赖项属性扩展按钮控件并为其创建默认样式，如下所示：

public class MyButton : Button { public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register( "ImageSource", typeof (ImageSource), typeof (MyButton), new PropertyMetadata(default(ImageSource))); public ImageSource ImageSource { get { return (ImageSource) GetValue(ImageSourceProperty); } set { SetValue(ImageSourceProperty, value); } } public MyButton() { DefaultStyleKey = typeof (MyButton); } }

样式和按钮本身：

<Style TargetType="s:MyButton"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="s:MyButton"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Image Grid.Column="0" Source="{TemplateBinding ImageSource}" Stretch="None" /> <TextBlock Grid.Column="1" Margin="0 10 0 0" Text="{Binding}" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <s:MyButton Content="Info" ImageSource="..\media_stop_red.png" />

Answer 2

创建一个新的usercontrol，它有xaml和代码。现在将xaml usercontrol更改为Button，并在后面的代码中将继承的clase从usercontrol更改为Button。

现在添加按钮的上下文

然后使用设置控件值

的事件添加依赖项属性

实现我的控件的最佳方法是什么

2 个答案: