Qt описание. Первое оконное приложение на Qt

В этом примере мы опишем шаги использования Qt Creator для написания маленькой программы Qt, Text Finder. Вдохновлённые примером QtUiTools Text Finder , мы напишем похожую на него но упрощённую версию как показано ниже.

Настройка вашей среды

После того как вы установили Qt Creator, он автоматически определит, находится ли Qt в вашей переменной PATH . Если Qt не находится в вашем PATH , вы можете установить его одним из следующих способов, в зависимости от вашей платформы:

  • На Windows и Linux: в меню Инструменты , в пункте Параметры .
  • В Mac OS X: в Инструменты , пункт Qt4 .

Замечание: Если для сборки Qt вы использовали Visual Studio, все переменные окружения, установленные в Visual Studio, должны быть также установлены для Qt Creator.

Настройка проекта

Мы начнём с проекта Gui приложение Qt4, сгенерированного Qt Creator. Документ Создание проекта в Qt Creator детально описывает этот проект. Не забудьте выбрать QWidget в качестве базового класса Text Finder. Если ваш проект ещё не загружен, вы можете загрузить его выбрав Открыть... из меню Файл .

В вашем проекте будут следующие файлы:

  • textfinder.h
  • textfinder.cpp
  • main.cpp
  • textfinder.ui
  • textfinder.pro

Файлы.h и.cpp содержат необходимые строки кода; файл.pro также завершён.

Заполнение недостающих кусков

Мы начнём с проектирования интерфейса пользователя и затем перейдём к заполнению недостающего кода. В заключение мы добавим поиск.

Проектирование пользовательского интерфейса

Для начала проектирования интерфейса пользователя, щёлкните два раза на файле textfinder.ui в вашем обозревателе проекта . Это запустит интегрированный Qt Designer.

Спроектируйте форму выше с использованием QLabel , QLineEdit (назовите его lineEdit), QPushButton (назовите её findButton) и QTextEdit (назовите его textEdit). Мы рекомендуем вам использовать QGridLayout для расположения QLabel , QLineEdit и QPushButton . QTextEdit можно добавить в QVBoxLayout помимо QGridLayout . Если вы новичок в проектировании форм с Qt Designer , вы можете взглянуть на руководство по Qt Designer .

Заголовочный файл

Файл textfinder.h уже имеет необходимые заголовочные файлы, конструктор, деструктор и объект Ui . Нам необходимо добавить закрытый слот on_findButton_clicked() для выполнения операции поиска. Нам также необходима закрытая функция loadTextFile() для чтения и отображения содержимого входного файла в QTextEdit . Это делается следующим кодом:

Private slots: void on_findButton_clicked(); private: Ui::TextFinder *ui; void loadTextFile();

Замечание: Объект Ui::TextFinder уже предоставлен.

Файл исходных кодов

Теперь, когда наш заголовочный файл завершён, перейдём к файлу исходных кодов textfinder.cpp . Мы начнём с заполнения функциональности для загрузки текстового файла. Это описано в куске кода ниже:

Void TextFinder::loadTextFile() { QFile inputFile(":/input.txt"); inputFile.open(QIODevice::ReadOnly); QTextStream in(&inputFile); QString line = in.readAll(); inputFile.close(); ui->textEdit->setPlainText(line); QTextCursor cursor = ui->textEdit->textCursor(); cursor.movePosition(QTextCursor::Start, QTextCursor::MoveAnchor, 1); }

Мы загружаем текстовый файл используя QFile , читаем его с помощью QTextStream , а затем отображаем его в textEdit с помощью setPlainText() , что требует добавления дополнительных директив #includes в textfinder.cpp:

#include #include

Для слота on_findButton_clicked() мы извлекаем строку поиска и используем функцию find() для поиска строки в текстовом файле. Это описано в куске кода ниже:

Void TextFinder::on_findButton_clicked() { QString searchString = ui->lineEdit->text(); ui->textEdit->find(searchString, QTextDocument::FindWholeWords); }

После того как эти функции завершены, мы вызываем loadTextFile() в нашем конструкторе.

TextFinder::TextFinder(QWidget *parent) : QWidget(parent), ui(new Ui::TextFinder) { ui->setupUi(this); loadTextFile(); }

Слот on_findButton_clicked() будет вызван автоматически в этой строчке:

QMetaObject::connectSlotsByName(TextFinder);

в файле ui_textfinder.h , сгенерированном uic.

Файл ресурсов

Нам потребуется файл ресурсов (.qrc) в котором мы сохраним текстовый файл. Это может быть любой файл.txt с абзацем текста. Чтобы добавить файл ресурсов щёлкните правой кнопкой мыши на Файлы ресурсов в обозревателе проектов и выберите Добавить новый файл... . Вы увидите диалог мастера, показанный ниже.

Введите "textfinder" в поле Имя и используйте заданный Путь . Затем щёлкните Вперёд .

На этой странице вы можете выбрать в какой проект вы хотите добавить новый файл. Убедитесь, что пункт Добавить в проект выбран, а "TextFinder" выбран как Проект , и щёлкните на Завершить .

Ваш файл ресурсов будет отображён в редакторе ресурсов. Щёлкните на выпадающем списке Добавить и выберите Добавить приставку . Приставка, которая нам требуется, это просто косая черта (/). Щёлкните на Добавить снова, но на этот раз выберите Добавить файлы . Найдите текстовый файл, который вы хотите использовать, мы будем использовать input.txt .

Снимок экрана выше что вы можете ожидать после того как успешно добавили файл ресурсов.

Сборка и запуск вашего приложения

Теперь, когда у вас есть все необходимые файлы, вы можете скомпилировать вашу программу, нажав на кнопку .

Простой пример для ручной сборки

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

Рассмотрим простейший пример GUI-приложения, которое выполняет открытие пустого окна на экране. Выделим директорию на диске, где создадим файл main.cpp со следующим содержимым. В пример добавлена нумерация строк для упрощения дальнейших комментариев к примеру. Следует понимать, что нумерация строк не должна содержаться в рабочем файле, так как она не входит в допустимый синтаксис выражений на языке C++.

01. #include 02. #include 03. 04. int main(int argc, char *argv) 05. { 06. QApplication app(argc, argv); 07. QWidget wgt; 08. wgt.setWindowTitle(tr("Hello world")); 09. 10. wgt.show(); 11. return app.exec(); 12. }

В строках 01 и 02 выполняется включение заголовочных файлов QApplication и QWidget , в которых, кроме прочего, содержится объявление классов QApplication и QWidget . В нашем примере мы создаем экземпляры этих классов.

Следует заметить удобную традицию именования заголовочных файлов используемую в Qt. Начиная с четвертой версии Qt, если вам потребовался класс с именем Qxxx , то, скорее всего, его определение находится в заголовочном файле Qxxx .

В данном примере, класс QApplication интересует нас как организатор цикла сбора сообщений, которые будут приходить в окно нашего GUI-приложения. См. строку 11 (запуск цикла обработки оконных сообщений). Класс QApplication реализован по подобию синглтона (Singleton). Для тех, кто не знаком с этим термином из теории шаблонов проектирования (или, паттернов, от англ. patterns ) дадим небольшое пояснение. Суть синглтона заключается в том, что реализация класса предотвращает возможность создания более одного экземпляра данного класса. Эта особенность нам важна потому, что из нее следует возможность определения внутри библиотеки Qt глобальной переменной с указателем на единственный экземпляр данного класса. Смотрите описание для символа qApp в справке Qt.

В библиотеке Qt используется терминология виджета (от англ. widget — штуковина, приспособление), как элемента GUI-интерфейса. Минимальный общий набор свойств таких элементов представлен классом QWidget .

В строках 06 и 07 создаются объекты классов приложения и виджета. В обоих случаях выполняется статическое создание объектов. Время существования таких объектов ограничивается операторным блоком { … } в котором они созданы. Как только исполнение кода программы дойдет до закрывающей скобки, то оба этих объекта автоматически уничтожатся. Таким образом, в данном примере мы не будет задумываться о способе уничтожения объектов Qt и рассмотрим этот вопрос позже.

При создании объекта QApplication используется параметризованный конструктор в который передаются аргументы запуска приложения (копируются из аргументов функции main()). Внутри объекта класса выполняется парсинг этих аргументов. Класс приложения поддерживает ряд параметры запуска, которые можно уточнить по справке для соответствующего конструктора QApplication . Параметры запуска не входящие в этот список следует анализировать самостоятельно. В конце этого урока, разместив в главном окне приложения несколько элементов управления мы предложим провести эксперимент с параметром запуска -style, для которого, в любой сборке Qt, возможны значения: motif , windows , platinum .

В строке 08 выполняется изменение одного из атрибутов объекта виджета. С помощью метода setWindowTitle() мы устанавливаем свой текст для заголовка нашего будущего окна. Обратите внимание, что изображение строки обернуто вызовом функции трансляции tr() . Это требование интернационализации приложения. По всем подобным оберткам, специальными средствами Qt, могут быть созданы специальные файлы с переводами на разные языки, которые можно будет использовать в приложении для выполнения автоматических замен. Обычно, такие файлы включают в сборку приложения в виде ресурсов.

В строке 10 выполняется открытие окна приложения. До версии Qt4, перед открытием окна выполнялась явное объявление виджета как главного виджета приложения. Это делалось с помощью следующего кода.

App.setMainWidget(&wgt);

Начиная с версии Qt4 выполнение такой связи выполняется автоматически через обращение к глобальному указателю qApp на экземпляр класса приложения.

В строке 11 выполняется запуск цикла обработки сообщений операционной системы направленный в окно приложения. Цикл завершается при выполнении какой-нибудь из команд закрытия приложения. Код закрытия приложения возвращается методом exec() при завершении метода. Именно этот код становится кодом возврата функции main() за счет передачи его через оператор return .

Теперь попробуем выполнить сборку приложения. Проще всего это будет сделать в Linux. Для этого надо будет просто открыть консоль и выполнить некоторые команды, которые мы сейчас опишем. Для Windows такая работа может потребовать установку путей на директории размещения утилиты qmake из Qt SDK. Данная утилита реализует правила системы сборки проектов QMake.

Для начала следует узнать, что нам доступно из консоли. Если мы в консоли bash (*nix), то сделать это достаточно просто. Наберите команду qmake и нажмите два раза табуляцию. Мы должны увидеть список всех команд, которые начинаются с сочетания qmake . Например, в моем случае я вижу две команды: qmake и qmake-qt4 . Это говорит о том, что у меня из репозитория установлены две версии библиотеки. Команда qmake соответствует версии Qt5 (действует умолчание для последней версии), а команда qmake-qt4 соответствует, соответственно Qt4. Теперь, в зависимости от того, какой командой я воспользуюсь, я буду делать сборку либо с использованием версии Qt5, либо с использованием версии Qt4.

Если все у нас в системе настроено нормально и версии Qt SDK удачные, то сборка проекта должна быть выполнена с помощью следующих трех команд.

$ qmake -project $ qmake $ make

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

Вторая команда должна создать файл сценария компиляции — Makefile. Третья команда должна выполнить сценарий компиляции, в результате которого должен получиться исполняемый файл приложения.

Если этого не произошло, то попробуем найти проблему.

Откройте проектный файл. Попробуйте найти там следующую строку.

QT += gui

Если такой строки там нет, то следует ее добавить, иначе в зависимости от версии SDK проект может быть воспринят как консольный и в него не будут включены пути на заголовочные файлы классов GUI. Это приведт к тому, что при компиляции будут выведены ошибки о том, что включенные заголовочные файлы не найдены.

Следует иметь в виду, что если вы имеете дело с Qt SDK версии 5, то данное определение должно еще включать группу widgets , как показано ниже.

QT += gui widgets

Пример создания шаблона GUI-приложения из QtCreator

Откройте QtCreator. Для создания нового проекта запустим мастер создания проекта из меню "File->New File or Project …". В открывшемся окне первой страницы мастера предлагается выбрать шаблон будущего проекта. Для группы проектов "Application" выберем вариант "Qt GUI Application" и щелкнем по кнопке "Choose" для перехода на следующую страницу мастера.

На второй странице мастера создания проекта предлагается выбрать имя проекта и директорию его размещения. По указанному имени проекта будет создана поддиректория в которой будут размещены файлы проекта. Создание поддиректории будет выполнено в указанной директории размещения. Таким образом, имя проекта должно определяться правилами которым должно подчиняться имя директории. Однако, чтобы избежать проблем, не используйте русских букв и пробелов. Используйте английские буквы, цифры и символы подчеркивания и тире (знак минуса). Пусть наш проект будет называться app1 . Запишем его в строку name , а в строке выбора директории проекта укажем директорию, где и в дальшейшем будем создавать проекты на Qt. Следует избегать путей с русскими буквами и пробелами. Рано или поздно, они могут вызвать проблемы. Если необходимо запомнить этот путь для следующего раза, установите флажок "Use as default project location". Щелкнем по кнопке "Next" для перехода на следующую страницу мастера.

На третьей странице мастера создания проекта предлагается выбрать Qt SDK из списка найденных и зарегистрированных в QtCreator. Выберите вариант Qt4. Для выбранной версии SDK, следует определить профили сборки проекта. Предлагаются варианты "Release" и "Debug" Сборка "Release" не содержит отладочных символов в исполняемом файле и рекомендуется для передаче в реальное использование. Во всех остальных случаях, удобнее использовать сборку "Debug". В текущем примере, выбор сборки не имеет значения. Можно оставить включенным оба профиля. Справа от названия профиля расположено поле ввода в котором записан путь по которому будет выполняться соответствующая сборка. Часто эти пути редактируют исходя из разных традиций. В нашем примере мы можем оставить эти пути без изменений. Щелкнем по кнопке "Next" для перехода на следующую страницу мастера.

На четвертой странице мастера создания проекта предлагается выбрать имя класса для главной формы проекта, базовый класс, от которого следует унаследовать главную форму проекта и имена файлов, где будет размещен интерфейс и реализация создаваемого класса главной формы. Кроме этого, на странице следует указать будет ли использовано визуальное проектирование формы. Так как мы не будем использовать визуальное проектирование, то следует проследить, чтобы флажок "Generate form" был снят.

Наиболее интересным на четвертой странице мастера создания проекта является выбор базового класса для создания класса формы. Предлагаются три варианта.

  1. QMainWindow — в большинстве случаев, наиболее подходящий выбор. Наследуясь от данного класса мы получаем уже готовые средства для размещения меню, строки статуса и центрального поля, которое можно реализовать как в стиле SDI (Single Document Interface), так и в стиле MDI (Multi Document Interface).
  2. QWidget — этот класс является простейшим виджетом. В терминологии Qt это простейший элемент, с которым связана какая-то графическая область на экране. Как базовый класс для главного окна, используется, как правило, при создании простых одноформенных приложений и отлично подходит для начальных "ученических" целей по причине того, что не содержит ничего "лишнего".
  3. QDialog — базовый класс для создания модальных диалоговых окон.

Для нашего примера, выберем в качестве базового класса, простейший вариантQWidget . Имена для главного класса формы и для файлов, где будет размещаться его интерфейс и реализация можно оставить значениями по-умолчанию. Щелкнем по кнопке "Next" для перехода на следующую страницу мастера.

Пятая страница мастера создания проекта позволяет определить связь создаваемого проекта с уже открытыми проектами и указать выбор какой-нибудь доступной системы управления версиями проекта. В текущем примере нас не интересуют данные возможности, поэтому нам следует завершить работу мастера щелкнув кнопку "Finish".

В разных версиях QtCreator шаги по созданию проекта могут несколько отличаться, но, по сути, здесь изложены главные моменты, которые следует понимать при создании GUI-проекта. Текущее описание делалось на основе версии QtCreator 2.7.0.

После выполнения мастера создания проекта в QtCreator откроется вид с созданным проектом. Выполните запуск проекта, чтобы проверить настройки среды разработки. Если все в порядке, то созданный шаблон проекта должен откомпилироваться и запуститься. Для обычного запуска проекта можно воспользоваться щелчком по кнопке с изображением зеленого треугольника, размещенной на панели инструментов. Кнопка с изображением зеленого треугольника с жуком выполняет функции запуска в режиме отладке. В этом случае, если в проекте установлены точки останова, то при их достижении, выполнение запущенного приложения остановится и в редакторе отладке подсветится строка на которой был выполнен останов.

QtCreator заметно отличается своим дизайном от других сред разработки. Однако, его дизайн удивительно эргономичен. Кроме прочего, в эпоху широких экранов, очень выгодно смотрится панель инструментов расположенная слева в главном окне среды разработки. В нижней части панели инструментов, как уже говорилось, расположены кнопки запуска приложения, а в верхней — кнопки выбора вкладок для главного окна среды разработки. Рассмотрим список основных вкладок.

  • "Welcome" — Выбор проекта
  • "Edit" — Редактирование программы.
  • "Debug" — Отладки проекта. Включает необходимые окна для наблюдения за объектами.
  • "Projects" — Настроки проектов, загруженных в среду разработки. Следует внимательно изучить возможности представленные на этой вкладке
  • "Analyze" — Анализ проектов с помощью специальных средств обнаружения узких мест в быстродействии и проблем утечки памяти.
  • "Help" Окно интергрированной справки. Возможно, вам больше понравится работать с отдельным справочным приложением QtAssistant.

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

Возьмем проект, который мы создали в предыдущем разделе с помощью мастера среды разработки QtCreator. Созданный проект включает в себя следующие файлы.

  • app1.pro — файл проекта
  • main.cpp widget.h и widget.cpp ./li>
  • widget.h — интерфейс класса главного окна приложения.
  • widget.cpp — реализация класса главного окна приложения.

Возможно, имена файлов в вашем проекте несколько отличаются. Это может быть либо потому, что вы их явно указали другими, при создании проекта, либо значения по умолчанию для вашей версии QtCreator иные.

Откроем файл реализации главного окна приложения — widget.cpp . Изменим его до состояния представленного в следующем примере. Помните, что номера строк указаны только для удобства комментариев.

01. #include 02. #include 03. #include 04. 05. #include "widget.h" 06. 07. Widget::Widget(QWidget *parent) 08. : QWidget(parent) 09. { 10. setWindowTitle(tr("Hello world!!!")); 11. setMinimumSize(200, 80); 12. 13. QLabel * plb = new QLabel(tr("Test"), this); 14. plb->setGeometry(20, 20, 80, 24); 15. 16. QLineEdit * ple = new QLineEdit(this); 17. ple->setGeometry(110, 20, 80, 24); 18. 19. QPushButton * ppb = new QPushButton(tr("Ok"), this); 20. ppb->setGeometry(20, 50, 80, 24); 21. } 22. 23. Widget::~Widget() 24. { 25. 26. }

В строках 01-03 выполняется включение файлов с интерфесами следующих классов виджетов.

  1. QLabel — класс метки. Часто используется для размещения статической текстовой информации. Понимает некоторые теги HTML для форматирования. Может быть использован для статического размещения изображения. Например, из файла с картинкой. Наследуется от QFrame , поэтому может настраиваться на различные формы окантовки (бордюра).
  2. QLineEdit — класс для создания однострочных полей ввода текстовой информации.
  3. QPushButton — класс кнопки. Чаще всего используется для обработки сигнала clicked() — щелчок по кнопке.

Тело конструктора класса Widget содержит две строки настройки атрибутов окна (строки 10-11) и 8 строк создания и размещения на поле окна трех других виджетов (строки 13-20).

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

Строка 13 содержит создание экземпляра класса QLabel. Объект создается динамически, через оператор new. Для создания объекта используется конструктор, первым параметром которого указывается строка, которую должен изображать создаваемый объект. Вторым параметром данного конструктора следует указать адрес объекта, который станет владельцем создаваемого объекта метки. В качестве адреса владельца указано значение this . По правилам языка C++, this является указателем на объект внутри которого он используется. Т.е., в данном контексте, это указатель на созданный экземпляр класса Widget . Таким образом, в строке 13 создается объект класса метки, который должен изображать указанный текст и владельцем которого назначается текущий объект.

Здесь пришло время рассказать о цепях владения, которые реализованы в системе классов Qt для решения проблемы уничтожения объектов для предотвращения случайных утечек памяти. Следует вспомнить, что объекты созданные динамически, т.е. с помощью оператора new , размещаются в специальной области памяти, называемой кучей (heap) и которые живут в куче до тех пор пока не будут явно уничтожены оператором delete . Если программист не отслеживает уничтожение объектов, которые стали ненужными и не вызывает для их уничтожения оператор delete , то это становится причиной утечки памяти в приложении, которая является серьезной проблемой для ряда языков программирования в группу которых входит язык C++.

Существует несколько известных схем автоматического слежения за уничтожением динамически созданных объектов. Один из них заключается в использовании умных указателей, о которых, следует рассказать позже. Другой способ заключается в создании цепей владения, о котором мы сейчас расскажем. Третьим способом является создание подсистемы уборки мусора, которая должна отлеживать ненужные объекты и уничтожать их. Последний способ, традиционный для ядер многих современных языков, в C++ практически не используется. Гораздо более популярными в традициях языка C++ являются первые два способа.

Итак, цепи владения реализуют следующую простую идею. Создается некоторый объект, за уничтожением которого мы обязуемся следить. Проще всего создать такой объект статическим определением и тогда он уничтожится автоматически, когда исполнение программы достигнет конца операторного блока { … } в котором он был определен. Далее, при динамическом создании других объектов будем назначать для них объекты владельцев. В обязанности владельцев будет входить уничтожении владеемых объектов в теле собственного деструктора. Напомним, что деструктор — это особый метод, который вызывается при уничтожении объекта. Таким образом, можно построить такую цепь владения относительно первого объекта, все элементы которой будут автоматически уничтожены при уничтожении первого объекта. При организации такой схемы следует лишь правильно учитывать время жизни объекта, который назначается владельцем другого объекта, чтобы объекты не были уничтожены преждевременно.

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

При реализации схем цепей владения, в некоторых библиотеках используется параметр с именем owner , что с английского языка переводится как владелец . Однако в библиотеке Qt такой параметр называется parent , что переводится с английского как родитель . В результате этого, у некоторых новичков возникает недопонимание образованное тем, что понятие "родитель" традиционо относится к цепям наследования в ООП, однако цепи наследования и цепи владения не имеют ничего общего. Будьте внимательны и не становитесь жертвой заблуждения в этом вопросе.

Вернемся еще раз к строке 13. Там мы создали объект владельцем которого назначен текущий объект главного окна приложения. Переменная plb , которая хранит адрес созданного объекта будет уничтожена автоматически при достижении конца кода конструктора. Однако объект который был распределен в памяти останется жить и далее, и будет жить до тех пор, пока объект главного окна приложения не будет уничтожен. При уничтожении объекта главного окна будут автоматически уничтожены все объекты, которыми объект окна владеет.

В строке 14 мы обращаемся к методу задания атрибутов геометрии, которые определяют размещение настраиваемого объекта относительно своего владельца. Первым и вторым значением указываются горизонтальная и вертикальная координата для верхнего левого угла объекта. Третьим и четвертым значением указывается ширина и высота настраиваемого объекта.

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

Используя данное приложение можно поэкспериментировать с параметрами запуска приложения. Проще всего это сделать в консоли. Зайдите в директорию сборки приложения и выполните следующие варианты запуска приложения с параметрами. В каждом из запусков должна быть заметна разница в стиле прорисовки виджетов.

$ ./app1 -style=motif $ ./app1 -style=windows $ ./app1 -style=platinum

В данном примере, исполняемый файл приложения указан именем app1 . Возможно, что в вашем случае, исполняемый файл имеет другое имя. В операционной системе Windows, исполняемые файлы имеют расширение exe . Кроме того, в операционной системе Windows, выполнить запуск исполняемого файла из текущей директории можно без указания относительного пути, т.е. без указания (./ ) — символ точки является синонимом текущей директории, а символ прямого слеша — символом разделителя в записи файловых путей. Также, следует иметь в виду, что символ доллара — это символ стандартного приглашения в консоли *nix для обычного пользователя и набирать его частью команды не нужно. В консоли Windows, символом приглашения обычно является символ угловой скобки (> ).

Параметры запуска, также можно указать при запуске приложения из среды разработки QtCreator. Для этого щелкните на панели инструментов слева по значку Projects . Откроется соответствующая вкладка с настройками. В верхней части окна можно видеть иерархическую систему вкладок. Вкладки самого верхнего уровня определяют проект, так как в среде разработки могут быть открыты несколько проектов. Следующий уровень вкладок, кроме прочего, должен содержать вкладку Build&Run , которая нам нужна. В этой вкладке далее следует выбор версии Qt SDK, для случая, если вы делаете сборку проекта сразу под несколько версий. Если вы собираете проект под одну версию, то выбор будет состоять из одного элемента. Внутри виджета выбора версии Qt SDK, расположены две стилизованные кнопки с закругленными краями — кнопки Build и Run . Щелкните по кнопке Run , чтобы выбрать соответствующую группу настроек. Там, в одноименной группе параметров Run вы найдете однострочное поле ввода напротив метки Arguments . Это и есть конечная цель нашего выбора. Запишем туда следующую строку.

Style=motif

Запустите приложение. Потом попробуйте другие значения: windows и platinum . Напомним, что объект класса QApplication поддерживает список из пары десятков параметров запуска, о которых можно прочитать в справке по соответствующим конструкторам класса.

Работая над примером, познакомьтесь со справочной информацией по используемым в примере классам. Попробуйте добавить на форму другие экземпляры классов метки, однострочного поля ввода и кнопки. Кроме этого, попробуйте познакомиться со справкой и добавить на форму объекты следующих классов.

  1. QComboBox — класс выпадающего списка.
  2. QCheckBox — класс флажка (чекера).
  3. QTextEdit — класс многострочного поля ввода. Используется как для редактирования, так и для представления текста. Содержит очень богатые возможности по представлению документов за счет выделения функций специальных компоновщиков документов в отдельные классы.

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

С каждым годом становится все больше операционных систем, и потому разработчикам все труднее удовлетворять потребности пользователей. Три самые популярные компьютерные платформы - 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

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

  • Скачать Qt Creator для Linux 32-bit (нажимаем "View other options" ).
  • Скачать Qt Creator для Linux 64-bit.

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

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

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

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

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

Нажимаем "Next" .

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

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

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

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

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

sudo apt install qt5-default

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

sudo apt install qtcreator

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

sudo apt install qtbase5-examples qtdeclarative5-examples

Настройка 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 и запуск первой Windows программы.

Приветствую тебя дорогой читатель. В этой статье мы поговорим о том как в QT можно создать первое оконное приложение используя только команды и главный файл main.cpp. Данная статья будет разделена на 2 части. В первой части мы с вами создадим само приложение и запустим его на компиляцию при помощи компилятора MinGW с очень короткими комментариями по коду, а во второй части мы разберем весь код до последней детали чтобы у вас сформировалось полное базовое понимание о том как все это работает. Итак пожалуй начнем. Первое что нам необходимо сделать это запустить QT Creator и создать проект. Я думаю нет необходимости объяснять как запустить QT Creator, так что мы начнем сразу с создания проекта.

Видео урок по данной статье

После того как QT запустился нажмите на кнопку новый проект как показано на скриншоте ниже.

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

После того как вы нажали кнопку выбрать… У вас откроется следующее окно выбора дополнительных параметров, где вам будет предложено выбрать имя вашего проекта и где он будет храниться. ВАЖНО: Не допускайте русских символов в пути где у вас будет храниться ваш проект, Qt не дружит с русскими символами. Эта мера необходима чтобы в дальнейшем избежать ошибок при сборке проекта. Ниже приведен пример как правильно создать имя и путь к проекту Qt.

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

Далее Qt нам предлагает выбрать комплект при помощи которого мы будем разрабатывать наш проект, я выбрал комплект Desktop Qt 5.8.0 с компилятором от MinGW 32 bit. Вы можете оставить значение по умолчанию или сделать свой выбор комплекта или даже комплектов для разработки вашей программы.

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

После этого у нас откроется последнее окно в котором будет собрана вся суммарная информация по создаваемому проекту, также в этом окне нам будет предложено создать наш проект как подпроект нашего предыдущего и добавить под контроль версии проекта. Но так как у нас нет ни того ни другого, мы просто нажимаем кнопку завершить как показано на скриншоте ниже.

После того как наш конструктор приложений завершился пришло самое время настроить наш проект так чтобы у нас была возможность выполнить простейшую программу для вывода текста на экран и проверки правильности работы нашего фреймворка. Для начала нам необходимо удалить из нашего проекта все файлы кроме файла main.cpp — вот в этом файле мы и будем в дальнейшем прописывать код для запуска окна с выводом текста в оконном режиме. Вам необходимо оставить все так же как показано на скриншоте ниже после удаления лишних файлов из проекта.

Скриншот до удаления файлов из проекта:

Чуть ниже вы можете увидеть скриншот созданного проекта конструктором Qt без изменений.

До удаления лишних файлов из проекта

Скриншот после удаления файлов из проекта:

На текущем этапе я пока не приводил никаких действий с файлом кроме удаления лишних файлов, если вы не догадались как можно удалить файл, то для этого достаточно выделить его левой кнопкой мыши чтобы на нем загорелась синяя обводка, после этого на этот файл наводим мышку и нажимаем правой клавишей мыши и выбираем пункт удалить, в открывшемся диалоговом окне ставим галочку удалить навсегда и подтверждаем удаление файла. После проделанной операции у вас успешно будет удален файл из проекта. После того как вы удалили все ненужные файлы из проекта, откройте файл main.cpp двойным щелчком левой кнопки мыши и удалите из него весь код который там есть. В общем у вас должно получиться точно так же как на скриншоте ниже.

Разработка простейшего кода для оконного приложения:

Теперь пришло самое время создать код нашей простейшей программы в которой у нас будет запускаться окно и в данном окне у нас будет выводиться текст

на Русском языке без проблем с кодировкой. Данная проблема уже была предусмотрена в Qt и решена внутренними инструментами.

Для начала добавим следующий код в наш файл main.cpp

Запустите ваш код при помощи зеленого треугольника слева или сочетанием горячих клавиш Ctrl+R. В итоге у вас должно получиться окно с текстом Привет мир!!!

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

Вторая часть статьи. Подробный разбор кода:

До текущего момента мы с вами разобрались как можно создать простейшую программу которая только в окне выводит текст не разбираясь в подробностях кода. Теперь пришло самое время разобраться с теми командами которые мы использовали в нашей программе. Первое что мы с вами сделали, это подключили библиотеку QtWidgets — Данная библиотека включает в себя около 300 различных библиотек направленных на создания оконных приложений. Еще QtWidgets можно назвать складом строительных материалов для различных оконных приложений. Можно было конечно подключить отдельно библиотеки такие как QLabel для создания окон Windows и QApplication для обработки строк с различными аргументами. Но у нас стал бы код чуть длиннее и чуть труднее читаем. А теперь представьте если бы вы создавали программу в которой куча разных функций. И вы бы подключали к каждой функции свою библиотеку. Спустя какое то время вы бы с трудом смогли вспомнить для чего подключено такое большое количество библиотек. Вот как раз в таких случаях и выручают большие библиотеки которые содержат в себе уже весь необходимый строительный материал для создания к примеру оконных программ как QtWidgets.
Вот собственно говоря весь код нашей программы, чуть выше мы с вами уже разобрали библиотеку QtWidgets

#include // Подключаем библиотеку QtWidgets в которую //входит около 300 различных классов для разработки оконных приложений. //В том числе и такие как QApplication и QLabel. int main(int argc, char **argv){ QApplication app(argc, argv); QLabel lbl("Привет мир!!!"); // Создаем конструктором окно с текстом Привет мир!!! lbl.show(); // Обращаемся к методу(функции) show() для вывода информации на экран return app.exec(); // Проверяем сигнал закрытия окна через объект app при помощи метода(функции) //exec() которая перехватывает различные действия происходящие в программе. //Это необходимо для корректного завершения программы, чтобы после закрытия //окна программы она не занимала место в оперативной памяти и не напрягала //процессор в фоновом режиме. }

#include // Подключаем библиотеку QtWidgets в которую

//входит около 300 различных классов для разработки оконных приложений.

//В том числе и такие как QApplication и QLabel.

int main (int argc , char * * argv ) {

QApplication app (argc , argv ) ;

QLabel lbl ("Привет мир!!!" ) ; // Создаем конструктором окно с текстом Привет мир!!!

lbl . show () ; // Обращаемся к методу(функции) show() для вывода информации на экран

return app . exec () ; // Проверяем сигнал закрытия окна через объект app при помощи метода(функции)

//exec() которая перехватывает различные действия происходящие в программе.

//Это необходимо для корректного завершения программы, чтобы после закрытия

//окна программы она не занимала место в оперативной памяти и не напрягала

//процессор в фоновом режиме.

Теперь давайте разберем наш пример. Сначала создается объект класса QApplication, который осуществляет контроль и управление приложением. Для его создания в конструктор этого класса необходимо передать два аргумента. Первый argc аргумент представляет собой информацию о количестве аргументов в командной строке, из которой происходит обращение к программе, а второй argv - это указатель на массив символьных строк, содержащих аргументы, по одному в строке. Любая использующая Qt программа с графическим интерфейсом должна создавать только один объект этого класса, и он должен быть создан до использования операций, связанных с пользовательским интерфейсом.

Затем создается объект класса QLabel. После создания элементы управления Qt по умолчанию невидимы, и для их отображения необходимо вызвать метод show(). Объект класса QLabel является основным управляющим элементом приложения, что позволяет завершить работу приложения при закрытии окна элемента. Если вдруг окажется, что в созданном приложении имеется сразу несколько независимых друг от друга элементов управления, то при закрытии окна последнего такого элемента управления завершится и само приложение. Это правильно, иначе приложение осталось бы в памяти компьютера и расходовало бы его ресурсы.
Наконец, в последней строке программы приложение запускается вызовом
QApplication::ехес(). С его запуском приводится в действие цикл обработки событий, определенный в классе QCoreApplication, являющемся базовым для QGuiApplication, от которого унаследован класс QApplication. Этот цикл передает получаемые от системы события на обработку соответствующим объектам. Он продолжается до тех пор, пока либо не будет вызван статический метод QCoreApplication::exit (), либо не закроется окно последнего элемента управления. По завершению работы приложения метод QApplication::ехес() возвращает значение целого типа, содержащее код, информирующий о его завершении. После того как вы создали весь код и запустили программу – у вас должен получиться следующий результат.

Теперь пришло самое время разобраться как работают теги из HTML(язык гипертекстовой разметки) и CSS(каскадные таблицы стилей).

Когда вы создаете объект и передаете конструктору информацию в двойных кавычках, то конструктор автоматически создает окно при помощи QLabel и создает там текстовое поле в котором собственно и будет выводиться ваш текст. Благодаря новым возможностям от Qt есть возможность использовать различные теги от HTML и CSS. Такая возможность позволяет оформлять различные элементы программы в различных стилях что очень сильно помогает в разработке дизайна программ. Главное не забывать о том что в HTML и CSS используются такие спец. Символы как точка с запятой и двойные кавычки в для написания нескольких свойств в CSS для текста или какого то объекта. В Qt придется забыть о данных знаках при написания кода оформления в двойных кавычках так как это может вызвать ошибку при компиляции. А вот что касается простеньких свойств в HTML и CSS которые имеют не более 1 параметра, то здесь работает все корректно. Ниже привел пример оформления, с кодом вы можете ознакомится на скриншоте.

Чуть выше на скриншоте вы можете увидеть как буквально в 1 строку кода мы оформили текст в разной цветовой гамме, так же задали размер заголовка текста и добавили пару переносов строки. А теперь судите сами на сколько упрощает жизнь при оформлении программы при использовании языка гипертекстовой разметки и каскадных таблиц стилей.

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

Так же большая просьба написать в комментариях, насколько бы вам было интересно начать параллельное изучение HTML и CSS для Qt.

Не была бы тем чем она является без того, что называется proof-of-concept . И в данном случае роль этого доказательства играет Qt Creator — среда разработки под Qt с открытым исходным кодом, написанная полностью на ней самой.

Qt Creator может показать изумительно аскетичной IDE, особенно после работы и программирования в чем-либо другом. Между тем, среда содержит все необходимое для работы и является довольно продуманной. Qt Creator поставляется в пакете вместе с самой библиотекой Qt. . Выбирайте способ (онлайн, оффлайн), платформу и вперед (Примечание: описанный способ может измениться в будущем, но в любом случае — скачивайте дистрибутив библиотеки только с официального сайта ). Установка является довольно простой и особых сюрпризов не несет.

Кстати, под Linux и Mac OS X существует также вариант установки через репозитарий вашего дистрибутива (через brew в Mac OS X или apt в Ubuntu), но в этом случае вы рискуете получить не самую свежую версию библиотеки.

После скачивания и установки остается запустить Qt Creator и начать разрабатывать.

Среда имеет три темы (тема Flat появилась в 4.0) интерфейса и несколько вариантов расцветки синтаксиса кода. При желании цвета синтаксиса можно изменить на любые другие. Как и генеральный цвет IDE.

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

Примеры очень хорошо помогут после некоторого времени ознакомления со средой и Qt. Основная фишка Qt Creator — встроенная справка, позволяющая не выходя из среды получать информацию о любом классе и его методах и свойствах. Достаточно встать на имя класса или экземпляре и нажать F1. Сбоку появится окно справки, аналогичное документации с https://doc.qt.io/ — главного справочного портала Qt.

Если нет желания делить рабочее пространство с справочным окном и хочется вдумчивого чтения, можно кликнуть по кнопке Справка в левом сайдбаре. Вкладка Проекты позволяет настроить некоторые этапы сборки и запуска проекта, Отладка переключает среду в соответствующий режим, кнопка Дизайн становится активной при редактировании.ui файлов интерфейса. В окне Редактор происходит главное действо — написание кода. Со всем этим мы разберемся позже.

В нижней левой части экрана расположены манящие нажать кнопки создания билда, отладочного запуска и запуска приложения. А так же режим сборки — Отладка, Релиз и Профилирование.

Наигравшись вдоволь со средой можно переходить к созданию своего собственного проекта.