Caliburn Micro: привязка UserControl

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, все в порядке, но кнопка не имеет привязки к действию. Может ли кто-нибудь сказать мне, что я должен сделать для правильной привязки? Правильная кнопка работала.

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. Наслаждайтесь!