如何根据二维数组填充WPF网格 [英] How to populate a WPF grid based on a 2-dimensional array

问题描述

我有一个2维数组的对象，我基本上想把每一个数据绑定到WPF网格中的一个单元格。目前我有这个工作，但我在程序上做的最多。我创建正确数量的行和列定义，然后循环遍历单元格并创建控件并为每个定义设置正确的绑定。

至少我想使用一个模板来指定xaml中的控件和绑定。理想情况下，我想摆脱程序代码，只需使用数据绑定即可完成所有操作，但我不确定是否可行。

这是我目前的代码使用：

  public void BindGrid（）
 {
 m_Grid.Children.Clear（）; 
 m_Grid.ColumnDefinitions.Clear（）; 
 m_Grid.RowDefinitions.Clear（）; （int x = 0; x< MefGrid.Width; x ++）
 
 
 {
 m_Grid.ColumnDefinitions.Add（new ColumnDefinition（）{Width = new GridLength ，GridUnitType.Star），}）; 
} 
 
 for（int y = 0; y< MefGrid.Height; y ++）
 {
 m_Grid.RowDefinitions.Add（new RowDefinition（） = new GridLength（1，GridUnitType.Star），}）; （int x = 0; x< MefGrid.Width; x ++）
 {
 for（int y = 0; y&MeFGrid）
 
 
高度; y ++）
 {
单元格=（单元格）MefGrid [x，y]; 
 
 SolidColorBrush画笔=新的SolidColorBrush（）; 
 
 var binding = new Binding（On）; 
 binding.Converter = new BoolColorConverter（）; 
 binding.Mode = BindingMode.OneWay; 
 
 BindingOperations.SetBinding（brush，SolidColorBrush.ColorProperty，binding）; 
 
 var rect = new Rectangle（）; 
 rect.DataContext = cell; 
 rect.Fill = brush; 
 rect.SetValue（Grid.RowProperty，y）; 
 rect.SetValue（Grid.ColumnProperty，x）; 
 m_Grid.Children.Add（rect）; 
} 
} 
 
} 
  

解决方案

网格的目的不是真正的数据绑定，它只是一个面板。我列出了最简单的方法来完成二维列表的可视化。

 < Window.Resources> 
< DataTemplate x：Key =DataTemplate_Level2> 
< Button Content ={Binding}Height =40Width =50Margin =4,4,4,4/> 
< / DataTemplate> 
 
< DataTemplate x：Key =DataTemplate_Level1> 
< ItemsControl ItemsSource ={Binding}ItemTemplate ={DynamicResource DataTemplate_Level2}> 
< ItemsControl.ItemsPanel> 
< ItemsPanelTemplate> 
< StackPanel Orientation =Horizo​​ntal/> 
< / ItemsPanelTemplate> 
< /ItemsControl.ItemsPanel> 
< / ItemsControl> 
< / DataTemplate> 
 
< /Window.Resources> 
< Grid> 
< ItemsControl x：Name =lstItemTemplate ={DynamicResource DataTemplate_Level1}/> 
< / Grid> 
  

在后面的代码中，将lst的ItemsSource设置为TwoDimentional数据结构。

  public Window1（）
 {
列表<列表< int>> lsts = new List< List< int>>（）; （int i = 0; i <5; i ++）
 {
 lsts.Add（new List< int>（））; 
 
 （int j = 0; j< 5; j ++）
 {
 lsts [i] .Add（i * 10 + j）; 
 
 
} 
} 
 
 InitializeComponent（）; 
 
 lst.ItemsSource = lsts; 
} 
  

这将为您提供以下屏幕作为输出。您可以编辑DataTemplate_Level2以添加对象的更多具体数据。

I have a 2-dimensional array of objects and I basically want to databind each one to a cell in a WPF grid. Currently I have this working but I am doing most of it procedurally. I create the correct number of row and column definitions, then I loop through the cells and create the controls and set up the correct bindings for each one.

At a minimum I would like to be able to use a template to specify the controls and bindings in xaml. Ideally I would like to get rid of the procedural code and just do it all with databinding, but I'm not sure that's possible.

Here is the code I am currently using:

public void BindGrid()
{
    m_Grid.Children.Clear();
    m_Grid.ColumnDefinitions.Clear();
    m_Grid.RowDefinitions.Clear();

    for (int x = 0; x < MefGrid.Width; x++)
    {
        m_Grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star), });
    }

    for (int y = 0; y < MefGrid.Height; y++)
    {
        m_Grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star), });
    }

    for (int x = 0; x < MefGrid.Width; x++)
    {
        for (int y = 0; y < MefGrid.Height; y++)
        {
            Cell cell = (Cell)MefGrid[x, y];                    

            SolidColorBrush brush = new SolidColorBrush();

            var binding = new Binding("On");
            binding.Converter = new BoolColorConverter();
            binding.Mode = BindingMode.OneWay;

            BindingOperations.SetBinding(brush, SolidColorBrush.ColorProperty, binding);

            var rect = new Rectangle();
            rect.DataContext = cell;
            rect.Fill = brush;
            rect.SetValue(Grid.RowProperty, y);
            rect.SetValue(Grid.ColumnProperty, x);
            m_Grid.Children.Add(rect);
        }
    }

}

解决方案

The purpose of the Grid is not for real databinding, it is just a panel. I am listing down the easiest way to accomplish the visualization of a two dimensional list

<Window.Resources>
    <DataTemplate x:Key="DataTemplate_Level2">
            <Button Content="{Binding}" Height="40" Width="50" Margin="4,4,4,4"/>
    </DataTemplate>

    <DataTemplate x:Key="DataTemplate_Level1">
        <ItemsControl ItemsSource="{Binding}" ItemTemplate="{DynamicResource DataTemplate_Level2}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </DataTemplate>

</Window.Resources>
<Grid>
    <ItemsControl x:Name="lst" ItemTemplate="{DynamicResource DataTemplate_Level1}"/>
</Grid>

And in the code behind set the ItemsSource of lst with a TwoDimentional data structure.

  public Window1()
    {
        List<List<int>> lsts = new List<List<int>>();

        for (int i = 0; i < 5; i++)
        {
            lsts.Add(new List<int>());

            for (int j = 0; j < 5; j++)
            {
                lsts[i].Add(i * 10 + j);
            }
        }

        InitializeComponent();

        lst.ItemsSource = lsts;
    }

This gives you the following screen as output. You can edit the DataTemplate_Level2 to add more specific data of your object.

这篇关于如何根据二维数组填充WPF网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！