Навигация:
<< >> Оглавление Указатель

Описание пользователя

Глава 2. Интерфейс пользователя

§2.10. Редактирование векторной картинки блока

§2.10.2. Рисование прямоугольников и эллипсов

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

Для того, чтобы добавить в картинку прямоугольник, следует нажать на панели элементов в левой части окна кнопку «прямоугольник» (вместо этого можно выбрать пункт меню «элемент | прямоугольник», рис. 116 а ), переместить курсор мыши в точку рабочего поля, где будет располагаться левый верхний угол прямоугольника, нажать левую кнопку, а затем, не отпуская кнопки, переместить курсор в точку, где будет располагаться правый нижний угол прямоугольника (в процессе перемещения будет изображаться пунктирная рамка, отмечающая границы будущего прямоугольника, рис. 116 б). После отпускания кнопки на рабочем поле появится новый прямоугольник (рис. 116 в), цвет и параметры которого будут взяты из параметров по умолчанию графических элементов, а на панели элементов снова окажется нажатой кнопка «выбор» – теперь можно изменить параметры созданного прямоугольника, если это требуется. Прямоугольники со скругленными углами, эллипсы и рельефные прямоугольники рисуются точно таким же образом после нажатия на панели элементов соответствующих им кнопок или выбора соответствующих пунктов меню «элемент». После рисования любого элемента редактор переходит в режим выбора, для повторного рисования следует снова нажать кнопку на панели элементов.

Рисование прямоугольника: выбор режима (а), рисование (б), готовый прямоугольник (в) 1

(а)

Рисование прямоугольника: выбор режима (а), рисование (б), готовый прямоугольник (в) 2

(б)

Рисование прямоугольника: выбор режима (а), рисование (б), готовый прямоугольник (в) 3

(в)

Рис. 116. Рисование прямоугольника: выбор режима (а), рисование (б), готовый прямоугольник (в)

Чтобы вызвать окно параметров прямоугольника, следует либо дважды щелкнуть на нем левой кнопкой мыши, либо выбрать в контекстном меню, открывающемся по щелчку правой кнопкой, пункт «параметры». Окно содержит две вкладки: «внешний вид» (рис. 117), на которой задается положение, размер и цвета прямоугольника, и «связи» (рис. 118), на которой параметры прямоугольника можно связать с переменными.

Окно параметров прямоугольника – вкладка внешний вид

Рис. 117. Окно параметров прямоугольника – вкладка «внешний вид»

В левой верхней части вкладки «внешний вид», на панели «обрамление», задаются параметры рамки прямоугольника, то есть линии, ограничивающей его. Если флажок «линия» на этой панели не установлен, рамки у прямоугольника не будет (он весь будет рисоваться одним цветом, заданным на панели «заполнение»). При установленном флажке можно выбрать из списка тип линии рамки (сплошная, пунктир и т.п.), толщину линии в точках экрана и цвет линии. Флажок «масштаб» разрешает изменение толщины линии согласно выбранному масштабу: если он установлен, толщина рамки будет увеличиваться и уменьшаться вместе с масштабом картинки. Например, рамка, для которой задана толщина в четыре точки экрана, в масштабе 200% будет иметь толщину 8, в масштабе 50% – толщину 2. Если флажок сброшен, толщина рамки всегда будет равна установленному в поле ввода над флажком значению. Задание нулевой толщины рассматривается как указание всегда рисовать рамку наименьшей возможной толщины, то есть на экране рамка будет толщиной в одну точку экрана, а на принтере при печати изображения схемы – в одну точку принтера (таким образом визуально она будет тоньше, так как разрешение принтера обычно выше разрешения экрана). Как правило, при разрешении масштабирования толщины линии картинка выглядит лучше, но у разработчика может быть другое мнение, поэтому RDS дает ему возможность зафиксировать эту толщину. Следует учитывать, что для всех типов линий, кроме сплошной, толщина должна равняться нулю или единице – это ограничение RDS.

В левой нижней части вкладки находится панель «заполнение», на которой можно разрешить заливку внутренности прямоугольника заданным цветом (флажок «заполнение» установлен) или сделать его прозрачным (флажок сброшен). Заполнить внутреннюю часть прямоугольника штриховкой в редакторе картинки RDS нельзя, заливка всегда будет сплошной. Следует помнить, что нельзя одновременно сбросить флажки «линия» и «заполнение»: в этом случае у прямоугольника не было бы ни рамки, ни заливки, и он был бы невидим для пользователя. Если разработчику нужна невидимая прямоугольная область для обработки щелчков мыши в модели блока, следует вместо прямоугольника добавить в картинку невидимую зону.

В правой части вкладки «внешний вид» задаются координаты левого верхнего угла прямоугольника и его размеры. Все координаты и размеры задаются в точках экрана для масштаба 100%, началом координат является начало координат картинки блока или текущей редактируемой вложенной системы координат. На рабочем поле редактора это начало координат отмечено точкой пересечения осей (см. рис. 113).

На вкладке «связи» (рис. 118) можно связать ширину, высоту и цвет прямоугольника с переменными блока, которому принадлежит картинка. Положение и угол поворота прямоугольника с переменными связать нельзя – если требуется перемещать или поворачивать прямоугольник, следует поместить его во вложенную систему координат, и перемещать и поворачивать ее.

Окно параметров прямоугольника – вкладка связи

Рис. 118. Окно параметров прямоугольника – вкладка «связи»

В верхней части вкладки можно связать с переменными ширину (панель «горизонтальный масштаб») или высоту («вертикальный масштаб») блока. Имя переменной либо выбирается из выпадающего списка, содержащего имена переменных блока, картинка которого вызвана на редактирование, либо вводится с клавиатуры. Ввод или выбор пустой строки отключает связь с переменной (подробнее о связи элементов картинки с переменными см. в §2.10.9. И для ширины, и для высоты значение переменной умножается на ширину или высоту, заданную на вкладке «внешний вид»: если, например, у прямоугольника с шириной 10 точек экрана в качестве горизонтального масштаба указана переменная с текущим значением 1.5, в режимах моделирования и расчета этот прямоугольник будет иметь ширину в 15 точек экрана, а если значение этой переменной изменить на 0.5, прямоугольник буден нарисован в 5 точек шириной. В выпадающем списке «привязка» можно выбрать, какая именно часть прямоугольника остается на месте при изменении размера. При привязке слева на месте будет оставаться левая граница прямоугольника, и изменение размера будет осуществляться за счет правой границы, при привязке справа на месте будет оставаться правая граница, при привязке по центру на месте будет оставаться центр прямоугольника. Аналогично работает привязка высоты сверху, снизу и по центру. С использованием привязки можно создавать простые столбцовые индикаторы: например, если нарисовать вертикальный прямоугольник, связать его вертикальный масштаб с переменной и установить привязку снизу, при значениях переменной, больших единицы, столбик будет расти вверх, при значениях от единицы до нуля его высота будет уменьшаться до нуля, при отрицательных значениях он будет расти вниз.

В нижней части вкладки «связи» можно связать с переменными цвет заполнения прямоугольника (цвет рамки с переменными связать нельзя). Цвет можно связать с переменной двумя способами. Если ввести имя переменной в поле «основной цвет», целое значение этой переменной будет трактоваться как цвет заполнения в формате RGB, то есть младший байт числа должен содержать интенсивность красного, второй байт – интенсивность зеленого, третий – интенсивность синего цветов (число 255 задает яркий красный цвет, число 65280 = 255×256 – яркий зеленый, и т.п.). При этом в режимах моделирования и расчета прямоугольник будет заполняться не тем цветом, который был указан в редакторе при его создании, а цветом, взятым из переменной. При помощи такой связи, можно, например, добавить в изображение блока элементы, цвет которых будет плавно изменяться при изменении переменной.

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

С использованием альтернативного цвета можно создавать, например, зажигающиеся и гаснущие индикаторы.

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

В нижней части вкладки, под панелями, находится поле ввода для целого числового идентификатора элемента. Присвоение идентификаторов элементам картинки позволяет модели блока определить, над каким именно элементом в данный момент находится курсор мыши (подробно использование идентификаторов в моделях описывается в §3.6.11 описания пользователя и §2.12.1 руководства программиста). В блоках без моделей присваивать идентификаторы элементам картинки не имеет смысла – эти идентификаторы некому будет считывать.

Окно параметров прямоугольника со скругленными углами выглядит практически так же, как и окно параметров обычного прямоугольника, но в нем кроме вкладок «внешний вид» и «связи» присутствует вкладка «углы» (рис. 119), на которой задается ширина и высота эллипса, которым скругляются углы прямоугольника.

Окно параметров прямоугольника со скругленными углами – вкладка углы

Рис. 119. Окно параметров прямоугольника со скругленными углами – вкладка «углы»

Следует помнить, что в RDS прямоугольник со скругленными углами не может поворачиваться – он обычно используется при создании изображений различных блок-схем, где поворот изображений не требуется. Если поместить такой прямоугольник в систему координат и задать ей угол поворота, отличный от нуля, прямоугольник со скругленными углами преобразуется в обычный, углы которого не скруглены.

Эллипс или окружность рисуются примерно так же, как и прямоугольник (см. рис. 116), только на панели элементов следует нажать кнопку «эллипс», а в процессе рисования внутри пунктирной рамки будет изображаться вписанный в нее эллипс. Окно параметров эллипса в целом похоже на окно параметров прямоугольника: вкладка «связи» у них одинаковая, вкладка «внешний вид» имеет небольшие отличия (рис. 120). Вкладка «форма» (рис. 121) есть только в окне параметров эллипса.

Окно параметров эллипса – вкладка внешний вид

Рис. 120. Окно параметров эллипса – вкладка «внешний вид»

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

На панели «размеры» окна параметров эллипса находится дополнительный флажок «окружность», отсутствующий у прямоугольника. Если он установлен, вместо раздельного задания ширины и высоты эллипса можно будет задать только одно значение – диаметр, и эллипс превращается в окружность. На рабочем поле окружность будет оставаться окружностью (то есть эллипсом с одинаковыми шириной и высотой) и при масштабировании перетаскиванием маркеров выделения – при перемещении горизонтальных маркеров вертикальные будут перемещаться автоматически. Чтобы получить возможность снова задавать ширину и высоту эллипса раздельно, следует открыть окно его параметров и сбросить флажок «окружность».

Окно параметров эллипса – вкладка форма

Рис. 121. Окно параметров эллипса – вкладка «форма»

На вкладке «форма» можно преобразовать полный эллипс в сектор, сегмент или дугу – для этого следует установить соответствующий флажок. Ниже, на дополнительной панели (ее название будет соответствовать выбранной форме), можно задать начальный и конечный углы, ограничивающие сектор, дугу или сегмент, при этом на ней будет изображаться примерный внешний вид получающейся фигуры без учета пропорций длины и ширины. Углы отсчитываются против часовой стрелки от горизонтальной линии, направленной из центра эллипса вправо, их можно вводить как в градусах, так и в радианах (для задания единиц измерения углов предусмотрены выпадающие списки).

Маркеры выделения сектора

Рис. 122. Маркеры выделения
сектора

Несмотря на то, что сектор, сегмент или дуга визуально занимают на рабочем поле меньше места, чем полный эллипс, редактор картинки считает размером такой фигуры размер полного эллипса, которому эта фигура принадлежит. Это относится и к размеру блока, картинка которого редактируется – выступающие «невидимые» части полного эллипса считаются входящими в картинку и блок будет воспринимать щелчки мыши на этих частях. Если выделить сектор, сегмент или дугу эллипса в редакторе картинки (рис. 122), можно увидеть невидимую в обычном режиме часть эллипса – она изображается пунктирной линией. При этом кроме девяти обычных маркеров выделения, расположенных по сторонам и углам всей области эллипса, рисуются три дополнительных маркера: по два круглых на концах лучей, отсекающих сектор, сегмент или дугу от эллипса, и один квадратный на середине дуги. Перетаскивая мышью эти маркеры, можно поворачивать фигуру относительно центра эллипса и менять углы отсекающих лучей.

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

Изменение угла сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 1

(а)

Изменение угла сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 2

(б)

Изменение угла сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 3

(в)

Рис. 123. Изменение угла сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в)

Точно так же можно повернуть сектор, сегмент или дугу вокруг центра эллипса: для этого следует нажать на квадратном маркере выделения в центре дуги левую кнопку мыши и, не отпуская ее, переместить маркер в новое положение (рис. 124).

Поворот сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 1

(а)

Поворот сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 2

(б)

Поворот сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в) 3

(в)

Рис. 124. Поворот сектора: выбор маркера (а), перемещение маркера (б), измененный сектор (в)

Выпуклый (сверху) и вдавленный (снизу) рельеф

Рис. 125. Выпуклый (сверху) и
вдавленный (снизу) рельеф

Для рисования различных панелей управления, кнопок и т.п. в редакторе картинки предусмотрен специальный тип прямоугольника – рельефный прямоугольник. От обычного прямоугольника он отличается двухцветной рамкой: левая и верхняя стороны рамки рисуются одним цветом, а правая и нижняя – другим. Если левая верхняя часть рамки будет светлее правой нижней, прямоугольник будет визуально восприниматься выступающим над плоскостью экрана (рис. 125 сверху), если же левая верхняя часть будет темнее, прямоугольник будет казаться вдавленным (рис. 125 снизу). Следует помнить, что в RDS рельефный прямоугольник не поворачивается: если поместить его во вложенную систему координат и задать этой системе угол поворота, отличный от нуля, левый верхний угол рельефного прямоугольника будет поворачиваться вместе с остальными элементами системы, но его стороны останутся строго горизонтальными и вертикальными. Если по каким-либо причинам необходимо создать поворачивающуюся рельефную фигуру, ее следует собрать из отдельных частей: обычного прямоугольника и четырех линий разных цветов.

Окно параметров рельефного прямоугольника (рис. 126) несколько отличается от окна параметров обычного: в рельефном параметры рамки и заполнения и положение с размером разнесены по разным вкладкам. Кроме того, на вкладке «внешний вид» задается два цвета рамки: темный и светлый, а расположение этих цветов на самой рамке задается флажками «выступ» (светлый цвет слева сверху) и «впадина» (светлый цвет справа снизу).

Вкладки внешний вид (а) и координаты (б) окна параметров рельефного прямоугольника 1

(а)

Вкладки внешний вид (а) и координаты (б) окна параметров рельефного прямоугольника 2

(б)

Рис. 126. Вкладки «внешний вид» (а) и «координаты» (б) окна параметров рельефного прямоугольника

Цвета и размеры рельефного прямоугольника не могут быть связаны с переменными блока, поэтому вкладка «связи» окна его параметров содержит только поле ввода для идентификатора элемента (на рисунке не приводится).


<< >> Оглавление Указатель