UWP DependencyProperty 绑定和 DataTemplate 绑定

Posted 2023-04-12

【中文标题】UWP DependencyProperty 绑定和 DataTemplate 绑定

【英文标题】：UWP DependencyProperty Binding and DataTemplate Binding

【发布时间】：2020-02-01 22:10:47

【问题描述】：

我有一个PlaylistControl（它是一个UserControl）和一个以这种方式声明的变量ShowAlbumText：

    public bool ShowAlbumText
    
        get => (bool)GetValue(ShowAlbumTextProperty);
        set => SetValue(ShowAlbumTextProperty, value);
    
    public static readonly DependencyProperty ShowAlbumTextProperty = DependencyProperty.Register("ShowAlbumText", 
                        typeof(bool),
                        typeof(PlaylistControl),
                        new PropertyMetadata(true));

并且ShowAlbumText 在PlaylistControl 的xaml 中的ListView.ItemTemplate 中使用这种方式：

<ListView>
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="data:Music">
            <local:PlaylistControlItem DataContext="x:Bind" ShowAlbumText="Binding ShowAlbumText">
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

但是这个Binding报错了

错误：BindingExpression 路径错误：“ShowAlbumText”属性不存在 在“SMPlayer.Models.Music”上找到。绑定表达式： 路径='ShowAlbumText' DataItem='SMPlayer.Models.Music';目标元素 是'SMPlayer.Controls.PlaylistControlItem'（名称='null'）；目标 属性是“ShowAlbumText”（类型“布尔”）

那么我如何将ShowAlbumText 绑定到PlaylistControlItem？我了解 ShowAlbumText 不是 Music 的属性（Music 是我的 ViewModel）。这是我的UserControl 的DependencyProperty。一个更普遍的问题，如何将UserControl 中的DependencyProperty 和ItemsSource 中的ViewModel 绑定到DataTemplate？

来源XAML。

来源Csharp Code。

【参考方案1】：

您可以使用 ElementName 将绑定点指向 XAML 中元素的属性，而不是数据上下文的属性。在您的情况下，您希望该元素是 UserControl/PlaylistControl。

为 UserControl 元素命名：

<UserControl x:Class="WhateverYourNamespaceIs.PlaylistControl"
    ...
    x:Name="Foo">

将您的绑定指向具有该名称的元素：

<local:PlaylistControlItem DataContext="x:Bind" ShowAlbumText="Binding ElementName=Foo, Path=ShowAlbumText">

【参考方案2】：

为您的页面命名，其中存在这样的列表视图

<Page
    x:Class="TestUwpApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestUwpApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="ThemeResource ApplicationPageBackgroundThemeBrush"
    Name="MainPageName">

然后像这样绑定属性“ShowAlbumText”。

<ListView>
<ListView.ItemTemplate>
    <DataTemplate x:DataType="data:Music">
        <local:PlaylistControlItem DataContext="x:Bind" ShowAlbumText="Binding ElementName=MainPageName,Path=DataContext.ShowAlbumText">
    </DataTemplate>
</ListView.ItemTemplate>