Реклама

Поиск

QML - Урок 008. Работа с System Tray в Qml Qt приложении

TutorialQMLQSystemTrayIcon, Qt, QML252

При переводе интерфейса приложения c Qt/C++ на Qt/QML мои руки добрались и до иконки приложения в системном трее. Задача заключалась в том, чтобы перевести иконку в System Tray с C++ на Qml, частично или полностью. Первый вариант, который я реализовал, являлся обёрткой вокруг QSystemTrayIcon с QMenu с использованием системы сигналов и слотов . Решение вполне логичное, учитывая, что в QML нет готового объекта, наподобие MenuBar для System Tray .   Поэтому делаем обёртку, с которой можно взаимодействовать из QML слоя.

После того, как обёртка была реализована, мне довелось посоветоваться с программистом из Wargamming Константином Ляшкевичем , который порекомендовал мне также обратить внимание на то, что QML может иметь доступ не только к сигналам и слотам, но и к параметрам Q_PROPERTY, которые также имелись в классе QSystemTrayIcon, то есть фактически можно было только зарегистрировать данный класс, как тип в QML слое и попытаться написать практически весь код на QML. Я проверил данный совет и рассказал о результате Константину. В итоге он сам заинтересовался данной задачей и Мы потратили вечерний час на занимательное костылирование и совместными усилиями запихали QSystemTrayIcon максимально в QML.

Таким образом в данной статье Вы увидите две реализации для работы с иконкой в системном трее.

Полученное приложение будет сворачиваться в System Tray по клику по иконке в трее, а также по нажатию кнопки закрытия окна. Но только в том случае, если будет активен специальный чекбокс, для контроля процесса сворачивания окна приложения в трей, если же чекбокс не активен, то приложение будет закрываться. Также приложение можно будет закрыть при активном чекбоксе через пункт меню в иконке системного трея.

QML - Урок 024. Custom QQuickItem - добавляем в QML объект из C++

TutorialQMLCustom QQuickItem, QQuickItem, QQuickPaintedItem, Qt, QML330

QML объекты в Qt весьма замечательны, с ними удобно работать, но что если стандартных объектов нам становится недостаточно? Тогда можно сделать собственный объект, запрограммировать его в C++ и внедрить в логику QML слоя. В данном уроке предлагаю сделать небольшой импровизированный таймер, который можно запустить, остановить и очистить, но при этом дизайн таймера будет разработан в C++ слое и по сути большая часть работы будет осуществляться в C++.

А для разработки кастомизированного QuickItem понадобится использовать QQuickPaintedItem, в котором будет таймер, представленный на рисунке ниже, который будет нарисован наподобие обычного QGraphicsItem , но он будет обладать рядом свойств, которыми можно будет управлять из QML слоя.

Реклама

QML - Урок 015. Разработка QML Data Mapper - Аналог QDataWidgetMapper

TutorialQMLQML, Qt, QDataWidgetMapper, mapper, QMLDataMapper92

В процессе переноса GUI одной софтины с QWidgets на QML обнаружилось отсутствие аналога QDataWidgetMapper для QML . Данный факт был несколько портящим настроение. Но делать было нечего, кроме как искать другие способы реализации или делать полностью свой велосипед для этого, свой Qml Data Mapper.

Тем не менее поиски на просторах сети дали свои результаты в качестве примера 2011 года от разработчиков Nokia по реализации SQL Widget Mapper для BlackBerry на основе Cascades (фреймворка для native разработки на QML Qt под BlackBerry, соответственно). Путём вечерней медитации над данным примером удалось перепилить код для нынешнего QML Qt , который вполне неплохо будет чувствовать себя как при работе под Desktop, так и при работе под Android, (кроссплатформенность как ни как).

Для демонстрации работы QML Data Mapper будет написано приложение, которое работает с базой данных SQLite. При каждом запуске приложение записывает несколько строк в базу данных, из которой данные забираются при помощи модели данных наследованной от QSqlQueryModel и отображаются в QML TableView. В главном окне приложения присутствует кнопка, по нажатию которой вызывается диалоговое окно, в котором отображается информация о первой строке таблицы. При двойном клике по одной из строк таблицы также вызывается диалоговое окно, но с информацией об этой строке. Также в диалоговом окне присутствуют кнопки для пролистывания информации из таблицы.

QML - Урок 016. База данных SQLite и работа с ней в QML Qt

TutorialQMLБаза данных, SQLite, Qt, QML, Android, DataBase, Model, View, MVC434

Небольшой пример по работе с базой данных в QML Qt . В данном уроке сводится воедино информация о применении сигналов и слотов в QML Qt , о доступе к C++ классам из QML слоя, реализации интерфейса приложения на QML, а также о реализации модели/представлении для таблицы базы данных.

База данных содержит таблицу со списком людей, в которой имеется четыре колонки:

  • id (INTEGER) - уникальный номер записи;
  • FirstName (VARCHAR (255)) - Имя;
  • SurName (VARCHAR (255)) - Фамилия;
  • Nik (VARCHAR (255)) - Ник.

Приложение должно реализовывать удаление и добавление записей в базу данных через интерфейс приложения. Для добавления записей в Базу данных будет использоваться три поля для ввода данных и кнопка, которая инициализирует добавление данных в базу данных SQL . Добавление записей в таблицу осуществляется через класс обёртку предназначенным для этого методом.Также в приложении присутствует класс ListModel , который реализует модель представления данных для отображения информации в TableView в слое QML.

QML - Урок 011. Передача данных из QSqlQueryModel в Qml TableView

TutorialQMLQML, SQL, Qt, DataBase, QSqlQueryModel, TableView207

Для представления таблиц баз данных в TableView при разработке с использованием QML можно использовать класс, наследованный от QSqlQueryModel. Для этого необходимо в наследованном классе определить метод, который установит соответствие ролей колонок таблицы к соответствующим колонкам в TableView, определенном в QML, где также указаны роли для каждого объекта TableViewColumn, то есть для каждой колонки. Также необходимо будет переопределить метод QVariant data( ... ) const , который возвращает данные для ячеек таблицы. В данном случае информация будет возвращаться в соответствии с определёнными ролями колонок таблицы.

Структура проекта для работы с TableView

Проект состоит из следующих файлов:

  • QmlSqlQueryModel.pro - профайл проекта;
  • database.h - заголовочный для создания и инициализации тестовой базы данных;
  • database.cpp - файл исходных кодов для создания и инициализации тестовой базы данных;
  • model.h - заголовочный файл модели данных;
  • model.cpp - файл исходных кодов модели данных;
  • main.cpp - основной исходный файл проекта;
  • main.qml - qml файл с TableView.

Реклама

QML - Урок 017. Экспорт данных в формат CSV из модели данных в QML Qt

TutorialQMLQML, Qt, CSV, EXCEL127

В том случае, если Вам понадобилось выгрузить таблицу с данными из приложения в файл формата CSV , интерфейс которого ещё и написан на QML , то спешу с этой статьей, чтобы дать небольшую подсказку.

Например, в статье по работе с базой данных SQLite в приложении на QML была создана база данных, в которую добавлялись данные и удалялись из неё. При этом они отображались в TableView , который был уже частью интерфейса, написанного на QML. А для отображения этой таблицы использовалась модель данных, наследованная от QSqlQueryModel .

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

Что такое формат CSV

CSV (от англ. Comma-Separated Values — значения, разделённые запятыми) — текстовый формат, предназначенный для представления табличных данных. Каждая строка файла — это одна строка таблицы. Значения отдельных колонок разделяются разделительным символом (delimiter) — запятой ( , ). Однако, большинство программ вольно трактует стандарт CSV и допускают использование иных символов в качестве разделителя.

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

QML - Урок 004. Сигналы и слоты в Qt QML

TutorialQMLconnections, example, qml, qml урок, qt, qt qml, qt урок, signal qml, slot qml, сигналы и слоты qml632

А вот мы и добрались до передачи данных между слоем QML и слоем C++. Честно говоря, принцип настолько же простой, как и просто использование сигналов и слотов в одном слое C++. Особенно в Qt 5.5.

Пример будет показан на основе программного кода из предыдущего урока , где мы создали диалоговое окно. Но скриншотов примера работы на Android не будет показано, но заверяю Вас - Всё работает как швейцарские часы.

Структура проекта с QML

структура проекта с qml

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

  • appcore.h - заголовочный файл ядра приложения;
  • appcore.cpp - файл исходных кодов ядра приложения.

А продолжать работать мы также будем с QQMLApplicationEngine. Нужно будет просто взять от движка QML контекст и загрузить в него объект нового класса, от которого будут поступать сигналы и в который будут передаваться данные.

Реклама

Реклама