MVVM WPF組合框：爲組合框創建模板

代碼隱藏（xaml.cs）：

namespace WpfApplication1 
{ 
    private ObservableCollection<TransportType> transportTypes = new ObservableCollection<TransportType>(); 

    transportTypes.Add(new TransportType() {Icon = Properties.Resources.Air, ValueMember = "A100", DisplayMember = "By Air" }); 
    transportTypes.Add(new TransportType() {Icon = Properties.Resources.Maritime, ValueMember = "M200", DisplayMember = "Maritime" }); 

    this.ComboBoxTransportTypes.ItemsSource = transportTypes; 
}

TransportType類：

namespace WpfApplication1 
{ 
    public class TransportType 
    { 

     public Image Icon 
     { 
      get; 
      set; 
     } 

     public string DisplayMember 
     { 
      get; 
      set; 
     } 

     public string ValueMember 
     { 
      get; 
      set; 
     } 
    } 
}

查看：

<ComboBox x:Name="ComboBoxTransportTypes" 
      Grid.Column="1"    
      ItemsSource="{Binding}" 
      DisplayMemberPath="DisplayMember" 
      SelectedValuePath="ValueMember" 
      SelectionChanged="ComboBoxTransportTypes_SelectionChanged"> 
    <ComboBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <VirtualizingStackPanel /> 
     </ItemsPanelTemplate> 
    </ComboBox.ItemsPanel> 
</ComboBox>

Ñ我正在嘗試應用ComboBox ItemTemplate並綁定到「transportTypes」集合。我想每一個組合框項目，如下是：

<ComboBoxItem> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="{Binding bind-icon-here}" /> 
     <TextBlock Foreground="AliceBlue" 
        VerticalAlignment="Center" 
        Text="{Binding bind-DisplayMember-here}"/> 
    </StackPanel> 
</ComboBoxItem>

所以，我怎麼可以創建綁定到我的收藏，以每個項目上面的組合框項模板與圖標後面的字符串來呈現？

我在下面嘗試過，但它不起作用。我也不知道如何將集合中的每個項目綁定到stackpanel中的圖像和文本塊，我已經完成了如下，但只顯示字符串而不是圖標。

<ComboBox x:Name="ComboBoxTransportTypes" 
      Grid.Column="1"    
      ItemsSource="{Binding}" 
      DisplayMemberPath="DisplayMember" <-- removed from here as I cannot define DisplayMemberPath and item template at the same time. 
      SelectedValuePath="ValueMember" 
      SelectionChanged="ComboBoxTransportTypes_SelectionChanged"> 
    <ComboBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <VirtualizingStackPanel /> 
     </ItemsPanelTemplate> 
    </ComboBox.ItemsPanel> 
    <ComboBox.ItemTemplate> 
     <DataTemplate DataType="l:TransportType"> 
      <StackPanel Orientation="Horizontal"> 
        <Image Source="{Binding Icon}" /> 
        <TextBlock Foreground="AliceBlue" 
          VerticalAlignment="Center" 
          Text="{Binding DisplayMember}"/> 
      </StackPanel> 
     </DataTemplate> 
    </ComboBox.ItemTemplate> 
</ComboBox>

此外，在MVVM是它更好地填充從代碼隱藏組合框，因爲我已經在這裏或視圖模型構造做了什麼？

來源

2017-07-29 user1624552

您需要備份並去WPVM中的MVVM做一些閱讀，因爲不是這樣。 – Will

問題是，您在XAML和後面的代碼中都設置了ItemSource。如果您從XAML中刪除ItemSource="{Binding}"，那麼它應該可以工作。

如果您使用的是MVVM，則該集合應該填充到視圖模型中，而不是放在後面的代碼中。你的代碼背後應該只有很少的代碼 - 只有與視圖相關的東西應該去那裏（比如顯示一個子窗口）。

來源

2017-07-30 03:30:49 Andy

問題是，Image.Source需要ImageSource而不是圖像。更改...

<Image Source="{Binding Icon}" />

到...

<Frame Content="{Binding Icon}"/>

，事情就會開始工作。

來源

2017-07-30 04:14:06 AQuirky

必須使用底部語法自定義模板組合框

<TextBlock Text="{Binding Path=DisplayMember}"/>

或

<Image Source="{Binding Path=Icon}" />

像組合框，列表框，......像DataTemplate中的自定義tamplate WPF列表標籤
您必須使用路徑

來源

2017-07-30 10:20:58 pejman

MVVM WPF組合框：爲組合框創建模板

回答

相關問題