模拟Windows 8开始菜单平铺布局引擎(Emulates Windows 8 Start Men

因此，任何人在那里的示例代码或控制完美地模拟Windows 8开始菜单平铺布局引擎知道？

它应该支持混合正方形和长方形瓷砖，和过度或不足长方形砖适当重新组合广场砖。

注：WrapPanel工作，如果全部平铺均为广场。但是，一旦你在跨越2格的空间价值，布局破裂的瓷砖搭配，并与Windows 8的开始菜单不符

我期待它扩展了WPF面板代码。

免责声明：是的，我在网上搜索，我发现的最接近的就是CodeProject上的例子，但是，只有当所有的瓦片相同大小的正方形作品。

Answer 1:

我看着自己周围，找不到任何做我/我们想要的东西。我知道，要获得这种行为，我们会需要某种自定义面板的对象，所以我开始着手创建一个...

是什么把它归结为，是瓷砖需要垂直排列，与双幅瓷砖占用一整排在列，而正常宽度瓷砖配对。当它到达容器的底部，它需要创建一个新的列，并遵循相同的模式。

下面是我的实现：

    public class MetroTilePanel : Panel
{
    protected override Size ArrangeOverride(System.Windows.Size finalSize)
    {
        double x = 0, y = 0, colWidth = 0, rowHeight = 0;
        int col = 0;
        colWidth = Children.Cast<UIElement>().Select(c => c.DesiredSize.Width).Max();

        foreach (UIElement child in Children)
        {
            rowHeight = Math.Max(rowHeight, child.DesiredSize.Height);

            if (x + child.DesiredSize.Width > (colWidth * (col + 1)))
            {
                // New row
                y += rowHeight;
                x = (colWidth * (col));
                rowHeight = child.DesiredSize.Height;
            }

            if (y + rowHeight > finalSize.Height)
            {
                // New column
                col++;
                x = (colWidth * (col));
                y = 0;
            }

            child.Arrange(new Rect(x, y, child.DesiredSize.Width, child.DesiredSize.Height));
            x += child.DesiredSize.Width;
        }
        return finalSize;
    }

    protected override Size MeasureOverride(Size availableSize)
    {
        double x = 0, y = 0, colWidth = 0;

        foreach (UIElement child in Children)
        {
            child.Measure(availableSize);

            if (x + child.DesiredSize.Height > availableSize.Height)
            {
                x += colWidth;
                y = 0;
                colWidth = 0;
            }

            y += child.DesiredSize.Height;
            if (child.DesiredSize.Width > colWidth)
            {
                colWidth = child.DesiredSize.Width;
            }
        }
        x += colWidth;

        var resultSize = new Size();

        resultSize.Width = double.IsPositiveInfinity(availableSize.Width) ? x : availableSize.Width;
        resultSize.Height = double.IsPositiveInfinity(availableSize.Height) ? y : availableSize.Height;

        return resultSize;
    }
}

在动作控制的截图：