Caliburn Micro：UserControl Binding

Question

我使用Caliburn Micro作为我的WPF应用程序。我实现了一个小UserControl：

<UserControl Name="ImageButtonUserControl"
             x:Class="SportyMate.Utility.Controls.ImageButton"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006">
    <Grid>
        <Button>
            <StackPanel Orientation="Horizontal">
                <Image Source="{Binding ElementName=ImageButtonUserControl, Path=Image}" />
                <TextBlock Text="{Binding ElementName=ImageButtonUserControl, Path=Text}" />
            </StackPanel>
        </Button>
    </Grid>
</UserControl>

现在我想在我的视图中使用这些控件：

<uc:ImageButton Name="Cancel" Image="/Images/Icons/cancel_16x16.png" Text="Abbrechen" Margin="3" />

当我想打开我的视图时（在我的情况下它是作为对话框打开的）它不起作用。视图无法打开。 当我删除Name-Attribute everthing很好，但Button没有绑定到一个动作。任何人都可以告诉我我必须做些什么来正确绑定？一个普通的Button工作。

Answer 1

你的方式完全错误。您不应该为这种简单的修改创建用户控件。您需要创建一个DataTemplate并将其用于Button.ContentTemplate。首先，您需要为按钮内容定义帮助程序类型：

public class ImageButtonContent
{
    public BitmapImage Image { get; set; }
    public string Label { get; set; }
}

之后，您可以将它用于DataTemplate：

<Window x:Class="Trys.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:Trys="clr-namespace:Trys"
            Title="MainWindow"
            Height="350"
            Width="525">
      <Window.Resources>
        <Trys:ImageButtonContent x:Key="YourImageButtonHere"
                                 Label="Your ImageButtonHere">
          <Trys:ImageButtonContent.Image>
            <BitmapImage UriSource="your-icon.png" />
          </Trys:ImageButtonContent.Image>
        </Trys:ImageButtonContent>
        <DataTemplate x:Key="ImageButton"
                      DataType="{x:Type Trys:ImageButtonContent}">
          <StackPanel Orientation="Horizontal">
            <Image Source="{Binding Image}"
                   Margin="5" />
            <TextBlock Text="{Binding Label}"
                       VerticalAlignment="Center"
                       Margin="10,0,0,0" />
          </StackPanel>
        </DataTemplate>
      </Window.Resources>
      <Grid>
        <Button ContentTemplate="{StaticResource ImageButton}"
                Content="{StaticResource YourImageButtonHere}"
                Height="50"
                Width="250" />
      </Grid>
</Window>

我使用了资源作为对象，但您可以在ViewModel上使用属性。结果是：

这只是一个普通按钮。您可以使用Caliburn.Micro惯例的所有功能，例如Click事件默认绑定。享受！