首页 > 解决方案 > UWP:ElementName 绑定在 EntranceThemeTransition 中不起作用

问题描述

这是我的代码(它是 uwp 应用程序)。我想知道为什么第二个绑定{Binding ElementName=Items, Path=DataContext.IsStaggeringEnabled}不起作用以及如何修复它?

MainPage.xaml:

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

    <Page.DataContext>
        <local:MainViewModel />
    </Page.DataContext>

    <StackPanel Orientation="Vertical">
        <ItemsControl x:Name="Items"
                      ItemsSource="{Binding Items}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemContainerTransitions>
                <TransitionCollection>
                    <EntranceThemeTransition IsStaggeringEnabled="{Binding ElementName=Items, Path=DataContext.IsStaggeringEnabled}" <!-- THIS IS NOT WORKING -->
                                             FromVerticalOffset="-20"
                                             FromHorizontalOffset="-20" />
                </TransitionCollection>
            </ItemsControl.ItemContainerTransitions>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>

        <Button Click="{x:Bind Redraw}">Redraw</Button>
    </StackPanel>
</Page>

MainPage.xaml.cs:

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace App1
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        public void Redraw()
        {
            DataContext = new MainViewModel();
        }
    }
}

MainViewModel.cs:

using GalaSoft.MvvmLight;
using System.Collections.ObjectModel;

namespace App1
{
    public class MainViewModel : ViewModelBase
    {
        public ObservableCollection<ItemViewModel> Items { get; set; } = new ObservableCollection<ItemViewModel>();

        public bool IsStaggeringEnabled { get; set; } = true;

        public MainViewModel()
        {
            for (var i = 0; i < 10; i++)
            {
                Items.Add(new ItemViewModel());
            }
        }
    }
}

项目视图模型.cs:

using GalaSoft.MvvmLight;

namespace App1
{
    public class ItemViewModel : ViewModelBase
    {
        public static int Index = 0;
        public string Name { get; set; }

        public ItemViewModel()
        {
            Index++;
            Name = $"{Index}";
        }
    }
}

绑定无效:

在此处输入图像描述

标签: xamluwpuwp-xamlxaml-binding

解决方案


也许您需要更改创建方式ViewModel

xml.cs

public MainViewModel vm = new MainViewModel();
public MainPage()
{
    this.InitializeComponent();
    DataContext = vm;
}
public void Redraw()
{
    vm = new MainViewModel();
}

xml

...
<EntranceThemeTransition IsStaggeringEnabled="{x:Bind vm.IsStaggeringEnabled,Mode=OneWay}"
                         FromVerticalOffset="-20"
                         FromHorizontalOffset="-20" />
...

这样就可以绑定成功了。


推荐阅读