Редактор интерфейса Glade

Glade — это бесплатная программа для визуального создания интерфейса на основе кроссплатформенной библиотеки GTK+.

В любой программе необходимо создавать множество окон для взаимодействия с пользователям. Теоретически, все эти окна можно создать и отладить прямо в тексте программы, но это очень трудоемкое занятие. Для визуального создания окон и размещения виджетов обычно используется редактор интерфейса. Glade — это очень удобный и популярный редактор, который позволяет размещать виджеты GTK+ с помощью мыши.Особенностью редактора Glade является то, что пользовательские интерфейсы, разработанные в Glade, сохраняются в формате XML. Затем они могут загружены в приложение динамически с помощью объекта GtkBuilder. Формат XML понятен для человека, поэтому программист может при необходимости быстро внести изменения непосредственно в файл Glade.

Файлы Glade XML могут использоваться на многих языках программирования, включая C, C++, C#, Java, Perl, Python и другие.

Запуск Glade

Редактор Glade входит с состав сборки Си-экспресс. Для запуска нужно дважды щелкнуть на файле:

C:\Prog\Glade\bin\glade-3.exe

откроется окно программы:

Окно программы разделено на три части. Слева находится список виджетов. В центре находится создаваемый интерфейс. Справа — свойства виджетов.

Работа с Glade

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

Шаг 1. Нажимаем на виджет «Окно».

На экране появляется главное окно программы.

Шаг 2. Нажимаем на виджет «Вертикальный контейнер»

Появляется окно с вопросом, сколько элементов в контейнере.

Предположим, что три элемента.

Шаг 3. Добавляем виджеты

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

Добавляем последовательно три виджета. :

Строка меню
Записная книжка
Горизонтальный контейнер

Да, контейнер можно размещать внутри контейнера. В нижний контейнер добавим три виджета «Кнопка».

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

Шаг 4. Сохранить интерфейс

Нажмите «Файл — Сохранить» и дайте файлу имя «main.glade». Можно открыть это файл и убедиться, что это обычный XML-файл. Ниже фрагмент этого файла.

Шаг 5. Подключение к программе

Рассмотрим фрагмент программы для подключения интерфейса Glade:

	// Описание виджета окна
	GtkWidget   *window
	// Описание объекта GtkBuilder 
	GtkBuilder  *builder;
	// Создание объекта GtkBuilder 
	builder = gtk_builder_new ();
	// Загрузка файла Glade
    	gtk_builder_add_from_file(builder, "main.glade", NULL);
	// Получение главного окна
	window = GTK_WIDGET(gtk_builder_get_object(builder, "mainwindow"));
	// Обработка завершения программы
	g_signal_connect(G_OBJECT(window), "destroy", G_CALLBACK(gtk_main_quit), NULL);
	// Загрузка сигналов объекта
	gtk_builder_connect_signals (builder, NULL);
	// Отображение окна
	gtk_widget_show (window);

// Описание виджета окна

GtkWidget *window

// Описание объекта GtkBuilder

GtkBuilder *builder;

// Создание объекта GtkBuilder

builder = gtk_builder_new ();

// Загрузка файла Glade

gtk_builder_add_from_file(builder, "main.glade", NULL);

// Получение главного окна

window = GTK_WIDGET(gtk_builder_get_object(builder, "mainwindow"));

// Обработка завершения программы

g_signal_connect(G_OBJECT(window), "destroy", G_CALLBACK(gtk_main_quit), NULL);

// Загрузка сигналов объекта

gtk_builder_connect_signals (builder, NULL);

// Отображение окна

gtk_widget_show (window);

В этом фрагменте текста программы показан общий принцип подключения:

Создать объект GtkBuilder
Загрузить файл Glade в этот объект.
Загрузить сигналы Glade в сигналы программы
Отобразить объект

После загрузки файла Glade в программу все виджеты могут использоваться точно также, как любые виджеты GTK+.

Официальный сайт (eng): glade.gnome.org

Комментарии 8

Николай

22.11.2017 в 07:18

Очень интересно. Но могли бы вы посоветовать какую-нибудь книгу с описанием работы с сигналами для кнопок, какой сигнал что конкретно делает?

Ответить
- Константин Шереметьев
  
  22.11.2017 в 13:07
  
  Все сигналы для виджетов описаны в документации http://www.opennet.ru/docs/RUS/gtk_plus/
  Нужно только учесть, что сигналы в GTK+ имеют иерархию, то есть виджет получает не только свои сигналы, но и сигналы выше по иерархии. Поэтому для каждого виджета нужно обязательно смотреть его место в иерархии. Она приведена здесь.
  
  Ответить
Николай

23.11.2017 в 06:54

Спасибо за ответ. Но я имел в виду работу именно в Glade. Допустим я создал окно, две кнопки. Как мне задать действия для этих кнопок в самом Glade? Или я неправильно понял, и в Glade можно создавать окна, кнопки и т.д., а действия для них нужно прописывать в самой программе?

Ответить
- Константин Шереметьев
  
  23.11.2017 в 13:10
  
  Да, в самом Glade только выбираются события и назначаются имена обработчиков этих событий. Сами обработчики уже пишутся непосредственно в программе. Чуть позже я детально опишу, как это делается.
  
  Ответить
Николай

23.11.2017 в 06:55

И можно ли будет в дальнейшем зарегистрироваться на этом сайте, для обсуждения тех или иных вопросов?

Ответить
- Константин Шереметьев
  
  23.11.2017 в 13:11
  
  Вы имеете в виду, будет ли форум? Пока не знаю.
  
  Ответить
Дмитрий

15.05.2019 в 07:30

Можно ли в Glade для виджетов добавлять свои свойства, что бы пользователь с экрана мог их заполнить ?

Ответить
- Константин Шереметьев
  
  17.05.2019 в 11:12
  
  Да. Можно написать свой виджет на базе GTK+ и добавить его в Glade.
  
  Ответить

Добавить комментарий Отменить ответ

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.