从DataTemplate UWP绑定UserControl DP [英] Binding a UserControl DP from DataTemplate UWP

问题描述

我有一个 FlipView ，其中显示了小雕像。小雕像包含指向其图像的路径。

I've got a FlipView that shows Figurines. Figurines contain a Path to their image.

将此属性绑定到常规DataTemplate上是可以的。 （下面的代码工作正常）

Binding this property to a regular DataTemplate is ok. (the code below works fine)

</DataTemplate>
    <Canvas x:Name="DefaultImageCanvas" Width="660" Height="372">
        <Image Name="imageFlip" Width="660" Height="372" Source="{Binding Path}"
            Stretch="Uniform" />
    </Canvas>
</DataTemplate>

但是当使用我的UserControl时，它不再起作用：

But when using my UserControl instead, it doesnt work anymore:

<DataTemplate>
    <local:FigurineStickerUserControl Width="660" Height="372"
                                      FigurinePath="{Binding Path}"/>
</DataTemplate>

从未设置FigurinePath DP。 （如果使用硬编码字符串，则可以。）
这是输出中的错误：

The FigurinePath DP is never set. (If I use a hardcoded string, its fine.) Here is the error in the output:

错误：BindingExpression路径错误：在 Com.Test.ViewModels.UserControl.FigurineStickerUserControlViewModel，eSmart.ViewModels，Version = 1.0.0.0，Culture = neutral，PublicKeyToken = null上找不到 Path属性。 BindingExpression：路径=路径 DataItem = Com.Test.ViewModels.UserControl.FigurineStickerUserControlViewModel，Test.ViewModels，Version = 1.0.0.0，Culture = neutral，PublicKeyToken = null；目标元素是 Com.Test.Views.FigurineStickerUserControl（名称= pageRoot）；目标属性是'FigurinePath'（类型'Object'）

Error: BindingExpression path error: 'Path' property not found on 'Com.Test.ViewModels.UserControl.FigurineStickerUserControlViewModel, eSmart.ViewModels, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'. BindingExpression: Path='Path' DataItem='Com.Test.ViewModels.UserControl.FigurineStickerUserControlViewModel, Test.ViewModels, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'; target element is 'Com.Test.Views.FigurineStickerUserControl' (Name='pageRoot'); target property is 'FigurinePath' (type 'Object')

看起来DataTemplate试图将Figurine分配为我的DataContext UserControl，然后从我的UC的DataContext中检索属性。但是我的UC有自己的DataContext（它的ViewModel），我不想删除它。

It looks like the DataTemplate tries to assign the Figurine as the DataContext of my UserControl, then retrieve the property from my UC's DataContext. But my UC has its own DataContext (its ViewModel) and I don't want to remove it.

不幸的是，对于WinRT / UWP，我没有可以执行的FindAncestor技巧与绑定。我已经尝试过：（FlipFigurine是FlipView对象）

Unfortunately with WinRT/UWP there is no FindAncestor tricks that I can do with the Binding. I already tried this: (FlipFigurine being the FlipView object)

<local:FigurineStickerUserControl Width="660" Height="372"
                                  FigurinePath="{Binding SelectedItem.Path, ElementName=FlipFigurine}"/>

它不起作用。即使将DP更改为对象并尝试以下操作也不起作用，也永远不会调用DP的设置器。日志中没有错误。

It doesnt work. Even changing the DP to object and trying the following doesnt work, the setter of the DP is never called. No error in the log though.

FigurinePath="{Binding SelectedItem, ElementName=FlipFigurine}"

有什么方法可以访问实际的Figurine对象，并将其 Path 属性绑定到 UC的FigurinePath 属性？

Is there any way to access the actual Figurine object and simply bind its Path property to the FigurinePath property of my UC??

推荐答案

由于没有 FindAncestor ，认为您唯一的希望就是少做重构。以下是一个示例，希望可以使您了解如何解决该问题：

As there is no FindAncestor, I think your only hope is to do little refactoring. Here's a sample which hopefully gives you an idea of how to get around the issue:

https://github.com/mikoskinen/uwpusercontrolbinding/tree/master

以下是代码的主要部分：

Here's the main parts from the code:

MainPage.xaml

<DataTemplate>
    <local:MyUserControl Width="660" Height="372" FigurinePath="{Binding Path}"/>
</DataTemplate>

MainPage.xaml.cs

private ObservableCollection<MyUserControlVm> coll;
protected override void OnNavigatedTo(NavigationEventArgs e)
{
    coll = new ObservableCollection<MyUserControlVm>();
    coll.Add(new MyUserControlVm("http://libcloud.readthedocs.org/en/latest/_images/azure.jpg"));
    coll.Add(new MyUserControlVm("http://www.nimbo.com/wp-content/uploads/windows-azure-logo-nimbo1.png"));

    this.Flip.ItemsSource = coll;

    base.OnNavigatedTo(e);
}

MyUserControl.xaml

<Grid>
    <Canvas Width="660" Height="372">
        <Image Width="660" Height="372" Source="{Binding FigurinePath}" Stretch="Uniform" />
    </Canvas>
</Grid>

MyUserControl.xaml.cs

public sealed partial class MyUserControl : UserControl
{
    public static readonly DependencyProperty FigurinePathProperty = DependencyProperty.Register(
        "FigurinePath", typeof (Uri), typeof (MyUserControl), new PropertyMetadata(default(Uri)));

    public Uri FigurinePath
    {
        get { return (Uri) GetValue(FigurinePathProperty); }
        set { SetValue(FigurinePathProperty, value); }
    }

    public MyUserControl()
    {
        this.InitializeComponent();
        (this.Content as FrameworkElement).DataContext = this;
    }
}

MyUserControlVM.cs

public class MyUserControlVm
{
    public Uri Path { get; set; }

    public MyUserControlVm(string url)
    {
        Path = new Uri(url);
    }

    public void VmAction()
    {

    }
}

对于与示例相关的一些参考，这是一个杰里·尼克松的文章。

For some reference related to the example, here's an article from Jerry Nixon.

这篇关于从DataTemplate UWP绑定UserControl DP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！