网格与“解耦”滚动（又名“冻结”行和列）(Grid with “decoupled” scrolling (aka “frozen” rows and columns))

网格与“解耦”滚动（又名“冻结”行和列）(Grid with “decoupled” scrolling (aka “frozen” rows and columns))

大致来说，这是我想要实现的目标：

插图http://namefa.mine.nu/alignmentproblem.png

绿色部分是固定的。 橙色（或粉红色？）部分的单元格是可编辑的。 蓝色部分中的单元格也是可编辑的。 [add fridge]按钮添加了另一列。

现在棘手的部分： 蓝色+绿色部分应该一起可以垂直滚动。 蓝色+橙色部分应该一起水平滚动。 （暗红色的东西代表滚动条）

人们可以看到这背后的逻辑：我必须能够编辑任何（合理）数量的冰箱和产品的产品数量，即使它们并非全部适合屏幕。 但我绝不能滚动冰箱名称或产品名称。

我想在XAML中完成这个布局，带有绑定（一个ObservableCollection<Fridge>立刻跳到脑海中）。 编写自定义转换器也是可以接受的。 重点是避免以编程方式创建/管理UI元素。

我以前的想法和实验中的一些考虑因素：

无法使用Grid ，因为它无法从序列中自动生成列

一系列嵌套的ItemsControl可以工作，但后来我遇到了对齐来自不同序列的项目的问题（即蓝色单元格有橙色或绿色 - 取决于嵌套的方向） - 请参阅我的另一个问题 。

调整冰箱柱尺寸的奖励积分。 到目前为止，我只设法找到GridSplitter ，但它只适用于网格。

Here is, roughly, what I'm trying to achieve:

illustration http://namefa.mine.nu/alignmentproblem.png

The green part is fixed. Cells in the orange (or pink?) part are editable. Cells in the blue part are also editable. The [add fridge] button adds another column.

Now the tricky part: The blue+green parts should, together, be scrollable vertically. The blue+orange parts should, together, be scrollable horizontally. (the dark red thingies represent scrollbars)

One can see the logic behind this: I must be able to edit product quantities for any (reasonable) number of fridges and products, even if they don't all fit on the screen. But I must never scroll either fridge names or product names out of sight.

I would like to accomplish this layout solely in XAML, with bindings (an ObservableCollection<Fridge> immediately jumps to mind). Writing custom converters also would be acceptable. The main point is to avoid creating/managing UI elements programmatically.

A few considerations from my previous thoughts and experiments:

Can't use Grid, since it can't autogenerate columns from sequence

A series of nested ItemsControls could work, but then I run into the problem of aligning items from different sequences (i.e. blue cells with either orange or green ones - depending on the direction of nesting) - see my other question.

Bonus points for resizing the fridge columns. So far I've only managed to find GridSplitter, but it only works with grid.

最满意答案

回答我自己的问题，我可以接受它：这被称为“冻结的列”和“冻结的行”，不，有开箱即用的行案例。

Answering my own question just so I can accept it: this is called "frozen columns" and "frozen rows" and no, there is noting out of the box for the rows case.