Question

我有一个ItemsControl，可能包含任意数量的项目（在设计时未知）。这些项目中的每一项基本上都表示为具有固定纵横比的无限可伸缩图像（即，图像将在给予它的任何空间中绘制自身 - 除了必须保留纵横比之外，它不会指定其自身的大小。）。 每个项目的宽高比可能不同，但通常是相同的。

我想：

在每幅图像周围绘制边框，理想情况下厚度均匀，与图像缩放无关。
在窗口内尽可能大地绘制每个图像，同时保持其边框外部的顺序，宽高比和边距。
图像四边中的至少两个必须始终触及其所在单元格的不可见边界。如果不接触，另外两方应该集中。（假设使用了某种统一的单元格布局。）
不重叠或剪辑任何图像。
调整包含窗口大小时自动重新布局。
浪费最少量的非图像空间。
如果项目的宽高比不同，也应尽可能地应对。（但如果这会增加其他项目的浪费空间，只要它们重新调整以适应结果就可以了。）

我发现的普遍共识似乎是将每个图像包装在Stretch.Uniform Viewbox中，然后将它们放入UniformGrid中。我尝试过这种方法，但它并不吸引我，因为：

鉴于两个项目，UniformGrid总是希望创建一个2x2网格布局，即使窗口形状会使2x1或1x2网格更合适，这会导致过度缩放和浪费空间。
如果我将边框放在Viewbox中，那么它会缩放边框粗细。如果我把它放在外面，那就会扭曲纵横比。

有更好的方法吗？（请注意，“图像”实际上是我自己的自定义绘制FrameworkElement，因此我可以将自定义度量/排列代码放在此处或自定义容器面板中（如果有帮助的话。）

<UniformGrid>
    <Rectangle Fill="Red" Margin="4" Width="500" Height="281.25" />
    <Rectangle Fill="Blue" Margin="4" Width="500" Height="281.25" />
</UniformGrid>

这是一个简单的例子。将其放入窗口，然后尝试调整窗口大小。矩形改变大小以适合窗口（好），但它们也改变形状/方面（坏），并且一旦窗口足够大（坏）它们就停止调整大小。即使窗口本身的大小使1x2或2x1更好地工作，它也会为整个2x2网格留出空间。

<UniformGrid>
    <Viewbox Stretch="Uniform" Margin="4"><Rectangle Fill="Red" Width="500" Height="281.25" /></Viewbox>
    <Viewbox Stretch="Uniform" Margin="4"><Rectangle Fill="Blue" Width="500" Height="281.25" /></Viewbox>
</UniformGrid>

当窗口变大时，矩形继续拉伸，并且它们不再扭曲它们的形状，但是当窗口很宽时窗口很宽或第二列时仍然存在不必要的第二行，这稍微好一些。而且我希望元素从左上角排列（如WrapPanel）而不是居中，但这是一个小细节。

（现在尝试在Viewbox的内部和外部添加边框，看看我的意思。）

实际上，WrapPanel几乎可以满足我的需求，但是当窗口变小时，它会自动调整项目的大小。

保持宽高比的WPF项目面板

0 个答案: