1

Дабы не строить сложные предложения, я буду объяснять на случае, когда ориентация панели горизонтальная.

WrapPanel переносит элемент, если минимальный его размер не помещается в строку с учетом предыдущих элементов. То есть логично, что ширина врап панели должна быть ограничена, иначе в ней просто пропадает смысл. Это либо должна быть граница родительского контейнера (врап панель растянута) либо свойство MaxWidth. То есть фреймворк заранее знает максимальную ширину врап панели (если конечно она задана).

Это было вступление. Теперь задача. Мне необходимо сделать так, чтобы последний элемент врап панели был растянут на всю оставшуюся ширину. Например, врап панель растянута по ширине окна. Ширина равна 500. Во враппанели есть 3 одинаковых элемента. Для их отображения достаточно 100 пикселей на каждый. Но мне нужно, чтобы последний элемент имел ширину 300 пикселей (то есть во всю оставшуюся ширину). Конечно же это все должно быть автоматическим, то есть мне неизвестно сколько в панели элементов, сколько там осталось пикселей до конца строки и тд. Это как нибудь возможно сделать?

6
  • Вы случайно не пишете TabControl?
    – VladD
    5 мар 2017 в 16:35
  • @VladD, нет, я случайно пишу TagControl :) и я хочу, чтобы выбранные теги имели автоматический размер (по содержимому), а последний контрол, который будет являться TextBox'ом, растягивался бы до конца строки.
    – iRumba
    6 мар 2017 в 1:36
  • А что нужно делать, если у нас выходит несколько строк? Растягивать последний элемент в каждой строке?
    – VladD
    7 мар 2017 в 12:28
  • @VladD, растягивать только в последней строке. Ну и в первой, если строка одна
    – iRumba
    7 мар 2017 в 15:53
  • Окей, тогда подправлю алгоритм позже. Покамест он растягивает все строки.
    – VladD
    7 мар 2017 в 16:15

1 ответ 1

2

Кажется, TabPanel делает почти то, что вам нужно. (За исключением случая одной строки.)

Пример:

<TabPanel>
    <Border Background="Red" MinWidth="50" Height="25"/>
    <Border Background="Yellow" MinWidth="100" Height="25"/>
    <Border Background="Green" MinWidth="75" Height="25"/>
    <Border Background="Red" MinWidth="60" Height="25"/>
    <Border Background="Yellow" MinWidth="80" Height="25"/>
    <Border Background="Green" MinWidth="30" Height="25"/>
</TabPanel>

даёт результат:

движущаяся картинка


Окей, если TabPanel не подходит, придётся засучить рукава и написать вручную. Вдохновившись алгоритмом WrapPanel, я набросал следующее:

class LastItemFillPanel : Panel
{
    class MeasureArrangeHelper
    {
        public Size TotalSize = new Size();
        public Size CurrentLineSize = new Size();
        public List<UIElement> CurrentLine;

        double availableWidth;
        bool keepChildren;

        public MeasureArrangeHelper(double availableWidth, bool keepChildren)
        {
            this.availableWidth = availableWidth;
            this.keepChildren = keepChildren;
            if (keepChildren)
                CurrentLine = new List<UIElement>();
        }

        public void AddToCurrentLine(UIElement child)
        {
            var size = child.DesiredSize;
            CurrentLineSize.Width += size.Width;
            CurrentLineSize.Height = Math.Max(size.Height, CurrentLineSize.Height);
            if (keepChildren)
                CurrentLine.Add(child);
        }

        public bool CanAddToCurrentLine(UIElement child)
        {
            return CurrentLineSize.Width + child.DesiredSize.Width <= availableWidth;
        }

        public void FinishLine(bool stretchLast = false)
        {
            if (keepChildren)
                ArrangeLine(TotalSize.Height, CurrentLineSize.Height, CurrentLine, stretchLast);
            TotalSize.Width = Math.Max(CurrentLineSize.Width, TotalSize.Width);
            TotalSize.Height += CurrentLineSize.Height;
            CurrentLineSize = new Size();
            if (keepChildren)
                CurrentLine.Clear();
        }

        void ArrangeLine(double height, double lineHeight, List<UIElement> children, bool stretchLast)
        {
            double width = 0;

            var childToStretch = stretchLast ? children.LastOrDefault() : null;
            foreach (var child in children)
            {
                double layoutSlotWidth = child.DesiredSize.Width;
                if (child == childToStretch)
                    layoutSlotWidth = Math.Max(layoutSlotWidth, availableWidth - width);
                child.Arrange(new Rect(width, height, layoutSlotWidth, lineHeight));
                width += layoutSlotWidth;
            }
        }
    }

    protected override Size MeasureOverride(Size availableSize)
    {
        return CommonMeasureArrange(availableSize, false);
    }

    protected override Size ArrangeOverride(Size finalSize)
    {
        CommonMeasureArrange(finalSize, true);
        return finalSize;
    }

    Size CommonMeasureArrange(Size size, bool arrange)
    {
        var helper = new MeasureArrangeHelper(size.Width, keepChildren: arrange);

        foreach (var child in InternalChildren.OfType<UIElement>())
        {
            if (!arrange)
                child.Measure(size);

            if (helper.CanAddToCurrentLine(child))
            {
                helper.AddToCurrentLine(child);
            }
            else // переходим на следующую строку
            {
                helper.FinishLine();

                var overflow = !helper.CanAddToCurrentLine(child);
                helper.AddToCurrentLine(child);
                if (overflow) // больше заданной ширины -- получает отдельную строку
                    helper.FinishLine();
            }
        }

        // не забываем последнюю строку
        if (helper.CurrentLine == null || helper.CurrentLine.Count > 0)
            helper.FinishLine(true);

        return helper.TotalSize;
    }
}

Это должно работать лучше.

Результат:

и ещё картинка

7
  • VladD, а почему первоначально последний элемент не растянут на всю оставшуюся ширину?
    – sp7
    5 мар 2017 в 17:03
  • @sp7: Ну так делает TabPanel, у неё одна строка — отдельный случай.
    – VladD
    5 мар 2017 в 17:10
  • @sp7: Если это нежелательно, имеет смысл, вероятно, писать собственный контейнер, с блекджеком^W MeasureOverride и ArrangeOverride.
    – VladD
    5 мар 2017 в 17:14
  • VladD, просто насколько я понял вопрос, первоначально последний элемент тоже должен быть растянут.
    – sp7
    5 мар 2017 в 17:41
  • @sp7: Это да. Так что можно считать мой ответ частичным решением.
    – VladD
    5 мар 2017 в 18:58

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.