Руководство по программированию с wxWidgets (7. Виджеты часть 1).

Виджеты.

В этой главе мы рассмотрим небольшие примеры некоторых виджетов, доступных в wxWidgets. Виджеты являются строительными блоками наших приложений. wxWidgets содержит большое количество полезных виджетов. Виджет - это базовый GUI объект для определения. Виджеты дали название проекту wxWidgets. Термин виджет используется в UNIX системах. В Windows виджет называют элементом управления.

wxCheckBox (Чек Бокс)

У этого виджета есть два состояния: Вкл. и Выкл. Это бокс с меткой. Метка может находиться с правой или с левой стороны бокса. Если чек бокс взведён, то это отображается наличием галочки в боксе. Чек бокс может быть использован для реализации появления/скрытия заставки при запуске, или переключения видимости панели инструментов.

В нашем примере мы реализуем один чек бокс в окне. Мы переключим заголовок окна нажатием на чек бокс.

m_cb = new wxCheckBox(panel, ID_CHECKBOX, wxT("Show title"),

wxPoint(20, 20));

m_cb->SetValue(true);

Мы создали чек бокс. По-умолчанию, заголовок отображается. Поэтому мы взводим чек бокс, вызывая метод SetValue().

Connect(ID_CHECKBOX, wxEVT_COMMAND_CHECKBOX_CLICKED,

wxCommandEventHandler(CheckBox::OnToggle));

Если мы кликнем на чек боксе, сгенерируется событие wxEVT_COMMAND_CHECKBOX_CLICKED. Мы соединим это событие с определённым пользователем методом OnToggle().

if (m_cb->GetValue()) {

this->SetTitle(wxT("CheckBox"));

} else {

this->SetTitle(wxT(" "));

}

Внутри метода OnToggle(), мы проверяем состояние чек бокса. Если он взведён, то мы отображаем строку "Check Box" в заголовке, если нет - не отображаем.

wxBitmapButton (Растровая кнопка)

Растровая кнопка - это кнопка отображающая растровую картинку. Может иметь три различных состояния: selected (при выборе), focused (при наведении) и displayed (отображаемое). Мы можем задать свою картинку для каждого из состояний.

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

wxImage::AddHandler( new wxPNGHandler );

Т.к. мы собираемся использовать PNG картинку, то нужно сначала инициализировать обработчик PNG изображений.

button = new wxBitmapButton(panel, wxID_ANY, wxBitmap(wxT("mute.png"),

wxBITMAP_TYPE_PNG), wxPoint(180, 20));

Мы создали растровую кнопку. Мы указали растровый тип, в нашем случае wxBITMAP_TYPE_PNG.

pos = slider->GetValue();

Мы получили значение слайдера. В зависимости от этой величины определяем одно из четырёх состояний громкости: минимальная, низкая, средняя, максимальная. Для каждого состояния мы указали растровую картинку для нашей кнопки. Для изменения картинки на кнопке мы использовали метод SetBitmapLabel().

wxToggleButton (Переключатель)

Переключатель - это кнопка, имеющая два состояния: нажата или не нажата. Переключение между этими состояниями происходит путём нажатия на кнопку. Существует множество ситуаций, где такая функциональность очень кстати. Вот например:

В нашем примере мы создали три переключателя и панель. Мы установили цвет фона панели черным. Переключатели же переключают красную, зелёную и синюю части цветового кода. Цвет фона зависит от того, какие переключатели нажаты.

colour = new wxColour(0, 0, 0);

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

m_tgbutton1 = new wxToggleButton(panel, ID_TGBUTTON1,

wxT("Red"), wxPoint(20, 20));

Здесь мы создали переключатель.

Connect(ID_TGBUTTON1, wxEVT_COMMAND_TOGGLEBUTTON_CLICKED,

wxCommandEventHandler(ToggleButton::OnToggleRed));

Если мы нажмём на переключатель, то сгенерируем событие wxEVT_COMMAND_TOGGLEBUTTON_CLICKED. Мы соединим его с обработчиком событий. Помните, нельзя соединять события с методами кнопки. Используйте для этого wxFrame.widget, являющийся прародителем переключателя. Это вполне допустимо, так как командные события репродуцируются к своим предкам. В нашем случае это выглядит так кнопка -> панель -> рамка. Если мы хотим соединить событие с кнопкой, мы должны создать свой производный класс кнопок, а это достаточно трудоёмкий процесс.

if ( colour->Blue() ) {

colour->Set(red, green, 0);

} else {

colour->Set(red, green, 255);

}

В обработчике событий мы установили соответствующие параметры wxColour.

m_panel->SetBackgroundColour(colour->GetAsString());

Установили фон панели.

wxStaticLine (Статическая линия)

Этот виджет отображает простую линию в окне. Она может быть горизонтальной или вертикальной.

В этом примере, мы отобразили страны центральной Европы и их население. Использование статических линий сделало текст более визуально привлекательным.

wxStaticLine *sl1 = new wxStaticLine(this, wxID_ANY, wxPoint(25, 50),

wxSize(300,1));

Здесь мы создали горизонтальную статическую линию шириной 300 пикселей, высотой 1 пиксель.

wxStaticText (Статический текст)

Статический текст отображает одну или больше строк доступного только для чтения текста.

В нашем примере мы вывели в окне часть текста песни Эминема "Till I Collapse".

wxStaticText *st = new wxStaticText(panel, wxID_ANY, text,

wxPoint(10, 10), wxDefaultSize, wxALIGN_CENTRE);

Здесь мы создали wxStaticText виджет. Статический текст выровнен по середине.

wxSlider (Слайдер)

Слайдер - это виджет, который снабжён простым ползунком. Его можно перемещать вперёд и назад. Таким образом мы можем выбирать значение для конкретной задачи. Иногда использование слайдера более привычно, чем введение числа или использование спин регулятора.

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

slider = new wxSlider(this, ID_SLIDER, 0, 0, 140, wxPoint(50, 30),

wxSize(-1, 140), wxSL_VERTICAL);

Мы создали вертикальный слайдер. Начальное значение равно 0, минимальное значение тоже, максимальное равно 140. Мы не выводим никаких галочек или меток.

Connect(ID_SLIDER, wxEVT_COMMAND_SLIDER_UPDATED,

wxScrollEventHandler(MyPanel::OnScroll));

Здесь мы соединили событие wxEVT_COMMAND_SLIDER_UPDATED с определённым пользователем методом OnScroll().

Connect(wxEVT_PAINT, wxPaintEventHandler(MyPanel::OnPaint));

Так как мы собираемся немного порисовать, то соединяем метод OnPaint() с событием wxEVT_PAINT.

fill = slider->GetValue();

Refresh();

В методе OnScroll() мы получаем текущее значение слайдера. Мы вызываем метод Refresh(), который генерирует событие wxEVT_PAINT.

dc.DrawRectangle(wxRect(140, 30, 80, 140));

dc.DrawRectangle(wxRect(140, 30, 80, fill));

Внутри обработчика событий OnPaint(), мы рисуем два прямоугольника. Первый метод рисует белый прямоугольник с серой окантовкой. Второй - коричневый прямоугольник, высота которого регулируется значением заливки, которая в свою очередь задаётся слайдером.