c# - 在环绕面板中设置最大行数

Question

我需要配置一个换行面板，我可以在其中设置最大行数或最大列数。

这真的很有必要，我使用的是 WPF 4.0。但是另一天，我正在编写 Metro 应用程序，我记得它的一个控件具有此属性，但在 WPF 中没有（直到我知道）。

WPF 4.0 中是否存在这样的控件？还是我需要创建一个新的？

Answer 1

您可以设置ItemHeight和ItemWidth属性来设置最大行数和列数...

有关更多信息，请查看此处

Answer 2

这是这样一个 WrapPanel 的实现。

xml:

<loc:WrapPanelWithRowsOrColumnsCount
    xmlns:loc="clr-namespace:..."
    Orientation="Vertical"
    RowsOrColumnsCount="2">
    <TextBox Text="Andrew" Margin="2" Height="30" />
    <TextBox Text="Betty" Margin="2" Height="40" />
    <TextBox Text="Celine" Margin="2" Height="20" />
    <TextBox Text="Dick" Margin="2" Height="20" />
    <TextBox Text="Enron" Margin="2" Height="30" />
    <TextBox Text="Felix" Margin="2" Height="20" />
    <TextBox Text="Hanibal" Margin="2" Height="30" />
</loc:WrapPanelWithRowsOrColumnsCount>

结果：

代码WrapPanelWithRowsOrColumnsCount.cs：_

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;

public class WrapPanelWithRowsOrColumnsCount : WrapPanel
{
    public static readonly DependencyProperty RowsOrColumnsCountProperty = 
        DependencyProperty.Register(
            "RowsOrColumnsCount",
            typeof(int),
            typeof(WrapPanelWithRowsOrColumnsCount),
            new PropertyMetadata(int.MaxValue));

    public int RowsOrColumnsCount
    {
        get { return (int)GetValue(RowsOrColumnsCountProperty); }
        set { SetValue(RowsOrColumnsCountProperty, Math.Max(value, 1)); }
    }

    protected override Size MeasureOverride(Size availableSize)
    {
        if (Children.Count > 0)
        {
            Size newAvailableSize;

            if (Orientation == Orientation.Horizontal)
            {
                var suitableWidth = EstimateSuitableRowOrColumnLength(Children.Cast<UIElement>(),
                                                                        true,
                                                                        availableSize,
                                                                        RowsOrColumnsCount);

                newAvailableSize = 
                    double.IsNaN(suitableWidth) || suitableWidth <= 0
                        ? availableSize 
                        : new Size(Math.Min(suitableWidth, availableSize.Width), availableSize.Height);
            }
            else
            {
                var suitableHeigth = EstimateSuitableRowOrColumnLength(Children.Cast<UIElement>(),
                                                                        false,
                                                                        availableSize,
                                                                        RowsOrColumnsCount);
                newAvailableSize =
                    double.IsNaN(suitableHeigth) || suitableHeigth <= 0
                        ? availableSize
                        : new Size(availableSize.Width, Math.Min(suitableHeigth, availableSize.Height));
            }

            return base.MeasureOverride(newAvailableSize);
        }
        else
        {
            return base.MeasureOverride(availableSize);
        }
    }

    private double EstimateSuitableRowOrColumnLength(IEnumerable<UIElement> elements,
                                                        bool trueRowsFalseColumns,
                                                        Size availableSize,
                                                        int rowsOrColumnsCount)
    {
        var elementsList = elements.ToList();

        var desiredLengths = elementsList.Select(el => DesiredLength(el, availableSize, trueRowsFalseColumns)).ToList();

        var maxLength = desiredLengths.Where(length => !double.IsNaN(length)).Concat(new[] { 0.0 }).Max();

        if (maxLength <= 0.0)
        {
            return double.NaN;
        }

        var desiredLengthsRepaired = desiredLengths.Select(length => double.IsNaN(length) ? maxLength : length).ToList();

        var totalDesiredLength = desiredLengthsRepaired.Sum();

        var maxCount = Math.Min(rowsOrColumnsCount, elementsList.Count);

        var suitableRowOrColumnLength = totalDesiredLength / maxCount;

        double nextLengthIncrement;

        while (CountRowsOrColumnsNumber(desiredLengthsRepaired, suitableRowOrColumnLength, out nextLengthIncrement) > maxCount)
        {
            suitableRowOrColumnLength += nextLengthIncrement;
        }

        suitableRowOrColumnLength = Math.Max(suitableRowOrColumnLength, desiredLengthsRepaired.Max());

        return suitableRowOrColumnLength;
    }

    private int CountRowsOrColumnsNumber(List<double> desiredLengths, double rowOrColumnLengthLimit, out double nextLengthIncrement)
    {
        int rowOrColumnCount = 1;
        double currentCumulativeLength = 0;
        bool nextNewRowOrColumn = false;

        var minimalIncrement = double.MaxValue;

        foreach (var desiredLength in desiredLengths)
        {
            if (nextNewRowOrColumn)
            {
                rowOrColumnCount++;
                currentCumulativeLength = 0;
                nextNewRowOrColumn = false;
            }

            if (currentCumulativeLength + desiredLength > rowOrColumnLengthLimit)
            {
                minimalIncrement = Math.Min(minimalIncrement,
                                            currentCumulativeLength + desiredLength - rowOrColumnLengthLimit);

                if (currentCumulativeLength == 0)
                {
                    nextNewRowOrColumn = true;
                    currentCumulativeLength = 0;
                }
                else
                {
                    rowOrColumnCount++;
                    currentCumulativeLength = desiredLength;
                }
            }
            else
            {
                currentCumulativeLength += desiredLength;
            }
        }

        nextLengthIncrement = minimalIncrement != double.MaxValue ? minimalIncrement : 1;

        return rowOrColumnCount;
    }

    private double DesiredLength(UIElement el, Size availableSize, bool trueRowsFalseColumns)
    {
        el.Measure(availableSize);
        Size next = el.DesiredSize;

        var length = trueRowsFalseColumns ? next.Width : next.Height;

        if (Double.IsInfinity(length) ||
            Double.IsNaN(length))
        {
            return Double.NaN;
        }
        else
        {
            return length;
        }
    }
}

该解决方案的灵感来自此 codeproject 文章。

Answer 3

我认为对于您要完成的 WPF Grid 是更好的解决方案。通过设置特定的网格行数，您可以模拟环绕面板的行为，并且更加灵活。

<Grid>
  <Grid.ColumnDefinitions>
    <ColumDefinition Height="Auto"/>
    <ColumDefinition Height="Auto"/>
    <ColumDefinition Height="Auto"/>
    .... 
    <ColumDefinition Height="*/>  
  </Grid.ColumnDefinitions>
<Grid>

Answer 4

我认为您可以使用 WrapPanel 执行此操作的唯一方法是，如果您知道对象的大小（并且它们是一致的），那么您可以相应地设置 WrapPanel 的高度/宽度。不过这很丑。

要考虑的一件事：您希望面板如何处理超出最大行/列数的元素？还是总有正确数量的元素？如果是这种情况，那么您应该真正查看网格。