Работа с програмата designer

Страницата е създадена на:15 април 2019 и редактирана на: 5 март 2021

В документацията на Qt има учебник Qt Designer Manual, посветен на програмата designer. Наред с написаното тук, горещо препоръчвам да прочетете този учебник.

Действията, които ще бъдат описани, че се извършват с designer почти по същия начин се извършват и с Qt Creator в режим Design, така че ако предпочитате де не ползвате designer минете към Създаване на меню.

Стартиране на designer

В Windows

Ако сте инсталирали Qt с инсталиращата програма, във Windows 8 или Windows 10, най-бързият начин да намерите и стартирате designer е чрез прозорчето за търсене. Щом напишете първите 2-3 букви от думата designer, ще се покаже иконата и надписа на програмата. Щракнете върху тях за да я стартирате.

В по-старите версии на Window – 7 или XP, в Start менюто, ще намерите подменюто на Qt и в него икона на програмата designer.

Ако сте компилирали ръчно Qt в поддиректория bin, която е създадена при компилирането, щракнете двойно върху иконата на designer.

В Mac OS X

Ако сте инсталирали Qt версия, например, 6.0.1, ще намерите Designer.app в поддиректория

Qt/6.0.1/clang_64/bin/Designer.app

на личната си директория.

При версии 4.x програмите инструменти на Qt се инсталират в директория

/Developer/Applications/Qt/

и там се намира и Designer.app.

В Linux

Може би, най-удобно би било да сте направили символична връзка и да използвате зададената команда от конзолата.

Избор на типа форма

Първият диалог, който се появява заедно с прозореца на designer, е диалога New Form за избиране на типа прозорец, който ще се създаде. Възможните типове са:

Dialog with Buttons Bottom – диалог с бутони отдолу.

Dialog with Buttons Right – диалог с бутони вдясно.

Dialog without Buttons – диалог без бутони.

Main Window – главен прозорец.

Withget – визуална компонента.

Ако се каните да отворите съществуващ .ui файл, щракнете бутона Open..., а за да отворите, някой от последно отворените файлове – бутона Resent. Ако щракнете Close диалогът за избиране на тип прозорец, ще се затвори и може да изберете какви да бъдат следващите действия от менюто на програмата.

Създаване на меню

Ако сте създали с Qt Creator нов проект от тип Applications – Qt Widget Application, в страничната лента, в раздел Forms ще намерите файл, който представя графичното оформление на главния прозорец на новата програма. Този файл е с име "ИмеНаГлавнияПрозорец.ui". Двойното щракване с мишката върху името на този файл го отваря за редактиране в режим Design, при който в централната част на прозореца на Qt Cteator се вижда формата на главния прозорец. На лентата за меню на главния прозорец се вижда надпис "Type Here", който при стартиране и изпълнение на програмата не се вижда в главното меню на работещата програма.

Надпис "Type Here" е подканящ надпис, който подсказва, че за да започнете да създавате подменю или команда в менюто на вашата програма, трябва двойно да щракнете върху него и да напишете там надпис. Направете го. Напишете, например, File на мястото на "Type Here" и натиснете клавиш Enter. След натискането на Enter, вдясно от новия надпис File, се показа отново "Type Here", а под File - още един надпис "Type Here", а под него и надпис "Add Separator". Двата нови надписа "Type Here", посочват къде може да добавите: ново подменю или команда към подменюто File. Надписът "Add Separator" подсказва, че ако го щракнете ще добавите разделителна линия в подменюто File. Сега добавете, например, команда Quit под надписа File.

Щракнете бутона Save File, компилирайте отново програмата и я стартирайте. В главният й прозорец трябва да видите меню с едно подменю File и една команда Quit в него.

Сега да направим така, че при щракване на Quit програмата да се затваря. В Qt това се осъществява чрез концепцията за сигнали (Singnals) и слотове (Slots).

Добавяне на визуални елементи

Визулани елементи като бутони, радио-бутони, отметки, полета за редактиране и др. се поставят върху форма с влачене от панел с елементи и пускане върху формата.

Редактиране на връзки сигнал - слот

Сигналите и слотовете представляват механизъм за комуникация между обекти. При определени събития, например: щракване върху надпис от менюто, промяна на размера на прозорец и др., обектът, в който възниква събитието, изпраща сигнал. Този сигнал може да бъде приет от други обекти и те да извършат определени действия. Действията, извършвани при приемане на сигнали се наричат слотове. Всъщност, слотовете представляват член функции на обектите. За да се осъществи приемане от някой слот на излъчен от даден обект сигнал, трябва да се осъществи връзка между съответните сигнал и слот. По-късно ще видим как се реализира този механизъм чрез програмен код, а сега да видим как се прави с програмата designer.

В програмата designer има инструмент - редактор на връзки сигнал – слот (Signasl & Slots Editor). За да отворите прозореца на този инструмент, в случай, че не се вижда на екрана, щракнете от менюто върху Tools -> Signal/Slot Editor.

В Qt Creator, в режим Design, има подпрозорец (изглед) Signals & Slots Editor. Потърсете името на този прозорец в долната средна част на прозореца на Qt Creator, над лентата на състоянието, и щракнете върху него. Ако последния не се вижда на екрана, отворете подменю Window – Views и проверете има ли отметка пред надписа Signals & Slots Editor. Ако няма отметка в менюто, щракнете върху Signals & Slots Editor, а ако има отметка, то потърсете този надпис на друго място в прозореца на Qt Creator.

За да създадете нова сигнал - слот връзка, щракнете бутона "+" в прозореца на сигнал-слот редактора. Това добавя нов ред в таблицата, която се вижда в прозореца му. На този ред трябва да посочите: обекта, излъчващ сигнал (Sender); сигнала (Signal); обекта приемащ сигнала (Receiver) и слота на приемащия обект (Slot).

Подходящите стойности се избират от падащи менюта, които се активират като щракнете двойно върху съответната клетка. За да свържете сигнала, който се излъчва при щракване в менюто върху Quit със слота, който затваря програмата, изберете от падащите менюта, съответно: Sender: actionClose; Signal: triggered() и Receiver: MainWindow; Signal: close().

Друга възможност е да създадете собствен слот, което се извършва от прозореца Action Editor, в който се виждат създадените до момента обекти от тип QAction, представляващи подавани от меню команди. За да създадете слот за обекта actionClose, щракнете с десен бутон върху него в прозореца Action Editor. От изскачащото меню изберете Go to Slot... В прозореца, който се появява, изберете сигнала triggered(), с който ще бъде свързан новия слот и щракнете OK. Qt Creator автоматично създава програмния код за нов слот с име on_actionClose_triggered(). Ако това ще е слот за затваряне на главния прозорец, то трябва в прозореца на редактора, на мястото, което се отваря да добавите:

close();

По така описания начин, можете да създадете слот, който да изпълни произволно сложен програмен код.

Запишете файла, компилирайте програмата и вижте резултата.

Редактиране на действия (Actions)

Менютата представляват набори от команди, които потребителят на една програма, може да подава към нея. В Qt командите се представят с понятието за действия (Actions). Освен в менюта, действията могат да се показват и върху ленти за инструменти (Toolbars). Всяко действие визуално се представя с надпис и/или изображение (икона), а програмно е свързано с изпълняването на програмен код, представляващ слот на някой от създадените в програмата обекти. Потребителят стартира дадено действие, като щраква с мишката или тупва с пръст върху изображението на действието в съответното меню или лента, или като използва клавишни комбинации.

Така че, стъпките които програмистът прави при създаване на ново действие са:

1. създаване на действие;

2. настройване на външния му вид – задаване на надпис и/или икона;

3. поставяне на действието на необходимите места в интерфейса на програмата – в менюта и ленти за инструменти;

4. свързване на сигнала triggered() на действието със слот на някой обект, а ако няма подходящ слот – създаване на такъв;

5. програмиране в свързания слот на обработката, която следва да се прави от програмата при подаване на представената в действието команда.

Създаване на действие

Когато създавате нов ред в подменю от главното меню на програма (Вижте Създаване на меню) автоматично се създава ново действие, което ще съответства на този ред от менюто.

Ново действие може да се създаде и отделно с щракване върху бутон New в прозорец Action Editor. Щракването на този бутон отваря диалог за настройване на новото действие.

Настройване на действие

Когато стартирате създавате на ново действие с бутон New в прозорец Action Editor, или когато щракнете в този прозорец с десния бутон на мишката върху реда, представящ дадено действие и изберете Edit..., се отваря диалогов прозорец, от който се настройват следните параметри на действието:

Text – е текста, който се показва на екрана при изобразяване на действието. В операционни системи Windows и Linux за навигация в менюто на програма, може да се използват клавишни комбинации Alt+буква. Буквата, която съответства на всеки надпис в менюто, се показва подчертана. За да се подчертае дадена буква от надписа при показването му, при задаване на надписа, пред съответната буква трябва да се постави знак &.

Object name – е името на обекта от клас Qaction, с който действието се представя в програмния код.

ToolTip – е кратък подсказващ надпис, който се показва при задържане курсора на мишката върху изобразеното на екрана действие и пояснява предназначението на действието.

Icon theme - ...

Icon - ...

Checkable – отметка, която определя дали да може действието да има две състояния: включено и изключено. В кое от двете състояния се намира действието, ще се изобразява на екрана по подходящ начин, например с показване или липса на отметка пред текста на дайствието.

Shortcut – клавишна комбинация. За да зададете клавишна комбинация, щракнете с мишката в бялото поле и натиснете от клавиатурата, комбинацията или клавиша, който искате да зададете.

Диалога се затваря с бутоните OK – за запазване на настройките или Cancel – за отменяне на промени и затваряне без запазване на промени.

Поставяне на действие в интерфейса на програма

Поставянето на дадено действие в меню или лента за инструменти става с дърпане, влачене и пускане с мишката на това действие от прозореца Action Editor до съответното място в менюто или лентата за инструменти.

Свързване на сигнала triggered() със слот

triggered() е сигнал, който се излъчва от обект от клас QAction, когато потребителят с щракване с мишката, тупване с пръст върху чувствителния екран или клавишна комбинация, избере да се изпълни действието, представлявано от този обект. За да се случи нещо, когато потребителят избере действието, трябва този сигнал да е свързан с някой слот.

Свързването на сигналите, излъчвани от дадено действие, със съществуващи вече слотове, може да се направи по описания в Редактиране на връзки сигнал – слот начин.

Ако още не съществува подходящ слот, в прозореца Action Editor, при щракване с десен бутон на мишката върху дадено действие и избиране на Go to slot..., се отваря прозорец, за избиране на сигнал. По подразбиране в този прозорец е избран автоматично сигнала triggered(), но може да щракнете и върху друг сигнал. След затваряне на този диалог с бутон OK, автоматично се създава нов слот и се отваря редактора на код, на мястото за редактиране на новия слот.

Командата Go to slot... може да се използва по описания начин и за отваряне в редактора за код и на вече съществуващите, свързани с различни сигнали слотове.

Редактиране на лента с инструменти (Toolbar)

Лентата с инструменти е лента с бутони, която обикновено се показва в горния край на главния прозорец на една програма, но може да е подвижна и с влачене с мишката, може да се "закотви" и към всяка от страните на главния прозорец – лява, дясна, горна или долна, както и да бъде "плуваща" на произволно място върху екрана.

Често пъти бутоните върху лентата с инструменти изпълняват същите функции, както командите от меню.

Ако главният прозорец на програма не съдържа лента с инструменти, то такава може да се създаде с щракване на десен бутон на мишката на празно място върху формата на главния прозорец и избиране на командата Add Tool Bar.

Върху лентата с инструменти могат да се добавят създадени вече команди с влачене от прозорец Action Editor върху лентата с инструменти.

Ресурсите са файлове с изображения, икони, преведени на други езици надписи и др. данни, които се използват от създаваната програма. Един от начините да придружите своето приложение с файл, от който то извлича и използва някакви данни, е да представите файла с данни като ресурс.

Ресурсите се включват в създавания при компилирането изпълним файл. За ресурси се считат и .qml и .ui.qml файловете, описващи интерфейса. Необходимите в един Qt проект ресурси се описват в специални ресурсни файлове с разширение .qrc.

Нов ресурсен файл се създава и включва в проект с Qt Creator, от менюто: File – New File or Project и избиране на Files and Classes – Qt – Qt Resource File. След щракване на бутона Choose... се показва прозорец, в който трябва да напишете име на новия ресурсен файл. В следващия прозорец се посочва в кой от отворените проекти да се добави ресурсния файл и дали да се включи в хранилище за код.

След създаване на поне един ресурсен файл, в страничната лента на Qt Creator, в режим Edit, ако е избрано в момента там да се показват проекти, се появява нова група Resources с имената на ресурсните файлове в нея.

Файл, съдържащ, например, изображение, се добавя към ресурсен файл с щракване на десния бутон на мишката върху името на ресурсния файл в страничната лента на Qt Creator и избиране на командата Add Existing Files...

При създаване на обект от клас QFile към ресурсен файл, с цел, например, прочитане съдържанието на файла, името на файла се задава с:

":/ИмеНаФайл"

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

":/ИмеНаДиректория/ИмеНаФайл"

 

Предишна страница: Проектиране на интерфейса с Qt

Следваща страница: QML