Question

我使用Template studio创建了一个UWP项目，我正在尝试实现自定义控件。

这就是它的样子：

.xaml.cs

 public sealed partial class MyButton : UserControl
    {
        public MyButton()
        {
            InitializeComponent();
        }

        public ImageSource Icon
        {
            get => (ImageSource)GetValue(s_iconProperty);
            set => SetValue(s_iconProperty, value);
        }

        public ImageSource Pointer
        {
            get => (ImageSource)GetValue(s_pointerProperty);
            set => SetValue(s_pointerProperty, value);
        }

        public static readonly DependencyProperty s_iconProperty =
          DependencyProperty.Register("Icon", typeof(ImageSource), typeof(MyButton), null);

        public static readonly DependencyProperty s_pointerProperty =
         DependencyProperty.Register("Pointer", typeof(ImageSource), typeof(MyButton), null);
    }

的.xaml

<UserControl
    x:Class="...Main.Components.MyButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:...Main.Components"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" Width="755.357">
    <Button Margin="0,1,1,-1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
        <Grid HorizontalAlignment="Stretch" Margin="-375,-152,-375,-148" Width="750" Height="300" VerticalAlignment="Stretch">
            <Image HorizontalAlignment="Left" Height="100" Margin="39,105,0,0" VerticalAlignment="Top" Width="100" Source="{?!?!?!}"/>
            <TextBlock HorizontalAlignment="Left" Margin="160,126,0,0" Text="TextBlock" TextWrapping="Wrap" VerticalAlignment="Top" Height="70" Width="403"/>
            <Image HorizontalAlignment="Left" Height="100" Margin="602,121,0,0" VerticalAlignment="Top" Width="100"/>
        </Grid>
    </Button>
</UserControl>

基本上，它在网格中有两个图像，我想绑定到我的依赖属性Icon和Pointer。

在我的控件设计器中，我无法看到依赖项属性，但我可以在我有自定义按钮的页面设计器中看到它们。

我已按照本教程进行操作，并尝试执行相同的操作：https://social.technet.microsoft.com/wiki/contents/articles/32795.uwp-creating-user-control.aspx，但是当我点击第一张图片时 - ＆gt;自定义控件设计器中的源代码，＆＃34;创建数据绑定＆＃34;选项甚至不可用 - 它被禁用。

我试图像这样设置数据绑定：

<Image HorizontalAlignment="Left" Height="100" Margin="39,105,0,0" VerticalAlignment="Top" Width="100" Source="{Binding Icon}"/>

但我意识到这可能不是正确的语法。

如何绑定到这些依赖项属性，有一种简单的方法吗？

我使用添加新项目...用户控件创建了控件。

Answer 1

我试图像这样设置数据绑定： <Image HorizontalAlignment="Left" Height="100" Margin="39,105,0,0" VerticalAlignment="Top" Width="100" Source="{Binding Icon}"/>

这样您在用户控件的XAML中设置数据绑定是正确的。但是你没有为绑定设置DataContext。没有数据源，绑定将不起作用。只需在用户控件中设置Datacontext即可。代码如下：

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

public ImageSource Icon
{
    get => (ImageSource)GetValue(s_iconProperty);
    set => SetValue(s_iconProperty, value);
}

然后您可以使用用户控件来设置图像源，例如：

<local:MyButton
    Width="600"
    Height="800"
    Icon="Assets/A.jpg" />

有关用户控件内部绑定的更多详细信息，请参考this article。

UWP绑定到依赖项属性

1 个答案: