c# - WPF : Dynamically create a grid with specified x rows and y columns with static image in each cell

Question

问题:我是 WPF 的新手，我无法弄清楚这一点。我如何创建具有 x 行和 y 列的网格并在运行时将图像插入每个单元格？

场景:我有一个库存项目，最终用户将在其中搜索一个项目，应用程序将指定他可以在哪里找到该项目。现在我已经在检索保存元素的橱柜详细信息，这些元素再次具有 x 行和 y 列的机架。显示的机架可以有不同的行或列大小。参见图像。

方法:所以我发现我应该有一个 x 行和 y 列的网格(只在运行时知道)。为每个单元格值填充图像。将不同的图像插入项目的位置或突出显示该单元格值。但我无法找到如何做到这一点。我的大部分搜索都指向动态添加行和列。我是否漏掉了一些非常明显的东西？

预期输出:下面给出了我希望它如何显示给我的最终用户:

Answer 1

就像我说的，我一直想知道在我们拥有静态数据的情况下是否需要使用数据网格。所以这就是我想出的。我创建了一个堆栈面板并添加了 y 个图像。现在我添加 x 个这样的堆栈面板。如果出现图像的确切位置，我会添加突出显示的图像。工作完美。为任何想要重用代码的人共享代码。

private void CreateGraphicalDisplay(int rows,int columns,int row,int column)
    {
        ClearGraphicPanel();
        for (int i = 1; i <= rows; i++)
        {

        StackPanel childstack = new StackPanel();


            for (int j = 1; j <= columns; j++)
            {
                Image gage = new Image();
                gage.Stretch = Stretch.Fill;

                if (i == row && j == column)
                {
                    gage.Source = new BitmapImage(new Uri(@Highlightedimage));
                }
                else
                {
                    gage.Source = new BitmapImage(new Uri(@NormalImage));
                }
                gage.Width = 12;
                gage.Height =12;
                gage.HorizontalAlignment = HorizontalAlignment.Left;
                gage.Margin = new Thickness(10, 1, 1, 1);

                childstack.Children.Add(gage);
            }

            containerstack.Children.Add(childstack);
        }

    }