В прошлой своей статье я рассказал о замечательном Кьют-инструментарии для быстрой разработки приложений с графическим интерфейсом в "Линуксе". Однако, Кьют - далеко не единственный такой инструментарий. В мире свободного бесплатного кроссплатформенного ПО для быстрой разработки приложений с графическим интерфейсом имеется ещё не одна альтернатива.

Впервые о Code::Blocks (далее - СиБи) я узнал несколько лет назад на страницах "Вестей" из статьи В. Станкевича. Прочитал, да и забыл... После перехода по ряду соображений на "Линукс" стал подбирать "сиплюсплюсный" RAD-инструментарий, и СиБи сам о себе напомнил. Если верить "Гуглу", то Кьют примерно в 4 раза популярнее, чем СиБи, однако СиБи моложе и быстро набирает рейтинг, потому что благодаря плагинам может работать с разными фреймворками. Последние в программировании - это библиотеки интерфейсных классов, НЕ зависящие от среды разработки. Вот библиотека VCL - не фреймворк, а MFC - фреймворк, но не кроссплатформенный. Использовать фреймворк без IDE - занятие малопроизводительное. Поэтому обычно с фреймворками работают в какой-нибудь IDE. В кроссплатформенном СиБи чаще всего работают с кроссплатформенным фреймворком wxWidgets второго поколения. Да и сама среда построена на этом фреймворке. В "Линуксе" фреймворк wxWidgets именуют wxGTK, что отражается на наименованиях пакетов, но не классов. Чтобы почувствовать, что такое СиБи, как кроссплатформенная RAD-среда, напишем "под Линукс" работающее приложение, аналогичное тому, которое было в статье о Кьюте ("КВ" №1/2009), и оценим, что получилось. Однако обо всём по порядку.

Устанавливаем СиБи и виджеты

В "Линуксе" Ubuntu-8.10 основные репозитории содержат все необходимые пакеты, как для СиБи версии 8.02, так и для wxWidgets версии 2.8, и ничего компилировать не надо. Впрочем, желающие иметь всё самое свежее могут скачать исходники с сайта codeblocks.org, а с сайта wxwidgets.org скачать пока не стабильный фреймворк wxWidgets версии 2.9 и повозиться. Однако благоразумнее всего вставить в привод дистрибутив Ubuntu-8.10 (кое-что возьмётся и из него), соединиться с Интернетом и с помощью команд sudo apt-get install или менеджера Synaptic установить следующие пакеты:

gettext, libcodeblocks0, codeblocks, wx2.8-doc, wx2.8-headers, wx2.8-examples, wx2.8-i18n, libwxbase2.8-0, libwxbase2.8-dbg, libwxbase2.8-dev, libwxgtk2.8-0, libwxgtk2.8-dev, wx-common, codeblocks-contrib, build-essential, libwxsmithlib0.

Последний пакет - это плагин для работы в режиме RAD с ограниченным, но не слишком бедным набором виджетов wxWidgets. Назначения остальных пакетов можно посмотреть менеджером Synaptic. Установка дайлапом обходится около 16 тыс. белорусских рублей. Большой 64 Мб пакет libwxgtk2.8-dbg для отладки графики пока не ставим, его можно добавить потом. После установки пакетов в системном меню "Линукса" Приложение > Программирование появляется пункт Code::Blocks IDE с иконкой. Хватаем её мышкой и вытягиваем на рабочий стол. Полезно также скачать с сайта codeblocks.org мануал (на английском языке), но это пока не обязательно; в настоящей статье, по мнению автора, должно хватить информации для быстрого старта в этой RAD-среде.

По умолчанию СиБи разворачивает своё хозяйство в директории /usr/share/codeblocks, директорию же проектов предварительно создаём сами, например, /home/me/codeblocks/Projects. На первых порах не понадобится редактировать ни одну переменную окружения. Перезагружаемся и запускаем СиБи.

Создаём проект

Чтобы начать работать, проще всего воспользоваться мастером создания проектов. Для этого из главного меню командуем File > New > Project... В открывшемся окне щёлкаем иконку wxWidgets рroject, затем жмём Go, и мастер заработает. Жмём Next. В открывшемся окне выбираем версию фреймворка. Выбираем wxWidgets 2.8.x, так как другая версия пока не установлена, и жмём Next. В следующем окне в строку Project title вписываем имя проекта, например, wx1, а в строку Folder to create project in вводим путь к проекту, например, /home/me/codeblocks/Projects. Жмём Next. В следующем окне вводим свой никнейм, адрес электронной почты и URL персонального сайта. Если сайта нет, вводим no. :) Жмём Next. В новом окне на панели Preffered GUI Builder выбираем плагин wxSmith, так как пакет wxformbuilder не устанавливали. На панели Application Type выбираем Frame Based тип будущего приложения. Можно выбрать и Dialog Based тип, но он менее гибок. Жмём Next. В открывшемся окне надо выбрать компилятор, по умолчанию предлагается GNU GCC Compiler, оставляем его, больше ничего не трогаем, жмём Next. В очередном окне предлагается использовать конфигурацию wxWidgets по умолчанию, соглашаемся и убеждаемся в наличии метки в чекбоксе использования прекомпилированных заголовков (PCH). Жмём Finish.

Возможно, потребуется донастроить компилятор. Для этого из главного меню командуем Settings > Compiler and Debugger. В открывшемся окне проверяем, помечены ли два первых чекбокса настроек компилятора, отвечающих за генерацию отладочного кода. Если нет, то помечаем, иначе отладчик работать не будет. Закрываем окно настроек. Проверим, работает ли СиБи. Из главного меню командуем Build > Build_and_run. Через несколько мгновений на экране должно появиться пустое окно с пустыми меню и статус-баром. Закрываем "приложение" и сохраняем проект, скомандовав из главного меню File > Save everything. Надо прерваться? Тогда командуем File > Save Project, затем File > Quit, жмём кнопку Да и отвлекаемся. При любом последующем запуске СиБи выводит список существующих проектов. Один клик по имени проекта - и он переоткрыт.

Наполняем проект

Внизу на центральной панели визуального проектирования СиБи предлагает палитру виджетов с пятью вкладками (рис. 1).

После щелчка по вкладке палитры при наведении курсора на виджеты высвечиваются их наименования, практически совпадающие с принятыми в борландовских продуктах, если не считать префикса "wx".

Для управления разработкой, кроме обычного инспектора объектов, который находится слева внизу в окне Management, СиБи предлагает набор быстрых инструментов, расположенный справа на панели визуального проектирования (рис. 2).

Обычно пользователю достаточно верхней кнопки и трёх нижних. Включение верхней кнопки разрешает бросать виджеты из палитры на форму, указывая мышью куда. Клик по кресту удаляет отмеченный на проектируемой форме элемент. Удалим с его помощью лишние статус-бар и меню на форме: сначала щёлкаем ненужный элемент, потом крест. Под крестом находится кнопка просмотра проектируемого окна без "боевой" компиляции приложения. Картинка компилируется из XML-образов потомков виджетов. Кнопка с буквой "кью" не имеет никакого отношения к Кьюту, а просто включает и выключает панель быстрого графического редактора свойств помеченного на форме элемента. Такого редактора нет в Делфи/Билдере, и будет возможность ещё не раз убедиться в его достоинствах. Включим графический редактор свойств и оставим его включённым (рис. 3).

Идея тестового приложения: пользователь вводит текст в строку редактирования, жмёт кнопку, и этот текст добавляется к тексту в списке. Полагаем, что список будет вверху окна приложения, а под ним - строка и кнопка. Потребуем, чтобы при изменении размеров окна приложения кнопка, не меняя размеров, оставалась бы в правому нижнему углу, строка предельно расширялась бы по горизонтали, не меняя высоты, а остальную площадь окна занимал бы список. Понадобятся стандартные виджеты: кнопка wxButton, текстовая строка wxTextCtrl и список wxListBox. Эти виджеты можно сразу бросить на форму и разместить вручную, как в Делфи или в Билдере, но получится криво: при изменении размеров окна готового приложения строка и список не будут изменять своих размеров. СиБи, как и Кьют, предлагает выход. Многие знают или слышали о менеджерах размещения Layout managers. Для виджетов имеется почти то же самое. Обычно, добавляя на форму элементы, предварительно вручную в ней что-то двигают. Эта работа в СиБи автоматизирована: при добавлении нового элемента он раздвигает ранее установленные элементы, которые теснят другие элементы, которые раздвигают границы окна. За такую автоматизацию отвечают специальные невизуальные элементы - "сайзеры" и "спейсеры". Их порождают виджеты из вкладки Layout палитры. Из пяти доступных сайзеров наиболее часто используется виджет wxBoxSizer. Внутри него элементы размещаются в вертикальный или в горизонтальный ряд, и между элементами можно задавать пропорции размеров.

Бросаем виджет wxBoxSizer на пустую форму. Форма съёживается в маленький квадратик (рис. 4).

Не пугайтесь, красный меченый квадрат - и есть сайзер с именем BoxSizer1. В инспекторе объектов изменяем его ориентацию wxHORIZONTAL на "правильную" wxVERTICAL. Бросаем из палитры внутрь него виджет wxListBox (рис. 5).

Белый помеченный квадрат на рисунке 5 - список ListBox1. Между нижним его краем и охватывающим сайзером нужно поместить ещё один сайзер wxBoxSizer для горизонтально располагаемых строки и кнопки. Чтобы не промахнуться, несколькими щелчками по спину в графическом редакторе свойств временно увеличим зазор между BoxSizer1 и ListBox1. Бросаем под список ListBox1 ещё один сайзер wxBoxSizer и получается то, что изображено на рисунке 6.

Красный помеченный квадрат на рисунке 6 - новый сайзер BoxSizer2. Внутрь него из палитры бросаем виджеты wxButton и wxTextCtrl, которым автоматически присваиваются имена Button1 и TextCtrl1 (рис. 7).

Надо отметить, что в Кьюте степень автоматизации размещения элементов заметно выше.

Всё, что делалось, отражается в СиБи-окне Management на вкладке Resources, называемой браузером ресурсов (рис. 8).

Щёлкаем в браузере ресурсов по wxFrame (это форма приложения) и в инспекторе объектов присваиваем его свойству Title без кавычек значение "Это тест".

Доработаем остальные элементы. Щёлкаем по списку ListBox1, растягиваем его до желаемых размеров. Графическим редактором свойств сбрасываем ширину его бордюра в ноль и помечаем чекбокс Expand. Обнаруживаем, что при изменении размеров списка ListBox1 сайзер BoxSizer2 тоже изменяет свою высоту. Так и должно быть, потому что эти элементы объединены общим сайзером BoxSizer1. Чтобы разрушить между ними размерную связь, графическим редактором свойств уменьшаем свойство Proportion (в Делфи такого нет) сайзера BoxSizer2 до нуля. Затем сбрасываем ширину его бордюра тоже в ноль и тоже помечаем чекбокс Expand. Кнопку перетягиваем вправо (рис. 9).

Строка и кнопка на рисунке 9 имеют одинаковую ширину. Чтобы разрушить между ними размерную связь, щёлкаем по кнопке Button1 и графическим редактором свойств сбрасываем Proportion в ноль. Затем вместо Expand помечаем чекбокс Shaped. Мышью меняем размеры кнопки до желаемых, с помощью инспектора объектов вводим в её свойство Label без кавычек текст "Нажми\nменя", а в свойство Tooltip без кавычек вводим подсказку "Добавление\nстроки слева\nв список вверху". Щёлкаем строку TextCtrl1, убираем её бордюры, помечаем чекбокс Expand.

Жмём кнопку просмотра и любуемся будущим приложением (рис. 10).

Тянем мышкой за угол окна и, изменяя его размеры, убеждаемся, что элементы интерфейса ведут себя на экране как положено, многострочная подсказка высвечивается, а смена темы рабочего стола ничего не искажает. Попробуйте так же просто добиться подобного в Делфи или в Билдере. :) Просмотр закрываем щелчком по крестику рамки или щелчком по кнопке просмотра. Дважды кликаем по кнопке Button1, и тут СиБи услужливо подсовывает код, перекрывающий событие OnClick. Точь-в-точь как в борландовских продуктах!

Пишем код

Внутрь кода функции OnButton1Click, автоматически сгенерированной при двойном щелчке по кнопке Button1, вписываем код обработчика события нажатия кнопки.

void wx1Frame::OnButton1Click(wxCommandEvent& event)
{
 wxString tx = TextCtrl1->GetLineText(0); // берём содержимое
 if ( tx.empty() ) // если нечего вставлять,
  return; // то всё
 // есть что вставлять:
 ListBox1->Append(tx); // вставляем содержимое строки в список
 TextCtrl1->Clear(); // чистим строку ввода
 TextCtrl1->SetFocus(); // возвращаем фокус на строку ввода
}

Код понятен, отлаживать тут нечего, поэтому в качестве цели компиляции Build target выбираем Release и из главного меню командуем Build > Build_and_run. Через мгновение приложение заработает, и убеждаемся, что оно работает как задумано. Терминальной командой ls -s ~/codeblocks/Projects/wx1/bin/Release смотрим размер исполняемого файла wx1: 56 килобайт; это в 2 раза хуже, чем в Кьюте, но и работы по написанию кода вдвое меньше, чем в Кьюте. За всё приходится платить. Но всё же это значительно лучше, чем был бы результат разработки аналогичного приложения Билдером!

Чтобы запустить приложение из терминала, а не из CиБи, надо либо скопировать исполняемый файл wx1 в директорию, к которой указан путь в переменной окружения PATH, (например, скопировать в директорию /usr/bin), либо просто добавить в эту переменную путь к оригиналу файла wx1. После этого, если есть желание, создавайте на рабочем столе иконку для запуска тестового приложения.

А дальше?

А дальше нужно учиться. Надо изучать иерархию виджетов, их свойства, методы и события. Надо учиться добавлять новые виджеты на палитру, устанавливать новые плагины. Фреймворк wxWidgets развивается уже 16 лет и весьма богат - здесь работа и с сокетами, и с базами данных, и с гипертекстом, и с OpenGL, и многопоточность, и много чего ещё.

Сначала настроим плагин помощи. Для этого из главного меню скомандуем Settings > Environment, в открывшемся окне выбираем Help Files и жмём Add. В новое окошечко вводим любое имя, например, helpme, и жмём ОК, затем Да. В предлагаемом дереве идём к директории wx2.8-doc, где находим файл wx2.8-manual_contents.html. Должно получиться нечто вроде /usr/share/doc/wx2.8-doc/wx-manual.html/wx2.8-manual_contents.html. Тут же из трёх чекбоксов отмечаем верхний, чем указываем, что эта помощь будет вызываться нажатием F1, и нижний, чем указываем, что она будет открываться встроенным HTML-просмотрщиком. Жмём ОК, и помощь настроена.

В директории /usr/share/doc/wx2.8-examples/examples/samples/widgets находятся сжатые исходники примеров приложений. Их надо распаковать, поместить в предварительно созданную директорию проектов примеров, создать для каждого примера по проекту и оттранслировать - ведь мы этому только что научились, не так ли? Для полученных исполняемых файлов создаём директорию Examples и копируем их туда. Не забываем пополнить переменную окружения PATH путём в эту директорию; как это делается - я уже рассказывал в предыдущей статье. Изучаем примеры.

Очень много полезного можно найти на сайтах docs.wxwidgets.org и wiki.wxwidgets.org. К сожалению, форумы по СиБи и фреймворку wxWidgets англоязычные. Так что, возможно, придётся подтянуть свой английский, чтобы перед тем, как задавать вопрос, поискать на форумах готовый ответ.

Не нравится фреймворк wxWidgets? Тогда сносите его, но не спешите удалять СиБи. По крайней мере, останется отличная IDE для разработки консольных приложений. И открою "секрет": команда разработчиков СиБи сделала неплохой "ход конём": СиБи поддерживает разработку программ для популярных микроконтроллеров с архитектурой AVR, т.е. предлагает бесплатную альтернативу платной AVR-Studio, что вряд ли безразлично электроникам.

Михаил ГУРЧИК,
gor-mike@tut.by