Тип QML SplitView

Выравнивает элементы с перетаскиваемым разделителем между каждым элементом. Подробнее...

• Список всех членов, включая унаследованные члены

Свойства

• handle : Компонент
• orientation : перечисление
• resizing : bool

Присоединённые свойства

• fillHeight : bool
• fillWidth : bool
• maximumHeight : real
• maximumWidth : real
• minimumHeight : real
• minimumWidth : real
• preferredHeight : real
• preferredWidth : real
• view : SplitView

Методы

• bool restoreState(state)
• var saveState()

Подробное описание

SplitView — это элемент управления, который выравнивает элементы по горизонтали или вертикали с перетаскиваемым разделителем между каждым элементом.

SplitView поддерживает следующие присоединённые свойства для управляемых им элементов:

• SplitView.minimumWidth
• SplitView.minimumHeight
• SplitView.preferredWidth
• SplitView.preferredHeight
• SplitView.maximumWidth
• SplitView.maximumHeight
• SplitView.fillWidth (true только для одного дочернего элемента)
• SplitView.fillHeight (true только для одного дочернего элемента)

Кроме того, каждый разделитель имеет следующие только для чтения присоединённые свойства:

• SplitHandle.hovered
• SplitHandle.pressed

Примечание: Разделители должны быть чисто визуальными и не обрабатывать события, так как это может повлиять на их состояния hovered и pressed.

Предпочтительный размер элементов в SplitView можно задать с помощью implicitWidth и implicitHeight или SplitView.preferredWidth и SplitView.preferredHeight.

SplitView {
    anchors.fill: parent

    Item {
        SplitView.preferredWidth: 50
    }

    // ...
}

Для горизонтального SplitView нет необходимости указывать предпочтительную высоту каждого элемента, так как они будут изменены до высоты представления. Это относится и к вертикальным представлениям в обратном порядке.

Когда разделитель перетаскивается, свойство SplitView.preferredWidth или SplitView.preferredHeight перезаписывается в зависимости от orientation представления.

Чтобы ограничить размер элементов в горизонтальном представлении, используйте следующие свойства:

SplitView {
    anchors.fill: parent

    Item {
        SplitView.minimumWidth: 25
        SplitView.preferredWidth: 50
        SplitView.maximumWidth: 100
    }

    // ...
}

Чтобы ограничить размер элементов в вертикальном представлении, используйте следующие свойства:

SplitView {
    anchors.fill: parent
    orientation: Qt.Vertical

    Item {
        SplitView.minimumHeight: 25
        SplitView.preferredHeight: 50
        SplitView.maximumHeight: 100
    }

    // ...
}

В SplitView всегда будет один элемент (элемент fill), у которого свойство SplitView.fillWidth установлено в значение true (или SplitView.fillHeight, если orientation имеет значение Qt.Vertical). Это означает, что элемент получит всё оставшееся пространство после размещения других элементов. По умолчанию последний видимый дочерний элемент SplitView будет иметь это значение, но его можно изменить, явно установив fillWidth в значение true для другого элемента.

Разделитель может принадлежать элементу слева или сверху, или справа или снизу:

• Если элемент fill находится справа: разделитель принадлежит левому элементу.
• Если элемент fill находится слева: разделитель принадлежит правому элементу.

Чтобы создать SplitView с тремя элементами и позволить центральному элементу получить избыточное пространство, можно сделать следующее:

SplitView {
    anchors.fill: parent
    orientation: Qt.Horizontal

    Rectangle {
        implicitWidth: 200
        SplitView.maximumWidth: 400
        color: "lightblue"
        Label {
            text: "View 1"
            anchors.centerIn: parent
        }
    }
    Rectangle {
        id: centerItem
        SplitView.minimumWidth: 50
        SplitView.fillWidth: true
        color: "lightgray"
        Label {
            text: "View 2"
            anchors.centerIn: parent
        }
    }
    Rectangle {
        implicitWidth: 200
        color: "lightgreen"
        Label {
            text: "View 3"
            anchors.centerIn: parent
        }
    }
}

Сериализация состояния SplitView

Основная цель SplitView — позволить пользователям легко настраивать размер различных элементов пользовательского интерфейса. Кроме того, предпочтительные размеры пользователя должны сохраняться между сеансами. Для этого значения свойств SplitView.preferredWidth и SplitView.preferredHeight можно сериализовать с помощью функций saveState() и restoreState():

import QtQuick.Controls
import Qt.labs.settings

ApplicationWindow {
    // ...

    Component.onCompleted: splitView.restoreState(settings.splitView)
    Component.onDestruction: settings.splitView = splitView.saveState()

    Settings {
        id: settings
        property var splitView
    }

    SplitView {
        id: splitView
        // ...
    }
}

В качестве альтернативы, можно использовать функции Settings value() и setValue():

import QtQuick.Controls
import Qt.labs.settings

ApplicationWindow {
    // ...

    Component.onCompleted: splitView.restoreState(settings.value("ui/splitview"))
    Component.onDestruction: settings.setValue("ui/splitview", splitView.saveState())

    Settings {
        id: settings
    }

    SplitView {
        id: splitView
        // ...
    }
}

См. также SplitHandle, Настройка SplitView и Элементы управления контейнерами.

Документация по свойствам

handle : Component

Это свойство содержит компонент разделителя.

Экземпляр этого компонента будет создаваться count - 1 раз, до тех пор, пока count больше чем 1.

Следующая таблица объясняет, как каждый разделитель будет масштабироваться в зависимости от ориентации представления SplitView:

См. также Настройка SplitView.

orientation : перечисление

Это свойство содержит ориентацию SplitView.

Ориентация определяет, как выравниваются разделенные элементы:

Возможные значения:

[только для чтения] resizing : bool

Это свойство равно true когда пользователь изменяет размер элементов разделения, перетаскивая разделители.

Документация по присоединённым свойствам

SplitView.fillHeight : bool

Это присоединённое свойство определяет, занимает ли элемент оставшееся пространство в SplitView после размещения всех других элементов.

По умолчанию последний видимый дочерний элемент SplitView будет иметь это значение, но его можно изменить, явно установив fillHeight в значение true для другого элемента.

Высота элемента SplitView с fillHeight установленным в true всё ещё ограничена его minimumHeight и maximumHeight.

См. также minimumHeight, preferredHeight, maximumHeight и fillWidth.

SplitView.fillWidth : bool

Это присоединённое свойство определяет, занимает ли элемент оставшееся пространство в SplitView после размещения всех других элементов.

По умолчанию последний видимый дочерний элемент SplitView будет иметь это значение, но его можно изменить, явно установив fillWidth в значение true для другого элемента.

Ширина элемента SplitView с fillWidth установленным в true всё ещё ограничена его minimumWidth и maximumWidth.

См. также minimumWidth, preferredWidth, maximumWidth и fillHeight.

SplitView.maximumHeight : real

Это присоединённое свойство управляет максимальной высотой элемента разделителя. Свойство preferredHeight ограничено значениями minimumHeight и maximumHeight. Элемент разделителя нельзя перетащить, чтобы он стал больше, чем его maximumHeight.

Значение по умолчанию — Infinity. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

См. также minimumHeight, preferredHeight, fillHeight и maximumWidth.

SplitView.maximumWidth : real

Это присоединённое свойство управляет максимальной шириной элемента разделителя. Свойство preferredWidth ограничено значениями minimumWidth и maximumWidth. Элемент разделителя нельзя перетащить, чтобы он стал больше, чем его maximumWidth.

Значение по умолчанию — Infinity. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

См. также minimumWidth, preferredWidth, fillWidth и maximumHeight.

SplitView.minimumHeight : real

Это присоединённое свойство управляет минимальной высотой элемента разделителя. Свойство preferredHeight ограничено значениями minimumHeight и maximumHeight. Элемент разделителя нельзя перетащить, чтобы он стал меньше, чем его minimumHeight.

Значение по умолчанию — 0. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

См. также maximumHeight, preferredHeight, fillHeight и minimumWidth.

SplitView.minimumWidth : real

Это присоединённое свойство управляет минимальной шириной элемента разделителя. Свойство preferredWidth ограничено значениями minimumWidth и maximumWidth. Элемент разделителя нельзя перетащить, чтобы он стал меньше, чем его minimumWidth.

Значение по умолчанию — 0. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

См. также maximumWidth, preferredWidth, fillWidth и minimumHeight.

SplitView.preferredHeight : real

Это присоединённое свойство управляет предпочтительной высотой элемента разделителя. Предпочтительная высота будет использоваться как размер элемента и будет ограничена значениями minimumHeight и maximumHeight. Если предпочтительная высота не задана, будет использоваться implicitHeight элемента.

При изменении размера элемента разделителя свойство preferredHeight будет установлено для отслеживания нового размера.

По умолчанию это свойство не задано, и вместо этого используется implicitHeight. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

Примечание: Не устанавливайте свойство height элемента разделителя, так как оно будет перезаписываться при каждом вычислении компоновки SplitView.

См. также minimumHeight, maximumHeight, fillHeight и preferredWidth.

SplitView.preferredWidth : real

Это присоединённое свойство управляет предпочтительной шириной элемента разделителя. Предпочтительная ширина будет использоваться как размер элемента и будет ограничена значениями minimumWidth и maximumWidth. Если предпочтительная ширина не задана, будет использоваться implicitWidth элемента.

При изменении размера элемента разделителя свойство preferredWidth будет установлено для отслеживания нового размера.

По умолчанию это свойство не задано, и вместо этого используется implicitWidth. Чтобы сбросить это свойство до значения по умолчанию, установите его в undefined.

Примечание: Не устанавливайте свойство width элемента разделителя, так как оно будет перезаписываться при каждом вычислении компоновки SplitView.

См. также minimumWidth, maximumWidth, fillWidth и preferredHeight.

SplitView.view : SplitView

Это присоединённое свойство содержит представление разделителя для элемента, к которому оно прикреплено, или null если элемент не находится в представлении разделителя.

Документация по методам

bool restoreState(state)

Считывает предпочтительные размеры из state и применяет их к элементам разделителя.

Возвращает true если состояние было успешно восстановлено, в противном случае false.

См. также Сериализация состояния SplitView и saveState().

var saveState()

Сохраняет предпочтительные размеры элементов разделителя в массив байтов и возвращает его.

См. также Сериализация состояния SplitView и restoreState().