DroidScript

Знакомство с Qt Quick

DroidScript
инструменты для мобильной разработки

Знакомство с Qt Quick

Оглавление 

Qt Quick представляет собой набор технологий для создания динамических пользовательских интерфейсов при помощи языка QML. QML – язык программирования и одновременно его интерпретатор, который предоставляет API для совместного использования QML-кода, JavaScript и C++. Таким образом, Qt Quick является коллекцией следующих технологий:

  • QML
  • JavaScript
  • Qt C++

Взаимосвязь между ними следующая: QML, со встроенным в него движком JavaScript, является средством разработки внешнего представления – интерфейса (front-end), а Qt C++ используется для внутренней реализации (back-end). В языковой инфраструктуре QML нет конструкций программирования – циклов, условных операторов и др. Для их реализации как раз и предназначен встроенный движок JavaScript. Благодаря этому QML позволяет создавать приложения без использования С++, для выполнения которых достаточно использовать интерпретатор QML-кода, например, qmlscene.exe, входящей в комплект поставки.

Qt Quick включает в себя модуль QtQml и QtQuick. Первый обеспечивает QML-движок и языковую инфраструктуру, а второй - предоставляет визуальный холст и включает все типы (объекты), необходимые для создания и анимации визуальных компонентов, пользовательского ввода, создания моделей данных и представлений, использования хранилищ данных, работы с мультимедиа, сетями, системами частиц, графическими эффектами и др.

Для включения в проект возможностей Qt Quick в проектный файл qmake .pro необходимо включить строку QT += qml

Структура QML-кода похожа на HTML и в первом приближении напоминает связку технологий HTML, CSS и JavaScript. Но, в отличие от языка разметки haml в С# и xml в Java, QML является описательным языком программирования, в котором задаётся не только разметка и внешний вид элементов, но и описывается их поведение, а также реакцию на события. Это сделано для более удобного взаимодействия между дизайнерами и программистами, которым предлагается  единый и простой инструмент для совместной разработки действующего прототипа. Дизайнеру может показаться, что такой инструмент ограничивает его творческие возможности. Но, если посмотреть на мобильную, настольную или Web-разработку, то везде существуют если не правила, то рекомендации по тому, как создавать удобные для пользователей интерфейсы. И понимание дизайнером возможностей и ограничений сред прототипирования, разработки и выполнения принесёт огромную пользу всей работе, особенно в том случае, когда он и программист работают в одной визуально-функциональной среде. Проблема состоит в том, что дизайнер, как правило, работает со статичными изображениями интерфейса и создаёт статичные изображения, которое верстальщик или программист должен реализовать в другой рабочей среде. Чем точнее нужно отразить изображение интерфейса на рисунке, тем больше времени и сил на это уйдёт. Даже при вёрстке пиксель в пиксель  результат будет лишь приблизительно соответствовать тому, на который рассчитывал дизайнер, поскольку технических характеристики экранов, их заводские и пользовательские настройки отличаются. На дорогом и откалиброванном мониторе дизайнера картинка живая и читаемая, а на мониторе пользователей (заказчика, программиста, потребителей) - пастельные тона и хочется (а чаще не хочется или непонятно как это сделать) что-то поднастроить.

Для облегчения работы по превращению изображения в действующий интерфейс можно воспользоваться системами разработки действующих прототипов, но и здесь возникают проблемы, так как отображение внешних представлений в среде прототипирования будет отличаться от отображения их в среде выполнения приложения. В качестве примера достаточно посмотреть на то, как разные браузеры отображают одни и те же элементы управления. Прототип интерфейса является приблизительным наброском, и его разработчик будет видеть не то, что программист и конечный пользователь программного продукта, особенно если они будут использоваться в разных операционных средах и на разных устройствах. QML как раз и призван оказать помощь в данном вопросе: и заказчик, и дизайнер (верстальщик), и программист работают в одной визуально-функциональной среде, которая позволяет создавать, тестировать и видеть работу прототипа в разных операционных системах и устройствах. После отладки полученный прототип интерфейса можно использовать (без изменения) в качестве рабочего для приложения, при необходимости дополнив его функциональностью на Qt C++.

Рассмотрим пример QML-документа

Документ QML состоит из двух разделов - импорта и объявления объекта. В разделе импорта производится подключение необходимых модулей (библиотек) при помощи директивы import. Рядом с названием модуля указывается номер его версии. Это позволяет сохранить поведение приложений, использующих старые модули, при появлении новых.

Модуль QtQuick обеспечивает поддержку основных компонентов – Item, Rectangle и др., а QtQuick.Controls – элементов управления – Button и др.

В разделе объявления объекта расположено дерево объявлений QML-элементов. Данное дерево должно содержать один корневой элемент. В показанном примере корневым элементом является Item.

Объявление элемента состоят из названия его типа, начинающегося с заглавной буквы, и блока, заключённого в фигурные скобки, в котором указывается информация об объекте:

<ТипОбъекта> {
  <ИмяСвойства>: <ЗначениеСвойства>
}

Помимо встроенных типов – Item и Button и др. также существует возможность создания пользовательских типов, используя графические и поведенческие блоки.

В объявлениях типов можно не только указать информация о том, где и как на визуальной сцене будут располагаться соответствующие объекты, но и описать (запрограммировать) действия, которые необходимо выполнить при поступлении сигнала (события). Для этого QML-элементы могут быть дополнены функциями и вставками кода  на JavaScript. Если в проекте используется большое количество функций на JavaScript, то их можно поместить в отдельный файл с расширением js и импортировать в проект:

Import ”lib.js” as Mylib, где Mylib – ассоциированное с файлом имя (пространство имён).

Вызов функций данного файла производится через ассоциированное с ним имя, например,  Mylib.MyFunction().

При программировании на QML используется модульный подход и простые описательные инструкции, но сама технология Qt Quick весьма объёмна и функциональна, что потребует время на её осмысление и изучение. Стоит ли его тратить? Ответить на этот вопрос поможет только практика, а пока можно привести лишь некоторые её возможности:

  • Простой синтаксис
  • Создание приложений без использования С++
  • Быстрое создание  и тестирование прототипов в разных операционных средах и на разных устройствах с использованием или без использования их эмуляторов
  • QML может работать совместно с C++ для создания эффективных приложений, удобных для работы с ними пользователей
  • Изменение кода и его просмотр на лету без компиляции и установки
  • Перспективы. В планах по развитию Qt Quick стоит задача его более тесной интеграции с Web и выполнения QML-кода в браузерах

Удобная среда разработки Qt Creator, которая входит в состав кроссплатформенного фреймворка Qt, предназначенного для разработки программного обеспечения на языке программирования C++

Оглавление 
© 2016 droidscript.ru admin@droidscript.ru