如何将标签和图像绑定到 DataGridTemplateColumn 内的组合框?

加博·米克洛斯

我有一个我无法解决的小问题。(我在 WPF 和它的数据绑定系统中非常菜鸟)所以我目前拥有的是一个具有简单列的数据网格,但我还必须插入一个模板列,我还想在其中显示图标及其名称。

除了那个之外,所有数据绑定都可以正常工作。

所以问题是:

如何将图像及其名称绑定到数据网格内 DataGridTemplateColumn 内的 ComboBox。

感谢您的帮助和您的时间。:)

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.UriArray应该定义为相同类型的icon.Image而且不要忘了一些数据填充到UriArrayfileNames

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用于将模板应用于ItemTemplateComboBox而不是Binding

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

5. 对于ItemsSourceComboBox,当您使用RelativeSource窗口的 时,您应该iconList既不绑定leftIconList也不绑定rightIconList因为这两个不属于窗口。

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

6.这里你一定做到了。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

DataGridTemplateColumn绑定

来自分类Dev

DataGridTemplateColumn.CellEditingTemplate将文本框转换为组合框不一致

来自分类Dev

DatagridTemplateColumn /组合框未显示ItemsSource

来自分类Dev

DatagridTemplateColumn /组合框未显示ItemsSource

来自分类Dev

按 F2 将光标放在 DataGridTemplateColumn 内的可编辑组合框上

来自分类Dev

ProgressBar 值内的数据绑定不适用于 DataGridTemplateColumn

来自分类Dev

DataGridTemplateColumn标题绑定

来自分类Dev

WPF 动态绑定到 DataGridTemplateColumn

来自分类Dev

WPF-在DataGridTemplateColumn中获取组合框控件的行索引

来自分类Dev

WPF DataGridTemplateColumn组合框更新所有行

来自分类Dev

在DataGridTemplateColumn中的组合框的选定值上的超链接

来自分类Dev

如何将图像添加到DataGridTemplateColumn标头

来自分类Dev

将Listview内的组合框绑定到ObservableCollection <string>

来自分类Dev

如何将mybatis的resultmap绑定到javafx组合框?

来自分类Dev

如何将组合框绑定到工具提示WPF

来自分类Dev

WPF:将 DataGridTemplateColumn 中的元素绑定到另一个 DataGridTemplateColumn 中的元素

来自分类Dev

将DataGridTemplateColumn.Width属性绑定到滑块

来自分类Dev

将DataGridTextColumn的IsReadOnly绑定到DataGridTemplateColumn复选框IsChecked

来自分类Dev

将DataGridTemplateColumn.Width属性绑定到滑块

来自分类Dev

WPF DataGrid和DataGridTemplateColumn标题问题

来自分类Dev

如何获取DataTemplate来填充DataGridTemplateColumn

来自分类Dev

WPF:如何将对象绑定到组合框

来自分类Dev

如何在WPF中绑定用作DataGridTemplateColumn的用户控件失败

来自分类Dev

如何在WPF中绑定用作DataGridTemplateColumn的用户控件失败

来自分类Dev

如何将模型绑定到Kendo组合框以使用模型验证?

来自分类Dev

如何将数据从MySql数据库(WPF)中的表绑定到组合框

来自分类Dev

如何将组合框类别项目绑定到它的categoryId

来自分类Dev

如何将Winforms组合框绑定到简单的字符串列表?

来自分类Dev

如何将枚举绑定到C#中具有空字段的组合框

Related 相关文章

  1. 1

    DataGridTemplateColumn绑定

  2. 2

    DataGridTemplateColumn.CellEditingTemplate将文本框转换为组合框不一致

  3. 3

    DatagridTemplateColumn /组合框未显示ItemsSource

  4. 4

    DatagridTemplateColumn /组合框未显示ItemsSource

  5. 5

    按 F2 将光标放在 DataGridTemplateColumn 内的可编辑组合框上

  6. 6

    ProgressBar 值内的数据绑定不适用于 DataGridTemplateColumn

  7. 7

    DataGridTemplateColumn标题绑定

  8. 8

    WPF 动态绑定到 DataGridTemplateColumn

  9. 9

    WPF-在DataGridTemplateColumn中获取组合框控件的行索引

  10. 10

    WPF DataGridTemplateColumn组合框更新所有行

  11. 11

    在DataGridTemplateColumn中的组合框的选定值上的超链接

  12. 12

    如何将图像添加到DataGridTemplateColumn标头

  13. 13

    将Listview内的组合框绑定到ObservableCollection <string>

  14. 14

    如何将mybatis的resultmap绑定到javafx组合框?

  15. 15

    如何将组合框绑定到工具提示WPF

  16. 16

    WPF:将 DataGridTemplateColumn 中的元素绑定到另一个 DataGridTemplateColumn 中的元素

  17. 17

    将DataGridTemplateColumn.Width属性绑定到滑块

  18. 18

    将DataGridTextColumn的IsReadOnly绑定到DataGridTemplateColumn复选框IsChecked

  19. 19

    将DataGridTemplateColumn.Width属性绑定到滑块

  20. 20

    WPF DataGrid和DataGridTemplateColumn标题问题

  21. 21

    如何获取DataTemplate来填充DataGridTemplateColumn

  22. 22

    WPF:如何将对象绑定到组合框

  23. 23

    如何在WPF中绑定用作DataGridTemplateColumn的用户控件失败

  24. 24

    如何在WPF中绑定用作DataGridTemplateColumn的用户控件失败

  25. 25

    如何将模型绑定到Kendo组合框以使用模型验证?

  26. 26

    如何将数据从MySql数据库(WPF)中的表绑定到组合框

  27. 27

    如何将组合框类别项目绑定到它的categoryId

  28. 28

    如何将Winforms组合框绑定到简单的字符串列表?

  29. 29

    如何将枚举绑定到C#中具有空字段的组合框

热门标签

归档