Обзор библиотеки виджетов

Обзор библиотеки виджетов оконного окружения Photon

Оконная оболочка Photon содержит библиотеку виджетов, которые представляют собой управляемые объекты, большую часть своей работы выполняющие автоматически. С помощью них можно быстро собрать новое графическое приложение, комбинируя их в различных сочетаниях и реализуя лишь требыемый набор обработчиков, предоставляемых виджетами.

Перечень виджетов достаточно широк. Они могут быть классифицированы следующим образом:

Базовые виджеты
PtLabel — метки
PtButton — классические кнопки
PtText, PtMultiText — поля ввода текста
PtToggleButton — кнопки-переключатели
PtArc, PtRect, PtLine, ... — геометрические фигуры
PtScrollbar — области прокрутки
PtSeparator — разделители
PtSlider — бегунки
PtLabel, PtButton — изображения
PtProgress — индикаторы прогресса
PtNumericInteger, PtNumericFloat — числовые счетчики
Контейнеры
PtWindow — окна
PtGroup — группы
PtPanelGroup — группы панелей
PtScrollContainer — окна просмотра
PtBkgd — фоны
Дополнительные виджеты
PtMenu, PtMenuBar, PtMenuButton — меню
PtToolbar, PtToolbarGroup — панели инструментов
PtList — списки
PtComboBox — выпадающие списки
PtTree — древовидные списки
PtTty, PtTerminal — терминалы
PtDivider — разделители
PtTrend, PtMTrend — графики
PtColorSel, PtColorPanel, ... — инструменты для выбора цвета
Диалоговые функции
PtFileSelection() — диалоговое окно выбора файла
PtFontSelection() — модальное диалоговое окно выбора шрифта
PtPrintSelection() — модальное диалоговое окно выбора опций печати
PtAlert() — отображает сообщение и запрашивает ответное действие от пользователя
PtNotice() — отображает сообщение и запрашивает подтверждение от пользователя
PtPrompt() — отображает сообщение и запрашивает текстовый ввод от пользователя

Базовые виджеты

Основные виджеты, составляющие костяк любого приложения.

PtLabel — метки

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

PtLabel.png
Рисунок 1. Виджет PtLabel

PtButton — классические кнопки

Кнопки используются в подавляющем большинстве оконных систем. Они имеют 2 состояния: нажатый и отжатый, реагирующие на нажатия пользователя. Кроме того, при нажатии на кнопку автоматически вызывается обработчик, определяемый разработчиком.

PtButton.png
Рисунок 2. Виджет PtButton

PtText, PtMultiText — поля ввода текста

Имеется два виджета для ввода текста:

PtText.png
Рисунок 3. Виджет PtText

PtMultiText.png
Рисунок 4. Виджет PtMultiText

PtToggleButton — кнопки-переключатели

Кнопочные переключатели — это объекты, которые имеют два состояния: включено или выключено. Имеется несколько типов таких переключателей, каждый из которых имеет собственный вид. Кнопочные переключатели используются для отображения или запроса информации о состоянии.

PtToggleButton.png
Рисунок 5. Виджет PtToggleButton

PtArc, PtRect, PtLine, ... — геометрические фигуры

К данному классу виджетов относятся следующие примитивы:

Данные виджеты позволяют осуществлять вывод как простых линий и прямоугольников, до кривых Безье. Они имеют атрибуты для управления цветом, заливкой, декорированием узорами, толщиной линий, соединений и т.п.

PtArc.png
Рисунок 6. Виджеты PtArc, PtPixel, PtRect, PtLine, PtPolygon, PtEllipse, PtBezier и PtGrid

PtScrollbar — области прокрутки

Полосы прокрутки используются для навигации в виджетах, чей контент не может быть полностью размещен на экране. Они могут быть объединены с другими виджетами, включая PtList, PtScrollContainter и др.

PtScrollbar.png
Рисунок 7. Виджет PtScrollbar

PtSeparator — разделители

Разделители используются для разделения двух и более областей, например, элементы меню. Разделители могут иметь разные стили и виды.

PtSeparator.png
Рисунок 8. Виджет PtSeparator

PtSlider — бегунки

Бегунки отличаются от полос прокрутки тем, что первые определяют единственное значение, а последние определяют диапазон.

PtSlider.png
Рисунок 9. Виджет PtSlider

PtLabel, PtButton — изображения

Оконное окружение Photon поддерживает ряд основных графических форматов. Есть возможность импортировать изображения в этих форматах для отображения их внутри виджетов. Многие виджеты позволяют напрямую загружать и отображать изображения. Например, такие виджеты как PtButton (для создания панелей с инструментами) и PtLabel (для отображения картинок).

PtImages.png
Рисунок 10. Отображение изображений в виджетах

PtProgress — индикаторы прогресса

Если приложение выполняет длительную работу (например, загрузку файла), его текущий статус может отобразить индикатор процесса, что сообщит пользователю как текущее состояние процесса, так и оставшееся время. Индикатор процесса имеет массу настраиваемых атрибутов — он может быть горизонтальным или вертикальным, отображать точное значение или неопределенное (или оба варианта, как на иллюстрации ниже) и т.д.

PtProgress.png
Рисунок 11. Виджет PtProgress

PtNumericInteger, PtNumericFloat — числовые счетчики

Виджеты класса PtNumericInteger позволяют пользователю задать целочисленные значения в диапазоне между минимальным и максимальным значением. Виджеты класса PtNumericFloat позволяют вводить значения с плавающей запятой.

PtNumericInteger.png
Рисунок 12. Виджет PtNumericInteger

Контейнеры

Виджет-контейнер — это мощный и удобный интерфейсный инструмент, который позволяет интегрировать одни виджеты в другие и управлять их отображением. Контейнеры широко используются в большинстве Photon-приложениях.

PtWindow — окна

Окна — это основные контейнеры в приложениях. Основные компоненты пользовательских интерфейсов (панели меню, инструментов и т.п.) отображаются вместе с родительским окон. Данный виджет автоматически выполняет все необходимые взаимодействия с менеджером окон. Все, что остается задать — это перечень того, что нужно и что не нужно визуализировать или контролировать.

PtWindow.png
Рисунок 13. Виджет PtWindow

PtGroup — группы

Группа — это очень мощный виджет, который управляет геометрией всех дочерних виджетов. Этот виджет может выравнивать виджеты по горизонтали, вертикали, и матрично. У группы есть атрибуты, которые позволяет задать привязку и растягивание порожденных виджетов при изменении размеров родителя.

PtGroup.png
Рисунок 14. Виджет PtGroup

PtPanelGroup — группы панелей

Группы панелей представляют собой контейнеры, в которых содержатся панели — полезные элементы, позволяющие организовать данные в виде переключаемых и перекрываемых областей. Виджет не только управляет геометрией и отображением панелей, но и имеет два режима выбора панелей: выбор с множеством вкладок (каждая панель имеет свою собственную вкладку для выбора) или выбор по одной вкладке (при нажатии на вкладку отображается меню, в котором можно выбрать другие панели).

PtPanelGroup.png
Рисунок 15. Виджет PtPanelGroup

PtScrollContainer — окна просмотра

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

Для ускорения прокрутки дочерних элементов в окну просмотра виджет использует аппаратный блиттер графического ускорителя (при его наличии и поддержке на уровне графического драйвера).

PtScrollContainer.png
Рисунок 16. Виджет PtScrollContainer

PtBkgd — фоны

Виджет позволяет создавать фоновые изображения — от простых цветовых градиентных фонов до мозаично-текстурированных. Этот виджет может реализовать практически любые комплексные фоны.

PtBkgd.png
Рисунок 17. Виджет PtBkgd

Дополнительные виджеты

С помощью богатого набора описанных ранее виджетов разработчики могут создавать практически любые графические приложения. Тем не менее, также можно воспользоваться и дополнительными, еще более мощными виджетами:

PtMenu, PtMenuBar, PtMenuButton — меню

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

PtMenu.png
Рисунок 18. Виджет PtMenu

PtToolbar, PtToolbarGroup — панели инструментов

Контейнер PtToolbar может содержать кнопки, изображения и любые другие виджеты. Он позволяет выравнивать их по горизонтали или вертикали в пределах создаваемой панели инструментов. Виджет для создания группы панелей инструментов позволяет комбинировать панель инструментов с панелью меню.

PtToolbar.png
Рисунок 19. Виджет PtToolbar

PtList — списки

Этот виджет позволяет создавать списки элементов с различными режимами выбора: выбор одного элемента, множественный выбор или выбор диапазона элементов. Виджет для создания списков, посредством виджета PtDivider, позволяет создавать списки с несколькими колонками.

PtList.png
Рисунок 20. Виджет PtList

PtComboBox — выпадающие списки

Виджет позволяет создавать выпадающие списки и сочетает в себе виджет для создания полей ввода текста PtText и кнопку для открытия списка. Когда пользователь выбирает элементы из списка, текстовый виджет автоматически обновляется в соответствии с выбором. Это очень полезный инструмент для компактного отображения списка элементов. Диалоговые окна и контейнеры экономно используют графическое пространство экрана, что очень важно для встраиваемых систем.

PtComboBox.png
Рисунок 21. Виджет PtComboBox

PtTree — древовидные списки

Виджет для создания древовидных списков аналогичен предыдущему виджету. Основное отличие состоит только в том, что древовидный список отображает элементы в виде иерархической структуры. Элементы, называемые ветвями, могут быть свернуты или развернуты, а их количество может быть неограниченным. Каждая ветвь может отображаться вместе с уникальным рисунком. Древовидные списки полезны тем, что они позволяют структурировать отображаемую информацию.

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

PtTree.png
Рисунок 22. Виджет PtTree

PtTty, PtTerminal — терминалы

Данный виджет создает внутри себя терминал и управляет им в текстовом режиме. Чтобы создать эмулятор терминала ( pterm) достаточно разместить этот виджет в приложении. Кроме того, виджет создания терминала реализует полную функциональность вырезания и вставки, а также возможность быстрого выделения любого фрагмента текста.

PtTerminal.png
Рисунок 23. Виджет PtTerminal

PtDivider — разделители

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

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

PtDivider.png
Рисунок 24. Виджет PtDivider

PtTrend, PtMTrend — графики

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

PtTrend.png
Рисунок 25. Виджет PtTrend

PtColorSel, PtColorPanel, ... — инструменты для выбора цвета

Оконное окружение имеет несколько удобных инструментов для создания диалоговых окон выбора цвета: PtColorSel, PtColorPanel, PtColorPatch, PtColorSelGroup и PtColorWell. Этот набор удобных виджетов также включает в себя простые в использовании панели для создания смешанных цветов (PtColorPalette и PtColorPanel).

PtColorWell.png
Рисунок 26. Виджет PtColorWell

PtColorPanel.png
Рисунок 27. Виджет PtColorPanel

Диалоговые функции

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

PtFileSelection() — диалоговое окно выбора файла

Функция PtFileSelection() включает в себя виджет для создания древовидного списка, отображающего файлы, каталоги, ссылки на них, а также вспомогательные данные. Пользователь может не только выбирать заранее определенный файл, но и перемещаться по файловой системе и выбирать произвольные файлы и каталоги.

PtFileSelection.png
Рисунок 28. Виджет PtFileSelection

PtFontSelection() — модальное диалоговое окно выбора шрифта

Photon имеет удобный инструмент для выбора нужного шрифта из набора. Специальное диалоговое окно отображает список всех имеющихся шрифтов и позволяет пользователю выбирать начертание и стиль (жирный, наклонный и т.п.), а также включать функцию сглаживания (anti-aliasing).

PtFontSelection.png
Рисунок 29. Виджет PtFontSelection

PtPrintSelection() — модальное диалоговое окно выбора опций печати

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

PtPrintSelection.png
Рисунок 30. Виджет PtPrintSelection

PtAlert() — отображает сообщение и запрашивает ответное действие от пользователя

Это модальное диалоговое окно с предупреждением служит для извещения пользователя о некотором важном событии и ожидает ответ от него (например, нажатие одной из нескольких кнопкок, определяющих требуемую пользователем реакцию на событие).

PtAlert.png
Рисунок 31. Виджет PtAlert

PtNotice() — отображает сообщение и запрашивает подтверждение от пользователя

Диалоговое окно с извещением отображает сообщение и может потребовать необязательного ответного действия от пользователя. Это диалоговое окно часто снабжается кнопкой OK для подтверждения пользователем.

PtNotice.png
Рисунок 32. Виджет PtNotice

PtPrompt() — отображает сообщение и запрашивает текстовый ввод от пользователя

Аналогично диалоговому окну с предупреждением, это диалоговое окно отображает сообщение и ожидает ответа пользователя. Кроме того, оно снабжается полем для ввода текста.

PtPrompt.png
Рисунок 33. Виджет PtPrompt




Предыдущий раздел: перейти