Бібліотека GTK#

Зміст

GTK+ (GIMP Toolkit) — бібліотека для створення графічних інтерфейсів користувача.

Код програм бібліотеки було написано мовою C під час розробки програми опрацювання зображень GIMP. Наразі більшість графічного інтерфейсу програмного забезпечення з відкритим кодом створюють з допомогою Qt або GTK+. Є мовні прив’язки для C++, С#, Java, Python та інших мов програмування.

GTK# — обгортка GTK+ для мови програмування C# — частина ініціативи Mono. Mono має два основні набори інструментів для віджетів: Winforms і GTK#. GTK# вважають рідним для операційної системи Linux/Unix. Але програми, створені за допомогою Gtk#, працюють і на платформах Microsoft Windows та Mac OS X.

Компіляція програм з використанням GTK# вказівкою терміналу:

Тут замість зірочки * потрібно вказати шлях до файлу програми.

Ознайомлення з GTK# здійснимо у процесі розгляду прокоментованих кодів. На жаль, це ознайомлення неможлмво зробити повністю логічно послідовним. Наприклад:

Контейнер Fixed використовують для розташування лівого верхнього кута об'єкта у точці з вказаними координатами — див. код з таким виглядом вікна.

Цей контейнер не виконує автоматичного керування макетом. Тому у більшості випадків не використовують цей контейнер.

Контейнери Hbox і Vbox використовують для розташування об'єктів відповідно по горизонталі й вертикалі.

Метод PackStart:

Метод PackEnd:

PackStart і PackEnd повідомляють Gtk#, де потрібно розмістити об'єкти. Бібліотека упорається з автоматичною зміною розміру та іншим. Така система компонування гнучкіша, ніж компонування з попіксельними координатами.

Синтаксис виклику PackStart (для PackEnd все так само)

box.PackStart(Widget child, bool expand, bool fill, int padding);

Синтаксис породження контейнера HBox (для VBox все так само)

HBox hbox = new HBox(bool homogeneous, int spacing);

Параметр homogeneous контролює, чи кожен об’єкт у полі має однаковий розмір, тобто однакову ширину в HBox (або однакову висоту у vbox).

Різниця між інтервалом spacing (надають значення під час створення контейнера) та відступом padding (надають значення під час пакування елементів) полягає у тому, що інтервал spacing додають між об'єктами, а відступ padding додають з обох боків об’єкта.

Контейнер Table використовують для розташування об'єктів відповідно по горизонталі, вертикалі та у комірках прямокутної таблиці.

Синтаксис породження контейнера Table

Table table = new Table (int n, int m, bool homogeneous);

Синтаксис розташування у контейнері Table елемента w

table.Attach (Widget w, int l, int r, int t, int b);

 для розташування:

Див. код створення вікна із застосуванням контейнерів.

Після клацання на кнопці з написом: "С" вікно набуде такого вигляду.

Контейнер ScrolledWindow призначено для розташування одного засобу (віджету): робить його прокручуваним за допомогою доданих смуг прокручування або зовнішньо пов’язаних налаштувань, і додатково малює рамку навколо дочірнього віджету. Використано у коді з TreeView — графічним модулем для показу списку рядків даних.

Рядок меню — одна з найпоширеніших частин інтерфейсу. Він містить ґрупи вказівок, розташованих у різних меню. Зазвичай вказівки зґруповано за принележністю до певних класів дій чи об'єктів застосування. Це загальноприйняті стандарти, які зменшують витрати часу на вивчення програми.

Просте меню подано прикладом зі створенням рядка меню з одним меню. Меню мість єдиний пункт, після вибору якого вікно буде закрито.

Меню зі значками подано прикладом створення меню верхнього рівня з трьома пунктами меню підрівня. Кожен із пунктів меню має зображення та прискорювач ("гарячі клавіші"), які активовано лише для відкриття файлу й виходу.

При виборі пункту меню Відкрити або натисканні клавіш Ctrl + O буде відкрито вікно діалогу вибору файлів.

При виборі пункту меню Вийти або натисканні клавіш Ctrl + Q буде припинено виконання програми із закриттям вікна.

Примітка. Для створення пункту меню зі значком використано наявні домовленості щодо назв і зображення: у записі Stock.* замість зірочки * можна вжити одне з таких зарезервованих слів: About, Add, Apply, Bold, Cancel, Cdrom, Clear, Close, ColorPicker, Connect, Convert, Copy, Cut, Delete, DialogAuthentication, DialogError, DialogInfo, DialogQuestion, DialogWarning, Directory, Discard, Disconnect, Dnd, DndMultiple, Edit, Execute, File, Find, FindAndReplace, Floppy, Fullscreen, GoBack, GoDown, GoForward, GotoBottom, GotoFirst, GotoLast, GotoTop, GoUp, Harddisk, Help, Home, Indent, Index, Info, Italic, JumpTo, JustifyCenter, JustifyFill, JustifyLeft, JustifyRight, LeaveFullscreen, MediaForward, MediaNext, MediaPause, MediaPlay, MediaPrevious, MediaRecord, MediaRewind, MediaStop, MissingImage, Network, New, No, Ok, Open, OrientationLandscape, OrientationPortrait, OrientationReverseLandscape, OrientationReversePortrait, Paste, Preferences, Print, PrintPreview, Properties, Quit, Redo, Refresh, Remove, RevertToSaved, Save, SaveAs, SelectAll, SelectColor, SelectFont, SortAscending, SortDescending, SpellCheck, Stop, Strikethrough, Undelete, Underline, Undo, Unindent, Yes,дані Zoom100, ZoomFit, ZoomIn, ZoomOut .

Меню з усіма значками такого вигляду

створює наступний код, у якому використано в алфавітному порядку усі перелічені вище службові слова.

Назви кнопок — ті службові слова, які використано першими у відповідних меню. Вище подано зображення значків і підписи для теми Mint-X операційної системи Linux Mint 20.3 Una Mate. Не для всіх вказівок вдається переозначити пришвидшувачі. Наприклад, для Копіювати у другому меню Convert.

Меню з міткою подано прикладом коду створення меню з міткою, що керує відображенням чи прихову­ванням рядку стану, який містить лише рядок тексту: "Елемент рядка стану".

Залежно від виставлення чи відсутністі мітки буде відображено або приховано рядок стану з рядком тексту. Припинення виконання програми можна здійснити вказівкою меню Файл / Вийти.

Меню з підменю подано прикладом коду з таким виглядом вікна після активування пункту меню, що містить підменю.

Панель інструментів створюють з допомогою класу Toolbar — див. приклад коду з таким виглядом вікна, у якому функціональною є лише кнопка виходу.

При створенні кнопок використано наявні зображення і службові слова. Панелей інструментів може бути кілька, їх можна розташувати у контейнер для подальшого розміщення у вікні застосунку.

Для кнопок Скасувати / Повторити необхідно вести облік кількості натискань, щоб не перевищити певну кількість натискань і вийти за обмеження за пам'яттю. Як це робити, показано у коді для кнопок Скасувати / Повторити і 5 натискань.

Елементи керування є основними будівельними блоками користувацького інтерфейсу. Протягом багатьох років кілька таких елементів керування стали стандартом у всіх наборах інструментів на всіх платформах. Наприклад, кнопка, прапорець або смуга прокручування. Філософія набору інструментів GTK# полягає у збереженні мінімальної кількості елементів. Спеціалізовані віджети створюють як користувацькі засобами GTK#.

Кнопка Button — елемент керування, клацанням на якому зазвичай запускають підпрограми — див. код створення такого вікна.

Після клацання на кнопці з написом: "С" вікно набуде такого вигляду.

Напис Label — елемент керування, що виводить текст — див. приклад використання без зміни властивостей шрифту і кольору тла з таким виглядом вікна

і приклад використання зі зміною:

Прапорець CheckButton — елемент керування, що дозволяє зробити множинний вибір з декількох варіантів. Як правило, прапорці відображають на екрані у вигляді квадрата невеликого розміру, який може мати два стани:
☐ «вимкнено» (порожньо);
☑ «увімкнено» (встановлено галочку або хрестик).
Змінити стан прапорця можна натисканням миші або за допомогою клавіш — див. код з такими виглядами вікна.

Перемикач RadioButton — елемент керування, що дозволяє зробити вибір одного з декількох варіантів. Як правило, перемикачі відображають на екрані у вигляді круга невеликого розміру, який може мати два стани:
«вимкнено» (порожньо);
«увімкнено» (обведено кольоровим колом).
— див. код з такими виглядами вікна: кожний наступний вигляд отримано клацанням кнопкою миші при вказаному розташуванні вказівника миші.

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

Примітка. Зазвичай такий елемент називають випадним списком (Drop-down list). А от комбінованим списком називають поєднання випадного списку і текстового поля, що дозволяє або вибирати значення з випадного списку, або вводити його з клавіатури.

Зображення Image — елемент керування для показу зображення, розташованого у буфері Gdk.Pixbuf, що у свою чергу можна заповнити зображенням з файлу — див. код з таким виглядом вікна

при наявності у поточній теці файлу зображення image.jpg.

Текстове поле Entry — елемент керування для введення тексу — див. код з таким виглядом вікна.

Горизонтальна шкала HScale — елемент керування для унаочнення розташування числового значення у певному діапазоні, розташований по горизонталі — див. код з таким виглядом вікна

при наявності у поточній теці файлів зображень mute.png, min.png, med.png, max.png. Зміну стану шкали можна здійснити перетягуванням повзунка за допомогою миші або натисканням клавіш керування вказівником.

Вертикальна шкала VScale — елемент керування для унаочнення розташування числового значення у певному діапазоні, розташований по вертикалі, аналог HScale — див. код з таким виглядом вікна

при наявності у поточній теці файлів зображень mute.png, min.png, med.png, max.png.

Кнопка перемикання ToggleButton — елемент керування — кнопка, яка має два стани: натиснута та не натиснута. Перемикання між цими двома станами здійснюють натисканням на цей елемент керування — див. код з таким виглядом вікна при різних 8 станах сукупності кнопок.

Темний колір кнопки вказує на натиснутий стан кнопки і надання відповідній компоненті RGB-моделі кольору максимально можливого значення. Світлий колір кнопки вказує на не натиснутий стан кнопки і надання відповідній компоненті RGB-моделі кольору нульового значення.

Календар Calendar — елемент керування для відображення дат вибраного місяця вибраного року і вибору дати — див. код з таким виглядом вікна

IconView — засіб для показу піктограм файлів вибраної теки, що має панель інструментів з двома кнопками для навігації файловою системою — див. код з таким виглядом вікна.

TreeView — засіб для показу структур даних.

Cписок рядків даних у програмі з TreeView — див. код з використанням даних про 6 українських поетів. У кожному рядку вказано ім’я, місце народження та рік народження кожного з них. Вікно програми після запуску має такий вигляд.

Після подвійного клацання на довільному з рядків дані цього рядка буде виведено у рядок стану. Нижче подано вигляд вікна після клацання на 4-му рядку.

Після клацання на назві стовпчика дані буде упорядковано за даними цього стровпчика. Повторне клацання прризведе до зворотного упорядкування рядків. Для клацання назві першого стовпчика вікно програми метиме такий вигляд.

Зменшення розміру вікна може призвести при потребі до появи смуг прокручування.

Ієрархічні дані (наприклад, вкладені списки, що відображають дані про орієнтований граф чи схему перебору деяких послідовностей) у програмі з TreeView — див. код з даними перебору усіх 1-, 2 і 3-цифрових чисел при двійковій системі числення, що еквіввалентна перебору усіх підмножин відповідно 1-, 2- чи 3-елемнтної множини. При клацанні на трикутні символи отримуємо розгортання чи згортання відповідних даних.

Опрацювання події зміни розміру чи розташування вікна здійснюють переозначенням методу OnConfigureEvent — див. код породження вікна, назва якого складається з екранних координат верхнього лівого кута екрану.

Перетин межі об'єкта вказівником миші породжує такі події:

— див. код програми, шо змінює напиc і його тло при перетині межі напису.

Відключення обробника події продемоструємо кодом програми, що створює кнопку та прапорець. При виставленому прапорці натискання кнопки призводить до виведення у консолі слова "Натиснуто", інакше обробник події натискання кнопки не спрацює.

MessageDialog — вбудований клас для породження вікна повідомлення — див. код створення такого вікна з чотирма кнопками.

Після натискання однієї з кнопок буде породжено відповідне вікно — одне з наступних.

Значення аргументів конструктора MessageDialog, використані у поданому коді:

Примітка.

AboutDialog — вбудований клас для породження вікна стислої довідки — див. код створення такого вікна:

Після натискання кнопки з написом Показати при наявності у поточній теці зображення логотипу kdenlive.png буде породжено вікно такого вигляду.

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

FontSelectionDialog — вбудований клас для породження вікна вибору шрифта — див. код створення такого вікна.

Після натискання кнопки з написом Вибрати шрифт буде породжено вікно діалогу для вибору шрифта.

Після вибору шрифту й натискання кнопки з написом Гаразд у вікні з назвою Початкове вікно текст Поточний шрифт буде відображено вибраним шрифтом.

ColorSelectionDialog — вбудований клас для породження вікна вибору кольору див. код створення такого вікна.

Після натискання кнопки з написом Вибрати колір буде породжено вікно діалогу для вибору кольору.

Після вибору кольору й натискання кнопки з написом Гаразд у вікні з назвою Початкове вікно вибраним кольором буде відображено напис Текст поточного кольору.

Pango — безкоштовна комп’ютерна бібліотека з відкритим вихідним кодом для відтворення інтернаціоналізованих текстів. Використовує системні шрифти, що забезпечує підтримку між платформами.

Див. код з використанням Pango для напису.

Системні шрифти можна переглянути з допомогою засобу TreeView за допомогою такого коду, що породжує таке вікно.

Клацання на рядку з написом Назва призведе до упорядкування даних у вікні. Повторне клацання призведе до упорядкування даних у протилежному порядку.

Кодування Unicode використано й у попередніх прикладах, і в коді, що породжує таке вікно.

Приклад удосконалення наявного засобу з допомогою Cairo подано кодом, що породжує вікно такого вигляду.

Текст упорядкував Олександр Рудик, використавши матеріали сторінки zetcode.com/gui/gtksharp/.