如何使用MVVM將數據正確綁定到WPF按鈕

這是我的設置，它似乎沒有正確綁定數據。結果應該是一個帶有圖像和文本顯示的按鈕。沒有顯示。如何使用MVVM將數據正確綁定到WPF按鈕

<UserControl x:Class="AmebaPrototype.UI.LandingPivot.featureControl" 
     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" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     mc:Ignorable="d" 
     d:DesignHeight="330" d:DesignWidth="960" 
     DataContext="{Binding Source={StaticResource viewModelLocator}, Path=VideoViewModel}" 
     > 
<UserControl.Resources > 
    <DataTemplate x:Key="custTemplate" > 
     <StackPanel > 
      <Image Source="{Binding ImagePath}"/> 
      <TextBlock Text="{Binding MyTitle}"/> 
     </StackPanel>   
    </DataTemplate> 
</UserControl.Resources> 

<Grid x:Name="LayoutRoot" Background="{x:Null}" > 
    <Button Content="Button" Height="316" 
      HorizontalAlignment="Left" Margin="12,2,0,0" 
      Name="button1" VerticalAlignment="Top" 
      Width="423" Click="button1_Click" 
      ContentTemplate="{DynamicResource custTemplate}" 
      /> 
    <Button Content="Button" Height="156" HorizontalAlignment="Left" Margin="441,2,0,0" Name="button2" VerticalAlignment="Top" Width="208" Click="button2_Click" /> 
    <Button Content="Button" Height="156" HorizontalAlignment="Left" Margin="669,2,0,0" Name="button3" VerticalAlignment="Top" Width="208" /> 
    <Button Content="Button" Height="156" HorizontalAlignment="Left" Margin="441,162,0,0" Name="button4" VerticalAlignment="Top" Width="208" /> 
    <Button Content="Button" Height="156" HorizontalAlignment="Left" Margin="669,162,0,0" Name="button5" VerticalAlignment="Top" Width="208" /> 
</Grid>

型號：

public class Video 
    { 
     public string MyTitle { get; set; } 
     public string ImagePath { get; set; } 
    }

視圖模型

public ViewModel VideoViewModel 
    { 
     get 
     { 
      if(viewmodel == null) 
      { 
       viewmodel = new ViewModel(); 
       viewmodel.ListData.Clear(); 
       viewmodel.ListData.Add(new Video { MyTitle = "Title1", ImagePath = "exampleimage.com/image.png" }); 
       viewmodel.ListData.Add(new Video { MyTitle = "Title2", ImagePath = "exampleimage.com/image.png" }); 

      } 

      return viewmodel; 
     } 
    }

來源

2012-06-26 Fabii

你的'VideoViewModel'是怎麼樣的？因爲在'UserControl'的'DataContext'中，你綁定到'VideoViewModel'，它不是'Video'類本身，而是包含（我猜）一個類型爲'Video'的屬性。 – nemesv

檢查此鏈接使用MVVM綁定按鈕：http://stackoverflow.com/questions/3772797/wpf-mvvm-button-control-binding-in-datatemplate – Ponmalar

當你運行你的程序，看看在輸出面板在Visual Studio中。有沒有BindingExpression錯誤？ –

如果你真的想這樣做，使用一個DataTemplate，則：

<Button> 
     <Button.Content> 
      <x:Type TypeName="Visual"/> 
     </Button.Content> 
     <Button.Template> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Grid> 
        <ContentPresenter ContentSource="Content"/> 
       </Grid> 
      </ControlTemplate> 
     </Button.Template> 
     <Button.ContentTemplate> 
      <DataTemplate> 
       <TextBlock Text="{Binding Path=Name}"/> 
      </DataTemplate> 
     </Button.ContentTemplate> 
    </Button>

您的視圖模型結合應該沒問題在這裏使用，因此在DataTemplate中你可以調整它，包括你的形象和TextBlock的。

來源

2012-06-26 05:15:05 EdFred

什麼是x？引用。試過了，它不允許我將它設置爲x：Type。 – Fabii

x是xmlns：x =「http://schemas.microsoft.com/winfx/2006/xaml」命名空間。 – EdFred

的DataTemplate資源：

<DataTemplate x:Key="bTemplate"> 
     <Button Label="{Binding MyTitle}" 
       Command="{Binding Execute}"> 
      <Image Source="{Binding ImagePath}" /> 
     </Button> 
</DataTemplate>

不完全是因爲你的問題，但那麼你可以使用它接受一個的ItemSource如一個ListView控件：

<ListView 
    ItemsSource="{Binding ListData}" 
    ItemTemplate="{StaticResource bTemplate}" 
> 
</ListView>

我加了一個命令，因爲如果你想要實現MVVM而不是事件點擊，這是必要的。

來源

2012-06-26 14:27:58

我以前使用過ListView和ListBox來實現它，但現在我需要專門實現一個按鈕。即沒有ListView或其他佈局。 – Fabii

如何使用MVVM將數據正確綁定到WPF按鈕

回答

相關問題