如何将我的标签和图像绑定到DataGridTemplateColumn中的Combobox？

问题描述：

我有一个我无法解决的问题。（我很喜欢WPF和它的数据绑定系统）所以我目前有一个简单的列的数据网格，但我不得不插入一个模板列，以及我想显示图标和他们的名字。如何将我的标签和图像绑定到DataGridTemplateColumn中的Combobox？

所有的数据绑定工作正常，除了一个。

所以，问题是：

我怎样才能图像和他们的名字绑定到DataGridTemplateColumn内的组合框我在数据网格中。

谢谢你的帮助和你的时间。 :)

XAML：

<Window x:Class="Octopus.OctopusManagerWindow" 
      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" 
      xmlns:core="clr-namespace:System;assembly=mscorlib" 
      mc:Ignorable="d" Width="696" Background="#FF2B2B2B" Height="28" MinHeight="500"> 
    <Window.Resources> 
     <DataTemplate x:Key="iconTemplate" > 
      <WrapPanel Margin="0 0 0 0" Height="auto"> 
       <Image Width="18" Height="18" Stretch="Fill" Source="{Binding Image}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0,0,15,0"/> 
       <Label Content="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20"/> 
      </WrapPanel> 
     </DataTemplate> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="auto" /> 
     </Grid.RowDefinitions> 
     <DataGrid x:Name="buttonDataGrid" ItemsSource="{Binding}" CanUserAddRows="False" CanUserSortColumns="False" 
        CanUserDeleteRows="False" CanUserReorderColumns="False" Margin="10" Grid.Row="1" SelectedIndex="1" 
        Width="auto" Height="auto" AutoGenerateColumns="False" Background="Transparent" Foreground="Gray"> 
      <DataGrid.Columns> 
       <DataGridTextColumn x:Name="id" Binding="{Binding id}" IsReadOnly="True" Header="ID" Width="26"/> 
       <DataGridCheckBoxColumn x:Name="isActive" Binding="{Binding isActive}" Header="Active" Width="42"/> 
       <DataGridTemplateColumn x:Name="leftIcon" Width="100" IsReadOnly="True" Header="Left Icon"> 
        <DataGridTemplateColumn.CellTemplate> 
         <DataTemplate> 
          <ComboBox> 
           <ComboBox.ItemTemplate> 
            <DataTemplate> 
             <ComboBox x:Name="leftIconList" 
                ItemTemplate="{Binding iconTemplate}" 
                ItemsSource="{Binding leftIconList, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}"/> 
            </DataTemplate> 
           </ComboBox.ItemTemplate> 
          </ComboBox> 
         </DataTemplate>  
        </DataGridTemplateColumn.CellTemplate> 
       </DataGridTemplateColumn> 
       <DataGridTemplateColumn Width="100" IsReadOnly="True" Header="Right Icon"> 
        <DataGridTemplateColumn.CellTemplate> 
         <DataTemplate> 
          <ComboBox> 
           <ComboBox.ItemTemplate> 
            <DataTemplate> 
             <ComboBox x:Name="rightIconList" 
                ItemTemplate="{Binding iconTemplate}" 
                ItemsSource="{Binding rightIconList, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}"/> 
            </DataTemplate> 
           </ComboBox.ItemTemplate> 
          </ComboBox> 
         </DataTemplate> 
        </DataGridTemplateColumn.CellTemplate> 
       </DataGridTemplateColumn> 
       <DataGridTextColumn x:Name="btnText" Binding="{Binding btnText}" Header="Button Text" Width="*"/> 
       <DataGridTextColumn x:Name="Commands" Binding="{Binding command}" Header="Command To Execute" Width="*"/> 
      </DataGrid.Columns> 
     </DataGrid> 
    </Grid> 
</Window>

C＃：

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Imaging; 
using System.Windows.Navigation; 
using System.Windows.Shapes; 
using System.Data; 
using System.Collections.ObjectModel; 
using System.ComponentModel; 

namespace myApp 
{ 
    public partial class myWindow : Window 
    { 
     ObservableCollection<buttonData> btnsData = new ObservableCollection<buttonData>(); 

     // buttonData class contains all necessary data to create a button 
     public class buttonData 
     { 
      // get set methods 
      public string id { get; set; } 
      public bool isActive { get; set; } 
      public List<icon> leftIconList { get; set; } 
      public List<icon> rightIconList { get; set; } 
      public string btnText { get; set; } 
      public string command { get; set; } 
     } 

     public class icon 
     { 
      public string Image { get; set; } 
      public string Name { get; set; } 
     } 

     private List<icon> _iconList; 
     public List<icon> iconList 
     { 
      get { return _iconList; } 
      set { _iconList = value; } 
     } 

     // init 
     // ------------------------------------------------------------------------------ 
     public myWindow() 
     { 
      InitializeComponent(); 

      Uri[] UriArray = new Uri[8]; 
      string[] fileNames = new string[8]; 

      // fill the iconList 
      for (int i = 0; i < fileListLength-1; i++) 
      { 
       string image = (string)UriArray.GetValue(i); 
       string name = (string)fileNames.GetValue(i); 
       iconList.Add(new icon { Image = image, Name = name }); 
      } 

      for (int i = 0; i < 8; i++) 
      { 
       buttonData btnDat = new buttonData(); 
       btnDat.id = (i+1).ToString(); 
       btnDat.isActive = true; 
       btnDat.leftIconList = iconList; 
       btnDat.rightIconList = iconList; 
       btnDat.btnText = ""; 
       btnDat.command = ""; 
       btnsData.Add(btnDat); 
      } 

      buttonDataGrid.DataContext = btnsData; 
     } 
    } 
}

答

没有与给定的代码一些问题。按照以下步骤纠正这些错误，你可能会得到你想要的。

1.The UriArray应该定义为相同类型的icon.Image。不要忘记填写一些数据到UriArray和fileNames。

string[] UriArray = new string[8];

2.Initialize的iconList之前填补iconList。

iconList = new List<icon>();

3.不要使用在ComboBox这么多的层次，只是这样的：

<DataGridTemplateColumn.CellTemplate> 
    <DataTemplate> 
     <ComboBox ItemTemplate="xxx" ItemsSource="xxx"/> 
    </DataTemplate> 
</DataGridTemplateColumn.CellTemplate>

4.使用StaticResource将模板应用到ComboBox而非Binding的ItemTemplate。

<DataGridTemplateColumn.CellTemplate> 
    <DataTemplate> 
     <ComboBox ItemTemplate="{StaticResource iconTemplate}" ItemsSource="xxx"/> 
    </DataTemplate> 
</DataGridTemplateColumn.CellTemplate>

5.对于该ComboBox的ItemsSource，当您使用窗口RelativeSource，你应该绑定到iconList既不leftIconList也不rightIconList。因为这两个不属于窗口。

ItemsSource="{Binding iconList, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}"

6.在这里你必须达到它。

如何将我的标签和图像绑定到DataGridTemplateColumn中的Combobox？

相关推荐