Silverlight UserControl自定义属性绑定

在Silverlight UserControls中实现自定义属性的正确方法是什么?

Silverlight中的每个“页面”在技术上都是一个UserControl(它们是从UserControl类派生的)。 当我在这里说UserControl时,我的意思是一个Custom UserControl,它将在很多不同的场景中用于许多不同的页面内(类似于ASP.NET UserControl)。

我希望Custom UserControl支持绑定,而不依赖于它绑定的属性的名称,永远都是一样的。 相反,我希望UserControl本身具有UserControl中的控件绑定到的属性,并且UserControl外部的ViewModel也绑定到该属性。 (请看下面的例子)

UserControl中的绑定工作,在MainPage中的绑定工作,在MainPage和UserControl之间设置的绑定不起作用。 具体来说这一行:

<myUserControls:MyCustomUserControl x:Name="MyCustomControl2" 
    SelectedText="{Binding MainPageSelectedText, Mode=TwoWay}" 
    Width="200" Height="50" />

示例输出:
替代文字

MainPage.xaml中

<UserControl x:Class="SilverlightCustomUserControl.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:myUserControls="clr-namespace:SilverlightCustomUserControl"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">
  <Canvas x:Name="LayoutRoot">
    <StackPanel Orientation="Vertical">
      <TextBlock Text="UserControl Binding:" Width="200"></TextBlock>
      <myUserControls:MyCustomUserControl x:Name="MyCustomControl2" SelectedText="{Binding MainPageSelectedText, Mode=TwoWay}" Width="200" Height="50" />
      <TextBlock Text="MainPage Binding:" Width="200"></TextBlock>
      <TextBox Text="{Binding MainPageSelectedText, Mode=TwoWay}" Width="200"></TextBox>
      <Border BorderBrush="Black" BorderThickness="1">
        <TextBlock Text="{Binding MainPageSelectedText}" Width="200" Height="24"></TextBlock>
      </Border>
    </StackPanel>
  </Canvas>
</UserControl>

MainPage.xaml.cs中

namespace SilverlightCustomUserControl
{
 public partial class MainPage : UserControl, INotifyPropertyChanged
 {
  //NOTE: would probably be in a ViewModel
  public string MainPageSelectedText
  {
   get { return _MainPageSelectedText; }
   set
   {
    string myValue = value ?? String.Empty;
    if (_MainPageSelectedText != myValue)
    {
     _MainPageSelectedText = value;
     OnPropertyChanged("MainPageSelectedText");
    }
   }
  }
  private string _MainPageSelectedText;


  public MainPage()
  {
   InitializeComponent();
  }


  #region INotifyPropertyChanged Members

  public event PropertyChangedEventHandler PropertyChanged;

  protected virtual void OnPropertyChanged(string name)
  {
   PropertyChangedEventHandler ph = this.PropertyChanged;

   if (ph != null)
    ph(this, new PropertyChangedEventArgs(name));
  }

  #endregion
 }
}

MyCustomUserControl.xaml

<UserControl
   x:Class="SilverlightCustomUserControl.MyCustomUserControl" 
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   DataContext="{Binding RelativeSource={RelativeSource Self}}">
  <Grid>
    <StackPanel>
      <TextBox Text="{Binding SelectedText, Mode=TwoWay}" />
      <Border BorderBrush="Black" BorderThickness="1">
        <TextBlock Text="{Binding SelectedText}" Height="24"></TextBlock>
      </Border>
    </StackPanel>
  </Grid>
</UserControl>

MyCustomUserControl.xaml.cs

namespace SilverlightCustomUserControl
{
 public partial class MyCustomUserControl : UserControl
 {
  public string SelectedText
  {
   get { return (string)GetValue(SelectedTextProperty); }
   set { SetValue(SelectedTextProperty, value); }
  }

  public static readonly DependencyProperty SelectedTextProperty =
    DependencyProperty.Register("SelectedText", typeof(string), typeof(MyCustomUserControl), new PropertyMetadata("", SelectedText_PropertyChangedCallback));


  public MyCustomUserControl()
  {
   InitializeComponent();
  }

  private static void SelectedText_PropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
  {
   //empty
  }
 }
}

参考资料(我如何得到这个):

使用DependencyPropertys:http://geekswithblogs.net/thibbard/archive/2008/04/22/wpf-custom-control-dependency-property-gotcha.aspx

使用DependencyPropertys,将x:Name添加到您的UserControl中 - 添加与ElementName绑定,再次在PropertyChangedCallback方法中设置Custom属性:通过DataBinding在UserControl中设置自定义属性

不要使用自定义属性,依赖于底层datacontext名称(我不喜欢这个解决方案):wpf使用UserControl中的依赖属性的麻烦


我理解你的控件没有从maim页面接收到新值的原因是你正在设置控件的DataContext。 如果你没有,那么控件的DataContext将从它的父级继承,在这种情况下是主页面。

为了解决这个问题,我删除了控件的DataContext设置,为每个控件添加一个x:Name,并使用[name] .SetBinding方法在控件的构造函数中设置绑定。

我在ctor中做了绑定,因为我无法找到将xaml中的声明性绑定的Source属性设置为Self的方法。 即{Binding SelectedText,Mode = TwoWay,Source = [Self here some how]}。 我没有喜悦地尝试使用RelativeSource = {RelativeSource Self}。

注意:所有这些都是SL3。


问题是UserControl抛出一个DataBinding错误(在调试时在输出窗口中可见)

由于UserControl的DataContext在其自己的xaml中设置为“Self”,因此它正在自己的上下文中查找MainPageSelectedText(它不是在“MainPage”中查找MainPageSelectedText,因为它可能会看起来像这样你在物理上写/查看在“上下文”中的代码)

我可以通过在代码背后设置绑定来获得这个“工作”。 在后面的代码中设置绑定是将UserControl本身设置为绑定的“源”的唯一方法。 但是这只有在Binding是TwoWay时才有效。 OneWay绑定会破坏这段代码。 一个更好的解决方案完全是创建一个Silverlight控件,而不是一个UserControl。

也可以看看:

http://social.msdn.microsoft.com/Forums/en-US/silverlightcontrols/thread/052a2b67-20fc-4f6a-84db-07c85ceb3303

http://msdn.microsoft.com/en-us/library/cc278064%28VS.95%29.aspx

MyCustomUserControl.xaml

<UserControl
   x:Class="SilverlightCustomUserControl.MyCustomUserControl" 
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006">
 <Grid>
  <StackPanel>
   <TextBox x:Name="UserControlTextBox" />
   <Border BorderBrush="Black" BorderThickness="1">
    <TextBlock x:Name="UserControlTextBlock" Height="24"></TextBlock>
   </Border>
  </StackPanel>
 </Grid>
</UserControl>

MyCustomUserControl.xaml.cs

namespace SilverlightCustomUserControl
{
 public partial class MyCustomUserControl : UserControl
 {

  public string SelectedText
  {
   get { return (string)GetValue(SelectedTextProperty); }
   set { SetValue(SelectedTextProperty, value); }
  }

  public static readonly DependencyProperty SelectedTextProperty =
    DependencyProperty.Register("SelectedText", typeof(string), typeof(MyCustomUserControl), new PropertyMetadata("", SelectedText_PropertyChangedCallback));


  public MyCustomUserControl()
  {
   InitializeComponent();

               //SEE HERE
   UserControlTextBox.SetBinding(TextBox.TextProperty, new Binding() { Source = this, Path = new PropertyPath("SelectedText"), Mode = BindingMode.TwoWay });
   UserControlTextBlock.SetBinding(TextBlock.TextProperty, new Binding() { Source = this, Path = new PropertyPath("SelectedText") });
               //SEE HERE
  }

  private static void SelectedText_PropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
  {
   //empty
  }

 }
}

您可以通过为用户控件添加一个x:Name ,然后在用户控件xaml中进行绑定来设置xaml中的绑定,而不是将数据上下文绑定到self。

<UserControl
  x:Class="SilverlightCustomUserControl.MyCustomUserControl" 
  x:Name="myUserControl
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006">
    <Grid>
        <StackPanel>
            <TextBox Text="{Binding SelectedText, ElementName=myUserContol, Mode=TwoWay}" />
            <Border BorderBrush="Black" BorderThickness="1">
                <TextBlock Text="{Binding SelectedText,ElementName=myUserControl}" Height="24"></TextBlock>
            </Border>
        </StackPanel>
     </Grid>
</UserControl>
链接地址: http://www.djcxy.com/p/44601.html

上一篇: Silverlight UserControl Custom Property Binding

下一篇: Get control properties from Grid.Resources in code behind