我无法使用用户控件在我的应用中使用绑定工具。它是一个带有模板10的UWP应用程序。
我在主页中使用与用户控件中相同的绑定,但用户控件中的字段不会对更改做出反应。我已经阅读了几篇文章,告诉我如何设置我的用户控件的datacontent,但我不能让它们中的任何一个工作。
我的代码如下:
MainPage.xaml中
Page x:Class="UserControlTest.Views.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:controls="using:Template10.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:UserControlTest.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="using:UserControlTest.ViewModels" mc:Ignorable="d">
<Page.DataContext>
<vm:MainPageViewModel x:Name="ViewModel" />
</Page.DataContext>
<RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<controls:PageHeader x:Name="pageHeader" Content="Main Page"
RelativePanel.AlignLeftWithPanel="True"
RelativePanel.AlignRightWithPanel="True"
RelativePanel.AlignTopWithPanel="True" />
<TextBlock x:Name="mainTextBlock" Margin="16,16,16,16"
RelativePanel.AlignLeftWithPanel="True"
RelativePanel.Below="pageHeader"
Text="{Binding TextToShow}" />
<local:ShowText Margin="16,16,16,16"
RelativePanel.Below="pageHeader"
RelativePanel.AlignRightWithPanel="True"/>
<Button Content="Change Text" Margin="16,16,16,16"
Command="{x:Bind ViewModel.ChangeText }"
RelativePanel.AlignLeftWithPanel="True"
RelativePanel.Below="mainTextBlock"/>
</RelativePanel>
</Page>
MainPageViewModel.cs
using System.Collections.Generic;
using System;
using System.Linq;
using System.Threading.Tasks;
using Windows.Security.Cryptography.Core;
using Template10.Mvvm;
using Template10.Services.NavigationService;
using Windows.UI.Xaml.Navigation;
namespace UserControlTest.ViewModels
{
public class MainPageViewModel : ViewModelBase
{
private string _textToShow = "Initial text";
public string TextToShow
{
get { return _textToShow; }
set { Set(ref _textToShow, value); }
}
DelegateCommand _changeText;
public DelegateCommand ChangeText
=> _changeText ?? (_changeText = new DelegateCommand(ExecuteChangeTest, CanChangeText));
private void ExecuteChangeTest()
{
TextToShow = "Changed text";
}
private bool CanChangeText()
{
return true;
}
}
}
ShowText.xaml
<UserControl
x:Class="UserControlTest.Views.ShowText"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UserControlTest.Views"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="using:UserControlTest.ViewModels" mc:Ignorable="d">
<UserControl.DataContext>
<vm:MainPageViewModel x:Name="ViewModel" />
</UserControl.DataContext>
<Grid>
<TextBlock x:Name="UserControlTextBlock"
Text="{Binding TextToShow}" />
</Grid>
</UserControl>
答案 0 :(得分:3)
乍一看问题是你的UserControl和你的MainPage正在使用两个不同的ViewModel实例。创建静态资源时
<vm:MainPageViewModel x:Name="ViewModel" />
您正在创建MainPageViewModel的实例。这意味着当您从MainPageViewModel的MainPage实例设置值时,它不会传播到您的UserControl创建的第二个MainPageViewModel实例。
不用担心,我们可以解决这个问题。
用户控件的DataContext应自动设置为其父级的DataContext。
因此,我们暂时假设您在MainPage.xaml中使用了UserControl
<Page.DataContext>
<vm:MainPageViewModel x:Name="ViewModel" />
</Page.DataContext>
<MyUserControls:MyUserControl />
在这个例子中,MyUsercontrol使用MainPageViewModel作为它的DataContext。但是,这可能不起作用,它不是一个完成的解决方案。
您需要做的是转到UserControl的Xaml.CS并创建一个可以绑定的依赖项属性。
public class MyUserControl : Control{
public string MyControlsText
{
get { return (string)GetValue(MyControlsTextProperty); }
set { SetValue(MyControlsTextProperty, value); }
}
public static readonly DependencyProperty MyControlsTextProperty =
DependencyProperty.Register("MyControlsText", typeof(string),
typeof(MyUserControl), new PropertyMetadata(String.Empty));
}
现在我们有了依赖属性,在UserControl的Xaml中我们可以绑定它。
<Grid>
<TextBlock x:Name="UserControlTextBlock"
Text="{Binding MyControlsText}" />
</Grid>
最后在我们的MainPage.Xaml中,我们可以完成绑定
<MyUserControls:MyUserControl MyControlsText="{Binding TextToShow}" />
所以使用上面的代码就是我们正在实现的目标: