Question

我创建了一个UserControl（MediaList），其中包含一个绑定到属性“ToolsBar”的ItemControl。我们的想法是允许从MediaList控件外部添加自定义按钮/控件。

我的问题是我正在尝试在ToolsBar中添加一个按钮，该按钮具有与UserControl本身的绑定。我不会将我的MediaList（UserControl）的DataContext覆盖为“this”，因为我需要使用在根窗口中定义的DataModel。

也许我这样做是完全错误的？

以下是使用MediaList的自定义按钮的窗口示例：

<localControls:MediaList x:Name="NewMediaList">
                <localControls:MediaList.ToolsBar>
                    <Button Content="{StaticResource ResourceKey=MoveToPlaylist}" 
                            IsEnabled="{Binding ElementName=NewMediaList, Path=SelectedMedia, Converter={localConverters:ObjectToBool}}"/>
                </localControls:MediaList.ToolsBar>
            </localControls:MediaList>

到目前为止，我尝试了多种绑定而没有成功，例如：

{Binding ElementName = MediaListControl，Path = SelectedMedia，Converter = {localConverters：ObjectToBool}}“
{Binding RelativeSource = {x：Static RelativeSource.Self}，Path = SelectedMedia，Converter = {localConverters：Debug}}
{Binding SelectedMedia，RelativeSource = {RelativeSource FindAncestor，AncestorType = {x：Type UserControl}}}
{Binding SelectedMedia，RelativeSource = {RelativeSource FindAncestor，AncestorType = {x：Type localControls：MediaList}}}

请注意我将它们从我的内存中写回来，并且我也试过（并且没有）将MediaControl和StackPanel（包含ItemControm）的DataContext从MediaList.xaml设置为MediaList对象本身。

MediaList.xaml：

<UserControl x:Class="MediaPlaylist.Controls.MediaList"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:localConverters="clr-namespace:Suisse.MediaPlaylist.Converters"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300"
         x:Name="MediaListControl">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <DataGrid Grid.Row="0" 
              AutoGenerateColumns="False"
              ItemsSource="{Binding ElementName=MediaListControl, Path=Playlist.Medias}"
              SelectedItem="{Binding ElementName=MediaListControl, Path=SelectedMedia, Mode=TwoWay}">
        <DataGrid.Columns>
            <DataGridTextColumn Header="Title" 
                                Binding="{Binding Title}"
                                IsReadOnly="True"/>
            <DataGridTextColumn Header="File" 
                                Binding="{Binding FilePath}"
                                IsReadOnly="True"/>
        </DataGrid.Columns>
    </DataGrid>

    <StackPanel Orientation="Horizontal"
                HorizontalAlignment="Right"
                Grid.Row="1">
        <ItemsControl ItemsSource="{Binding ElementName=MediaListControl, Path=ToolsBar}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
        <Separator Visibility="{Binding ElementName=MediaListControl, Path=ToolsBar.Count, Converter={localConverters:ObjectToVisibility}}" />
        <Button
            HorizontalAlignment="Right"
            Content="Delete"
            Click="OnDelete_Click"
            IsEnabled="{Binding ElementName=MediaListControl, Path=SelectedMedia, Converter={localConverters:ObjectToBool}}"/>
    </StackPanel>
</Grid>

由于

Answer 1

首先，您尝试将绑定数据分配给ItemsControl的ItemsSource属性，这是完全错误的。而不是你可以在MedialList.xaml.cs中声明ItemsControl依赖属性

        public partial class MediaList : UserControl
    {
        public MediaList()
        {
            InitializeComponent();

        }

        public static DependencyProperty ToolsBarProperty = DependencyProperty.
   Register("ToolsBar", typeof(ItemsControl), typeof(MediaList));

        public ItemsControl ToolsBar
        {
            get { return (ItemsControl)GetValue(ToolsBarProperty); }
            set { SetValue(ToolsBarProperty, value); }
        }
    }

然后，您可以将MediaList xaml更新为

 <StackPanel Orientation="Horizontal"
            HorizontalAlignment="Right"
            Grid.Row="1">
        <ContentControl Content="{Binding ElementName=MediaListControl, Path=ToolsBar}">

        </ContentControl>

然后，您可以将任何集合模板从外部指定为ToolBar属性

<localControls:MediaList>
            <localControls:MediaList.ToolsBar>
                <ItemsControl >
                    <ItemsControl.Items>
                        <Button Content="{StaticResource ResourceKey=MoveToPlaylist}" 
                        IsEnabled="{Binding ElementName=NewMediaList, Path=SelectedMedia, Converter={localConverters:ObjectToBool}}"/>
                        <Label>Hello </Label>
                        <Label> How are you?</Label>
                    </ItemsControl.Items>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Horizontal" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ItemsControl>
            </localControls:MediaList.ToolsBar>
        </localControls:MediaList>

希望这能解决您的问题。

注意：我刚刚移出了在MediaList用户控件中定义的ItemsControl，并将其替换为ContentControl。这允许将任何模板从外部设置为ContentControl的Content属性。

绑定到包含ItemsControl数据的UserControl

1 个答案: