如何正确绑定子用户控件依赖项属性的共享属性

时间:2018-07-11 09:42:55

标签: wpf data-binding user-controls viewmodel

我有4种不同的收藏。目前,我显示了这4个集合,但当时只能选择一个元素。

显示4个集合的视图:

<UserControl x:Class="xxx.yyy.vvv.Menu"
             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:local="clr-namespace:xxx.yyy.vvv.Menu"
             mc:Ignorable="d" 
             d:DesignHeight="800" d:DesignWidth="450">
    <Grid  Name="RootContainer">
        <Grid.DataContext>
            <local:MenuViewModel/>
        </Grid.DataContext>
        <ItemsControl ItemsSource="{Binding Collection}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <local:CollectionControl Collection="{Binding}" SelectedElement="{Binding Path=DataContext.GlobalSelectedElement,ElementName=RootContainer, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>
</UserControl>

这已绑定到ViewModel:

public class MenuViewModel : SomeBaseViewModelThatHandleTheNotify
{
    public IMyElement GlobalSelectedElement
    {
        get => GetValue<IMyElement>();
        set => SetValue(value); //I NEVER COME HERE!!!)
    }
    public SomeCollectionContainer Collection
    {
        get => GetValue<SomeCollectionContainer>();
        set => SetValue(value);
    }
}

我的子控件具有依赖项属性,该属性在更改UserControl的内部ViewModel时会更改。

    public IMyElement SelectedElement
    {
        get { return (IMyElement)GetValue(SelectedElementProperty); }
        set { SetValue(SelectedElementProperty, value);/*HERE I COME!*/ }
    }
    public static readonly DependencyProperty SelectedElementProperty =
        DependencyProperty.Register("SelectedElement", typeof(IMyElement), typeof(CollectionControl), new PropertyMetadata(null, OnSelectedElementChanged));

    private static void OnSelectedElementChanged(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs dependencyPropertyChangedEventArgs)
    {
        //Retrieve the sub control ViewModel and set the property
        SubControlViewModel subControlViewModel = (SubControlViewModel)((CollectionControl)dependencyObject).RootContainer.DataContext;
        subControlViewModel.SelectedElement = (IMyElement)dependencyPropertyChangedEventArgs.NewValue;
    }

    //In the constructor, I register to PropertyChanged of the ViewModel, and I set the SelectedElement when it change.

因此,基本上,我进入UserControl依赖项属性的SetValue中,但从未进入主ViewModel的GlobalSelectedElement属性。

我想念什么?

编辑 我试图直接在ViewModel和Dependency属性之间使用双向绑定,但也不起作用:

在我的子控件中:

<UserControl x:Class="xxx.yyy.vvv.CollectionControl"
             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:local="clr-namespace:xxx.yyy.vvv.Menu"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <StackPanel Name="RootContainer" Orientation="Vertical">
        <StackPanel.DataContext>
            <local:CollectionControlViewModel/>
        </StackPanel.DataContext>
        <Label Content="{Binding Collection.Name}" Margin="5,0,0,0" />
        <ListBox ItemsSource="{Binding Collection.Items}" HorizontalContentAlignment="Stretch" Padding="0" BorderThickness="0" SelectedItem="{Binding SelectedElement, RelativeSource={RelativeSource AncestorType={x:Type local:CollectionControl}}, Mode=TwoWay}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    ...
                </DataTemplate>
            </ListBox.ItemTemplate>
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
        </ListBox>
    </StackPanel>
</UserControl>

我觉得我的UserControl DependencyProperty是从两个侧面绑定的

我试图制作一个小图来显示我的课程。 因此我的CollectionControl.SelectedElement设置正确,而MenuViewModel.SelectedItem设置不正确。

enter image description here

1 个答案:

答案 0 :(得分:0)

尝试使用DataContext绑定到父ItemsControl的{​​{1}}:

RelativeSource

显然不能使用<local:CollectionControl Collection="{Binding}" SelectedElement="{Binding Path=DataContext.GlobalSelectedElement, RelativeSource={RelativeSource AncestorType=ItemsControl}, Mode=TwoWay}"/> 。这是因为namescopesElementName中的CollectionControl元素与“ RootContainer”不在同一名称范围内。