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

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

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

现在添加按钮的内容

然后使用设置控件值的事件添加依赖属性

Answer 2

我看到至少有两种方法可以做到这一点。

首先是从 Button 继承，使用您的 ImageSource 依赖项扩展它属性并在 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" />

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

What is the best way to implement my control

xaml

windows-8.1