Question

我想让用户有机会在我的CustomControl中设置按钮集合。

我试图用ItemsControl这样解决：

<ItemsControl ItemsSource="{Binding RelativeSource={RelativeSource AncestorType={x:Type cc:MyCustomControl}}, Path=Buttons}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Command="{Binding Command}">
                <Image Source="{Binding MyImageSource}"/>
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

按钮DependencyProperty：

public static readonly DependencyProperty ButtonsProperty = DependencyProperty.Register(
    "Buttons", typeof(IList), typeof(TileGrid), new PropertyMetadata(default(IList)));

public IList Buttons
{
    get { return (IList) GetValue(ButtonsProperty); }
    set { SetValue(ButtonsProperty, value); }
}

MyButton类：

public class MyButton: Button
{
    public ImageSource MyImageSource { get; set; }
}

以及我希望如何在CustomControl实现中看到它：

<cc:MyCustomControl>
    <cc:MyCustomControl.Buttons>
        <cc:MyButton Command="{Binding SignDocumentsCommand}"
                     MyImageSource="pack://application:,,,/CommonResources;component/Images/Icons/pen.png"/>

        <cc:MyButton Command="{Binding DeleteDocumentsCommand}"
                     MyImageSource="pack://application:,,,/CommonResources;component/Images/Icons/remove.png"/>
    </cc:MyCustomControl.Buttons>
</cc:MyCustomControl>

但是它不起作用。在实时可视化树中，我在ItemsControl中仅看到MyButtons。这是正确的方法吗？还是我需要以其他方式解决它？

Answer 1

ItemsControl中用于Button项的类型不应从Button派生。您可以使用如下所示的简单方法。也不必将Buttons属性声明为依赖项属性。一个简单的ObservableCollection就足够了。

public class MyButtonItem : DependencyObject
{
    public static DependencyProperty CommandProperty = DependencyProperty.Register(
        nameof(Command), typeof(ICommand), typeof(MyButtonItem));

    public static DependencyProperty ImageSourceProperty = DependencyProperty.Register(
        nameof(ImageSource), typeof(ImageSource), typeof(MyButtonItem));

    public ICommand Command
    {
        get { return (ICommand)GetValue(CommandProperty); }
        set { SetValue(CommandProperty, value); }
    }

    public ImageSource ImageSource
    {
        get { return (ImageSource)GetValue(ImageSourceProperty); }
        set { SetValue(ImageSourceProperty, value); }
    }
}

public partial class MyCustomControl : UserControl
{
    public MyCustomControl()
    {
        InitializeComponent();
    }

    public ObservableCollection<MyButtonItem> Buttons { get; }
        = new ObservableCollection<MyButtonItem>();
}

XAML控件就是您已经拥有的：

<ItemsControl ItemsSource="{Binding Buttons,
                  RelativeSource={RelativeSource AncestorType=UserControl}}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Command="{Binding Command}">
                <Image Source="{Binding ImageSource}"/>
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

然后将MyButtonItem对象添加到Buttons集合：

<cc:MyCustomControl>
    <cc:MyCustomControl.Buttons>

        <cc:MyButtonItem
            Command="{Binding SignDocumentsCommand}"
            ImageSource="/CommonResources;component/Images/Icons/pen.png"/>

        <cc:MyButtonItem
            Command="{Binding DeleteDocumentsCommand}"
            ImageSource="/CommonResources;component/Images/Icons/remove.png"/>

    </cc:MyCustomControl.Buttons>
</cc:MyCustomControl>

DependencyProperty用于收集按钮

1 个答案: