Компоненты Qt QML—ArcGIS AppStudio

Помимо компонентов AppStudio QML, доступных вам для разработки пользовательского интерфейса приложения, у вас есть доступ ко всем QML-компонентам The Qt Company. В данном разделе рассмотрены самые полезные компоненты. Для получения полного списка типов Qt QML обратитесь к документации по Qt.

Ниже приведены некоторые из наиболее часто используемых типов QML:

Позиционеры
Якоря
Компоновки
Повторители
Состояния
Подключения

Внимание:

Различия наблюдались в отображении элементов пользовательского интерфейса (UI) в приложениях AppStudio и образцах при переходе с Qt 5.13.1 на Qt 5.15.2. Некоторые различия включают положение, размер, компоновку, цвет, обрезку, обтекание и шрифт. Проверьте отображение всех элементов пользовательского интерфейса ваших приложений. В некоторых случаях вам может потребоваться изменить вложение ваших компонентов; в других случаях может потребоваться определение дополнительных или меньшего количества свойств. Поскольку существует большая гибкость в том, как определены элементы пользовательского интерфейса в QML, нет установленных правил.

В версии 5.15.2 типы свойств Qt, такие как bool, string и int являются строгими и больше не поддерживают нулевые или неопределенные значения. Если ваше приложение использует эти типы, вы должны подумать о том, как поддерживать нулевые или неопределенные значения. Вы также можете использовать тип свойства var, который допускает нулевые и неопределенные значения, а также все другие возможные значения.

Позиционеры

Позиционеры – это элементы-контейнеры, управляющие положением элементов пользовательского интерфейса. Типы позиционеров – строка, столбец, сетка и поток. Организация ваших элементов с использованием позиционеров позволит вам упорядочить их, создав компоновку, подходящую для пользовательских интерфейсов изменяемого размера. К примеру, организовав свои элементы в сетку, при просмотре приложения в портретной ориентировке вы увидите матрицу 2 на 5 элементов, но при переключении на альбомную компоновку сетка проведет новое упорядочение элементов сетки, чтобы они поместились на экране, в результате чего появится матрица размером 3 на 4 элемента.

Подробнее о позиционерах см. в документации Qt.

Якоря

У каждого элемента есть семь точек-якорей, относительно которых можно позиционировать другие элементы. Это точки: верх, низ, слева, справа, центр по горизонтали, центр по вертикали, и базовая линия (линия, на которой размещается текст в элементе). Для создания динамических интерфейсов отлично подходит такое позиционирование элементов. Якоря остаются даже при изменении измерений и местоположений элементов. Могут также задаваться поля якорей, определяющие, сколько пространства снаружи якоря элемента.

Подробнее о якорях см. в документации Qt.

Компоновки

Для использования компоновок Qt Quick Layouts вам понадобится файл дополнительного модуля QML, например:

import QtQuick.Layouts 1.15

Три компоновки – это RowLayout (строки), ColumnLayout (столбцы) и GridLayout (сетка). По сравнению со строками, столбцами и сеткой использование компоновок позволит вам более точно контролировать позиционирование элементов. Это включает в том числе возможность задания выравнивания для каждого элемента компоновки. В GridLayouts также позволяет задать промежутки между столбцами и строками, распределить элементы по вертикали и по горизонтали, а также задать для элемента индивидуальную ячейку. Компоновки могут использоваться для задания максимальных значений ширины и высоты, а также возможности их заполнения для каждого элемента. Это особенно важно при разработке интерфейса для динамических экранов и для нескольких экранов. Компоновки можно зеркально отображать, меняя порядок элементов "слева направо" на "справа налево".

Повторители

Повторитель создает элементы из шаблона, предназначенные для использования с позиционерами, с помощью данных модели. Сочетание повторителей и позиционеров – легкий способ настройки большого числа элементов. Типы модели указаны ниже.

Номер, означающий число представителей, созданных повторителем
Свободный список исходных данных – ListModel
Список строк
Список объектов

Представитель содержит шаблон, определяющий каждый элемент, созданный повторителем. Представитель повторителя может получить свой индекс в повторителе, а также подходящие данные модели.

Подробнее о повторителях см. в документации Qt.

Состояния

Состояния можно использовать для показа различных видов или экранов в приложении. Можно использовать их, чтобы показать или скрыть элементы на основании значения свойства, для изменения якоря или изменения родительских объектов. В зависимости от состояния можно запускать, останавливать и ставить на паузу анимации или выполнение скриптов. У каждого основанного на элементе компонента есть свойство состояния и состояние по умолчанию. Состояние по умолчанию – то есть пустая строка ("") – содержит все начальные значения свойств. Задание для свойства состояния как пустой строки загрузит состояние по умолчанию.

Подробнее о состояниях см. в документации Qt.

Подключения

В Qt5.15 появился новый синтаксис для подключений. Предыдущий метод создания обработчика on <Signal> устарел, и теперь следует соблюдать синтаксис функции. Ниже приведено предупреждающее сообщение, которое вы получите при запуске приложения с использованием предыдущего синтаксиса подключения:

qrc:/qml/main.qml:277:5: QML Connections: Implicitly defined onFoo properties in Connections are deprecated. Use this syntax instead: function onFoo (<arguments>) { ... }

В следующем примере показано, как обычно определялось подключение в версии Qt 5.13 и более ранних:

Connections { 
     target: mouseArea 
     onPositionChanged: { 
         console.log( "onPositionChanged: ", mouse.x, mouse.y ); 
     } 
     onPressedChanged: { 
         console.log( "onPressedChanged: ", mouseArea.pressed ); 
     } 
}

В следующем примере показано, как должно быть определено подключение в версии Qt 5.15 и более новых:

Connections { 
     target: mouseArea 
     function onPositionChanged(mouse) { 
         console.log( "onPositionChanged: ", mouse.x, mouse.y ); 
     } 
     function onPressedChanged() { 
         console.log( "onPressedChanged: ", mouseArea.pressed ); 
     } 
}

Теперь, когда используется синтаксис функции, вы должны убедиться, что все параметры сигнала указаны явно. Если вы их пропустите, параметры сигнала не будут доступны по их имени, и это может привести к неопределенным ссылкам в вашем коде. Например, используйте function onPositionChanged(mouse) вместо onPositionChanged.

При перечислении параметров сигнала рекомендуется указывать все параметры в правильном порядке, используя формальные имена параметров сигнала в качестве имен параметров функции. Например, используйте function onPositionChanged(mouse), а не function onPositionChanged(m).

Если сигнал предназначен для изменения свойства, вы должны явно назвать объект для доступа к свойству. Например, используйте mouseArea.pressed вместо pressed.

Подробнее о подключениях см. в документации Qt.

Отзыв по этому разделу?