Урок №1. Введение в Qt и установка Qt Creator

С каждым годом становится все больше операционных систем, и потому разработчикам все труднее удовлетворять потребности пользователей. Три самые популярные компьютерные платформы — Windows, Linux и Mac OS, а также три мобильные — Android, iOS и Windows Mobile — продолжают активно бороться между собой. А это значит, что качественное приложение должно работать на всех основных платформах.

Справиться с этой проблемой помогает кроссплатформенная разработка. Об одной из самых популярных кроссплатформенных сред разработки — Qt Creator — и пойдёт речь в этой статье. Мы рассмотрим как выполняется установка и настройка Qt Creator, а также как работать в Qt Creator.

Что такое Qt Creator

Qt Creator (не так давно имевший название Greenhouse) — это одна из самых распространенных кроссплатформенных IDE. Ее плюсы — удобство, быстрота работы, а также — свободность, так как это ПО с открытым исходным кодом. Поддерживаются такие языки, как C, С++, QML.

Программа была написана компанией под названием Trolltech, которая в полной мере выполнила цель создания среды — работу с графическим фреймворком Qt. Удобный графический интерфейс с поддержкой Qt Widgets и QML, а также большое число поддерживаемых компиляторов позволяют быстро и удобно создать свое кроссплатформенное приложение.

Главная задача этой IDE — обеспечить наиболее быструю кроссплатформенную разработку, используя собственный фреймворк. Благодаря этому разработчики получают прекрасную возможность не писать приложения нативно (т. е. отдельно под каждую платформу), а создать общий код, и, возможно, подогнать его под особенности используемых ОС.

Qt Creator также включает в себя утилиту Qt Designer, что позволяет обработать внешний вид окна приложения, добавляя и перетаскивая элементы (аналогично Windows Forms в Visual Studio). В качестве систем сборки используются qmake, cmake и autotools.

Итак, пора рассмотреть как установить Qt Creator. Если для Windows разработчики позаботились и сделали оффлайн-установщик, то в Linux 32-bit этой возможности не предусмотрено. Поэтому во время установки вам может потребоваться стабильное интернет-соединение (~20-30 минут). Для начала скачаем установщик:

После окончания загрузки переходим в папку с файлом, нажимаем правой кнопкой мыши и выбираем пункт «Свойства».

Теперь перейдем на вкладку «Права» и поставим галочку «Разрешить запуск этого файла в качестве программы».

Запускаем программу.

Теперь нажимаем «Next».

Здесь необходимо выбрать существующий аккаунт или создать его. Данное действие необходимо для проверки лицензии (коммерческой или некоммерческой).

Нажимаем «Next».

Выбираем директорию, в которой будет находиться Qt. Важно, чтобы в пути не было кириллицы и пробелов!

В этом меню находится выбор компонентов. К примеру, можно выбрать установку инструментов для разработки на Android, или же исходных компонентов (это нужно для статической сборки, если кому-то это нужно — напишите в комментариях, и я напишу отдельную статью). Если Вы не уверены, нужны Вам эти компоненты или нет, оставьте их пока так — даже после установки Qt будет возможным удаление и добавление элементов.

В этом окне принимаем лицензию. Жмем «Next».

Если Вы готовы, начинайте установку. У Вас запросят пароль суперпользователя (sudo), после чего начнется скачивание и извлечение файлов. Альтернативный способ — установка через терминал. Для начала необходимо обновить список пакетов.

Скачиваем и устанавливаем Qt:

Теперь установка Qt Creator:

И, если нужно, исходники.

После окончания установки перезагрузите компьютер и запустите Qt Creator. Перейдите в меню «Инструменты» -> «Параметры».

Здесь следует рассмотреть несколько вкладок.

1. Среда — это настройка внешнего вида самой IDE, а также изменение сочетаний клавиш и управление внешними утилитами.

2. Текстовый редактор — здесь идет настройка внешнего вида, шрифтов и расцветки редактора.

3. C++ — подсветка синтаксиса, работа с расширениями файлов и UI (т. е. формами).

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

Установка компонентов Qt Creator

Если вдруг так случилось, что Вы забыли установить какой-то компонент, или, наоборот, хотите его удалить, то на помощь придет Qt Maintenance Tool. Это инструмент, позволяющий управлять всеми компонентами Qt Creator.

Чтобы запустить его, перейдите в меню приложений, выберите пункт «Разработка» -> «Qt Maintenance Tool».

Выберите необходимый пункт (Удалить/добавить компоненты, обновить компоненты или удалить Qt). После выполните необходимые операции и закройте окно.

Работа с Qt Creator — первый проект

Ну что же, час пробил! Установка Qt Creator завершена. Пора сделать свое первое кроссплатформенное приложение на Linux, а затем скомпилировать его на Windows. Пусть это будет… программа, выводящая иконку Qt, кнопку и надпись, на которую по нажатию кнопки будет выводиться случайная фраза. Проект несложный, и, конечно же, кроссплатформенный!

Для начала откроем среду разработки. Нажмем «Файл» -> «Создать файл или проект…». Выберем приложение Qt Widgets — его быстро и удобно сделать. А название ему — «Cross-Platphorm». Вот как!

Комплект — по умолчанию. Главное окно тоже оставляем без изменений. Создаем проект.

Для начала необходимо настроить форму — главное окно приложения. По умолчанию оно пустое, но это не останется надолго.

Перейдем в папку «Формы» -> «mainwindow.ui». Откроется окно Qt Designer:

Удаляем панель меню и панель инструментов на форму, нажав правой кнопкой мыши и выбрав соответствующий пункт. Теперь перетаскиваем элементы Graphics View, Push Button и Label таким образом:

Чтобы изменить текст, дважды кликните по элементу. В свойствах Label (справа) выбираем расположение текста по вертикали и по горизонтали — вертикальное.

Теперь пора разобраться с выводом иконки. Перейдем в редактор, слева кликнем по любой папке правой кнопкой мыши и выберем «Добавить новый…». Теперь нажимаем «Qt» -> «Qt Resource File». Имя — res. В открывшемся окне нажимаем «Добавить» -> «Добавить префикс», а после добавления — «Добавить файлы». Выбираем файл, а в появившемся окне «Неверное размещение файла» кликаем «Копировать».

Получилось! Сохраняем все. Снова открываем форму. Кликаем правой кнопкой мыши по Graphics View, выбираем «styleSheet…» -> «Добавить ресурс» -> «background-image». В левой части появившегося окна выбираем prefix1, а в правой — нашу картинку. Нажимаем «ОК». Настраиваем длину и ширину.

Все! Теперь можно приступать к коду.  Клик правой кнопкой мыши по кнопке открывает контекстное меню, теперь надо нажать «Перейти к слоту…» -> «clicked()». В окне набираем следующий код:

Или вы можете скачать полный проект на GitHub. Работа с Qt Creator завершена, нажимаем на значок зеленой стрелки слева, и ждем запуска программы (если стрелка серая, сначала нажмите на значок молотка). Запустилось! Ура!

Установка и настройка Qt Creator завершена. Теперь вы сможете создавать свои программы под огромное число платформ, оставляя код нетронутым! Кстати, установив Qt на Windows, вы сможете скомпилировать этот проект и там. Удачи вам!

В этом уроке мы познакомимся с кроссплатформенным фреймворком Qt и установим IDE для работы с ним.

Оглавление:

Введение в Qt

Qt является кроссплатформенным (не зависящим от платформы/ОС) фреймворком для разработки приложений на языке С++. С помощью Qt были разработаны такие известные приложения, как: KDE, Opera, Google Earth и Skype. Впервые Qt был опубликован в мае 1995 года.

Qt5 подразумевает двойное лицензирование, а это означает, что Qt может быть использован в некоммерческих целях для создания приложений с открытым исходным кодом, а также как лицензия для коммерческих клиентов. За счёт использования собственного фреймворка и мощного инструментария Qt позволяет быстро и удобно создавать собственные кроссплатформенные приложения. Кроме того, команды разработчиков получают возможность работать на разных платформах, используя при этом общие инструменты для разработки и отладки. Весь инструментарий Qt с открытым исходным кодом вы можете найти на сайте qt.io.

Изначально Qt был разработан Норвежской компанией по разработке программного обеспечения Trolltech. В 2008 году компанию приобрела Nokia. Спустя четыре года в августе 2012 программные технологии Qt выкупила финская компания-разработчик Digia. Сейчас Qt развивается компанией QT Company, которая являющейся дочерней компанией Digia, и как проект Qt под открытым исходным кодом, с участием отдельных разработчиков и фирм.

Установка Qt Creator в Linux

Шаг №1: Мы будем устанавливать IDE с открытым исходным кодом. Для этого переходим по ссылке и выбираем самую последнюю версию Qt 5.13:

В этих уроках используется операционная система Linux (Debian 9.x 64-bit), поэтому мы скачиваем qt-opensourse-linux-x64-5.13.0.run, но вы также можете использовать соответствующие файлы Qt для Windows или Mac:

После окончания загрузки переходим в папку с необходимым нам файлом, нажимаем по нему правой кнопкой мыши и выбираем «Свойства». В закладке «Основные» видим «Имя», «Тип», «Размер файла», а также наименование родительской папки:

Переходим на вкладку «Права» и ставим галочку в поле «Разрешить выполнение файла как программы»:

Закрываем «Свойства» и запускаем программу.

Шаг №2: На следующем этапе установщик сообщает, что нам предоставлена версия с открытым исходным кодом Qt 5.13.0. Дальнейшая установка Qt предполагает регистрацию в Qt и создание Qt Account, который предоставляет доступ ко всем возможностям Qt. Кроме того, данное действие необходимо для проверки лицензии (коммерческая/некоммерческая). Если у вас уже есть учётная запись в Qt Account, то используйте кнопку «Next».

Если учётной записи в Qt Account у вас ещё нет, то её можно создать сейчас: для этого перейдите по соответствующей ссылке в установщике, и вы будете перенаправлены на сайт qt.io в соответствующий раздел, или просто используйте кнопку «Next» — вы сможете это сделать в следующем шаге:

Шаг №3: Здесь необходимо ввести логин и пароль от Qt Account или создать Qt Account, если его ещё нет. Кнопка «Next» переводит нас на следующий этап:

 Добро пожаловать в настройки Qt 5.13.0! Для перехода к следующему шагу нажимаем «Далее»:

Шаг №4: Выбираем каталог для установки Qt 5.13.0. Обратите внимание, адрес каталога указывается латинскими буквами (без кириллицы) и без пробелов! После того, как выбрали каталог, нажимаем «Далее»:

Шаг №5: Выбираем компоненты, которые хотим установить. Если на данном этапе нет уверенности в выборе конкретных компонентов, то добавление и удаление можно будет сделать позже, после установки программы:

Шаг №6: Принимаем лицензионное соглашение:

И нажимаем на кнопку «Установить»:

Для завершения установки нажимаем «Завершить». После завершения загрузки Qt Creator запустится самостоятельно (для этого необходимо по умолчанию оставить галочку в поле «Launch Qt Creator»):

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

Поздравляем! Qt Creator установлен.

Установка через командную строку в Linux

Ещё одним альтернативным и простым способом установки Qt Creator в Linux на основе Debian является установка из пакетов. Если при работе с Linux вы используете терминал, то перед скачиванием и установкой Qt Creator программа запросит пароль sudo пользователя. Только после этого начнётся скачивание и извлечение файлов. Обычно пакты Linux не содержат последней версии Qt и их необходимо обновить. Ниже приведен алгоритм действий, позволяющий за 4 шага установить Qt Creator через терминал.

Шаг №1. Обновление:

$ sudo apt update

Шаг №2. Скачивание и установка Qt:

$ sudo apt install qt5-default

Шаг №3. Установка Qt Creator:

$ sudo apt install qtcreator

Шаг №4. Исходники:

$ sudo apt install qtbase5-examples qtdeclarative5-examples

Установка Qt Creator в Windows

Перво-наперво нам нужно скачать установочный пакет Qt. Вы можете это сделать, обратившись к официальному сайту qt.io. Либо же воспользоваться альтернативным вариантом и скачать с какого-нибудь «зеркала», например c этого (полный список всех «зеркал» находится здесь):

Нажимаем на official_releases/ и переходим к online_installers/:

Нажимаем на online_installers/ и скачиваем файл qt-unified-windows-x86-online.exe:

Запустив скачанный файл, видим перед собой приветствие «Qt Online Installer». Нажимаем Next:

Далее у нас спросят о наличии Qt-аккаунта. Можно смело нажимать Skip и двигаться дальше:

Затем снова Далее:

Теперь нам нужно указать путь установки Qt. Для простоты я выбрал C:Qt:

На следующем шаге нам нужно выбрать набор компиляторов, которыми мы будем пользоваться в наших уроках. Я предлагаю ограничиться выбором пакета MinGW 7.3.0 32-bit, а остальные метки поставить так, как указано на скриншоте ниже:

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

Создание проекта

Вначале нам необходимо создать проект. Сразу скажу, что наша программа будет консольным приложением. Для этого выберите Файл > Создать файл или проект… или можно воспользоваться сочетанием клавиш Ctrl+N:

Перед вами появится «Мастер настройки проектов». В левой колонке отметьте пункт Приложение, а затем в правой — Консольное приложение Qt:

На следующем шаге нужно будет указать имя для нашей будущей программы и папку, где будут располагаться файлы проекта. У меня это My_QtApplication и C:devQt_Project соответственно:

На следующем шагу без изменений, поэтому просто нажимаем кнопку Далее:

Теперь нам нужно выбрать набор компиляторов, который мы будем использовать для сборки своего проекта. Я настоятельно вам рекомендую выбрать Desktop Qt 5.13.0 MinGW 32-bit (сняв при этом отметки с остальных, если они у вас есть):

На последнем шагу нажимаем Завершить:

Теперь вы можете увидеть автоматически сгенерированный Qt-проект консольного приложения. Давайте рассмотрим его подробнее:

В корневой папке у нас лежит файл My_QtApplication.pro — это основной файл настроек проекта. Мы разберём его позже, а пока обратим своё внимание на папку «Исходники», в которой расположен файл main.cpp. Данный файл содержит минимальный исходный код нашей программы. Он был автоматически сгенерирован средствами Qt. Я не буду вдаваться в детальное описание класса QCoreApplication, скажу лишь, что он предоставляет обработку сообщений для консольного приложения Qt и является особенностью архитектуры построения Qt-приложений.

Первая программа

Перед вами исходный код файла main.cpp, задача которого вывести информацию о версии библиотеки Qt5:

Функция qVersion() возвращает строку, которая содержит  информацию о версии библиотеки Qt. Теперь можно запустить нашу программу и посмотреть на результат её выполнения: для этого нажмите на большой зелёный треугольник в левом нижнем углу или воспользуйтесь сочетанием клавиш Ctrl+R:

Заключение

В данном уроке мы рассмотрели установку пакета Qt5 под Linux и Windows, сделали первые шаги в создании своего собственного проекта консольного приложения и даже вывели в консоль первый текст с номером установленной версии Qt.

Включает в себя графический интерфейс отладчика и визуальные средства разработки интерфейса как с использованием QtWidgets, так и QML. Поддерживаемые компиляторы: GCC, Clang, MinGW, MSVC, Linux ICC, GCCE, RVCT, WINSCW.

Основные возможности

• Поддерживает системы сборки qmake, cmake, autotools
• Редактора исходных кодов
• Редактирования этапов сборки проекта
• Автодополнение кода
• Подсветка кода
• Возможность задания стиля выравнивания, отступов и постановки скобок.
• И другие.

Установить Qt Creator в Ubuntu/Linux mint и другие

Для установки этой IDE, вам понадобится скачать скрипт-установщик, который существует как онлайн-установщик, так и обычная версия.

Для скачивания онлайн-установщика, нажмите на кнопку ниже

После скачивания скрипта, вам необходимо добавить право на запуск, открываем терминал(Ctrl+Alt+T) и вводим следующую команду

sudo chmod +x qt-unified-linux-x64-2.0.5-online.run

И запустите установку

sudo ./qt-unified-linux-x64-2.0.5-online.run

После этого вы увидите знакомый графический установщик.

Нажимаем “Next”

В этом окне, вам понадобится зарегистрировать новую учетную запись, если у вас ее еще нету.

Выбираем место установки Qt

А также версию Qt

Принимаем условия лицензионного соглашения, нажимаем “Next”, и идем пить чай, так как установка может занять некоторое время, в зависимости от вашего интернет соединения.

После установки, найдите IDE в меню приложений и запустите

Чтобы начать работать, просто нажмите на кнопку “Новый проект”, в котором выберите шаблон и введите имя

И можете приступать кодить

Также для корректной компиляции, возможно потребуется установить следующую библиотеку.

sudo apt install libgl1-mesa-dev

Надеюсь я кому-то помог с помощью этой статьи, и если это так, то не забудьте поделиться в социальных сетях.

Используемые источники:

• https://losst.ru/ustanovka-i-nastrojka-qt-creator
• https://ravesli.com/urok-1-vvedenie-v-qt-i-ustanovka-qt-creator/
• https://linuxthebest.net/ustanovit-qt-creator-v-ubuntulinux-mint-i-drugie/