СЛОИ
 

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

В слой могут входить элементы следующих типов:

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

Описание слоев

Список слоев, с которыми будет работать апплет, может быть задан статически, при описании  параметров апплета, или динамически с использованием JavaScript. При статическом задании параметров апплета в HTML коде используется тег <param>.Значение  ключевого параметра  name должно быть равно layers_all, а в ключевом параметре value - перечислены имена слоев <layer_name>. Далее,  для того чтобы апплет создал изображение необходимо задать множество отображаемых слоев. Для этого используется параметр апплета layers_draw, а в качестве значения этого параметра указывается список имен отображаемых слоев. Синтаксис описания списка слоев тот же, что и синтаксис описания списка элементов группы. Отображение слоев происходит в том порядке, в котором они заданы при описании множества отображаемых слоев.

Пример задания списка слоев и порядка их отображения 
<param name=layers_all  value="layer1 layer2 ... layerN">
<param name=layers_draw value="#layer1 #layer2 ... #layerN" >

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

Более подробную информацию о задании параметров апплета можно посмотреть в разделах: "Статическое задание параметров апплета"  и "Динамическое задание параметров апплета из JavaScript".

Атрибуты слоя

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

  • общие параметры слоя  (например,  имя группы, в которую включается этот слой; признаки "активности" и "видимости" элементов слоя; параметры для динамического изменения некоторых атрибутов элементов слоя и другие атрибуты);
  • параметры управляющие отображением постоянно "видимых" элементов слоя и текстовой информации (например, цвет, толщина и стиль границ элемента; цвет заливки, штриховка; имя, стиль и размер шрифта;  расстояние между строками, словами, отступы и т.д. );
  • параметры управляющие отображением "активных" элементов слоя (цвет границ и заливки элемента, время отображения активного элемента, отображение текстовой подсказки, ее цвета, фона, расположения и т.д.)
  • Пример задание атрибутов для слоя layer1 (задается цвет границ)
    <param name=layer1 value=" draw_layer=0xd0 border_color_layer=#F0E68C">

    Описание всех параметров слоя и его атрибутов можно посмотреть в разделе "Приложение 1. Атрибуты слоя и его элементов".

    Описание элементов слоя

    Элементы слоя задаются с помощью параметров апплета, имена  которых образуется по шаблону  <layer_name>_object_<num>, где  <layer_name> - имя слоя, <num> - номер элемента слоя.  В атрибуте value  задается описание элемента слоя и его индивидуальные атрибуты отображения.

    Пример задания первого элемента слоя layer1
    <param name=layer1_object_0 value="описание элемента слоя">

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

    Создание слоя с именем layer1, который состоит из двух элементов.
    add_layer( "layer1","описание атрибутов этого слоя" )
    set_layer_element_num(0, "object", "описание первого элемента слоя");
    set_layer_element_num(1, "object", "описание второго элемента слоя");
    Добавление 5-го элемента в слой с именем layer1 
    (если элемент с таким номером существует, то происходит его замена)
    set_current_layer("layer1");
    set_layer_element_num(5, "object", "описание элемента слоя");

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

    Однако имеется ряд атрибутов, не зависящих от типа элемента слоя или метода его формирования. С помощью них задаются и некоторые одинаковые для элементов различного типа свойства и атрибуты отображения, такие как идентификатор элемента слоя, индивидуальный цвет элемета слоя, индивидуальные параметры штриховки и другие (см."Общие ключевые параметры для отдельных элементов слоя" <common key params>).

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

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

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

    Таким образом, описание элемента слоя состоит из трех частей <тип описания> <параметры, специфичные для типа описания> [<параметры, не зависящие от типа описания>].

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

    Синтаксис задания элементов слоя
    Ломанная линия
    line x0 y0 ... xn yn [<common key params>]  
    Координаты вершин ломанной линии (x0,y0),...(xn,yn).
    iline x0 y0 dx1 dy1 ... xn yn  [<common key params>] 
    Координаты первой вершины ломанной линии (x0,y0). Последовательность 
    приращений координат для остальных вершин - (dx1,dy1) ... (dxn, dyn).
    Прямоугольник
    rect x y width height [<common key params>]
    Координаты левой верхней вершины (x,y) и размеры по ширине и 
    высоте (width height).
    rectc Xul Yul Xdr Ydr  [<common key params>]
    Координаты левой верхней вершины (Xul, Yul), координаты правой 
    нижней вершины (Xdr, Ydr).
    Полигон (многоугольник)
    poly x0 y0 ... xn yn [<common key params>]
    Координаты вершин полигона (x0,y0),...(xn,yn).
    ipoly x0 y0 dx1 dy1 ... dxn dyn [<common key params>]
    Координаты первой вершины полигона (x0,y0). Последовательность 
    приращений координат для остальных вершин - (dx1,dy1) ... (dxn, dyn).
    lpoly llayer0 n00 ... nn0 ... llayerm nm0 ... nnm  [<common key params>]
    Последовательностью линий, составляющих границы полигона. 
    Задаются не координаты линий, а ссылки на линии, являющиеся 
    элементами других слоев (<имя слоя> <номера элементов слоя>).
    Сектор элипса
    arc pos_b x y width height start_angle arc_angle [<common key params>]
    Координаты левой верхней вершины (x,y) и размеры по ширине и 
    высоте (width,height) прямоугольника, описанного вокруг элипса, а 
    также начальный  угол и угол разворота сектора.
    Изображение
    image file [pos_b x y pos=p width=w height=h draw_rect=x,y,width,height 
    image_rect=x,y,width,height image_size=width,height load=<yes/no>] 
    [<common key params>]
    Имя растрового изображения, координаты прямоугольника-окна и 
    прямоугольника изображения, задающие выбранный фрагмент 
    растрового изображения и его расположение.
    Текст в прямоугольнике
    text [pos_b x y pos=p width=w height=h hlines=hl 
    draw_rect=x,y,width,height scroll=x,y shifts=sx,sy] 
    font=font_name:font_size,font_style value=""/''/%% [<common key params>]
    Много строчный текст value, шрифт font, координаты прямоугольника окна и 
    прямоугольника текста, и ряд других парамтеров, задающие видимый 
    фрагмент текста и его расположение.
    Текст вдоль динии
    pltext [step=sw shifts=sx,sy] value=""/''/%% line=line_coords |iline=iline_coords |
     link=layer:number font=font_name:font_size,font_style[<common key params>]
    Текстовая строка, шрифт, координаты ломанной линии, вдоль 
    которой размещается текстовая строка.
    Ссылка  на элемент другого слоя
    link layer number 
    Имя слоя layer и номер элемента в этом слое number.
    Копия элемента другого слоя
    copy layer number [ <common key params>]
    Имя слоя layer и номер элемента в этом слое number.
    Пример задания различных типов элементов слоя

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

    Задание атрибутов для слоя layer1
    <param name=layer1 ...>
    Ломанная линии - координат вершин (10,10) (20,10) (30,30) (40,10)
    <param name=layer1_object_0 value="line  10 10 20 10 30 30 40 10">
    <param name=layer1_object_1 value="iline 10 10 10 0 10 20 10 -20">
    Прямоугольник - левая верхняя вершина (10,10), ширина и высота 100
    <param name=layer1_object_2 value="rect  10 10 100 100">
    <param name=layer1_object_3 value="rectc 10 10 110 110">
    Полигон - координаты вершин (43,221);(119,34);
    (196 221);(17 102);(221 102),
    (многоугольник в виде звезды)
    <param name=layer1_object_4 value=
                 "poly 43 221 119 34 196 221 17 102 221 102 43 221">
    <param name=layer1_object_5 value=
                 "ipoly 43 221 76 -187 77 187 -179 -119 204 0 -178 119">
    Тот же полигон, заданный последовательностью линий, 
    которая заданна ссылками на линии из слоев 
    line1 (элементы 0,1,2) и line2 (элемент 0)
    <param name=layer1_object_6 value=
                 "lpoly line1 0 1 2 line2 0">
    Растровое изображение
    <param name=layer1_object_7 value="image FileName.gif">
    Текст - указаны фонт (Arial) и размер шрифта (14)
    <param name=layer1_object_8 value="text 0x45 10 20 font=Arial:14,0  
                                value='font:Arial размер символов=14px'"
    Текст, расположенный вдоль ломанной линии
    <param name=layer1_object_9 
          value="pltext value='Текст, расположенный вдоль линии' step=3
                 line=15,15,85,125,85,10,190,140,190,220,140,220">
    Задание атрибутов для слоя layer2
    <param name=layer2 ...>
    Ссылка на 4-й элемент слоя layer1
    <param name=layer2_object_0 value="link layer1 4" >
    Копирование 9-го элемента слоя layer1 и задание ему индивидуального
    цвета отображения
    <param name=layer2_object_1 value="copy layer1 9 color=#ff0000" >
    Задание атрибутов для слоя line1 и трех элементов (ломанная линия)
    и слоя line2 (один элемент)
    Эти элементы используются для метода lpoly
    <param name=line1 ...>
         <param name=line1_object_0 value="line 43 221 119 34">
         <param name=line1_object_1 value="line 119 34 196 221 17 102">
         <param name=line1_object_2 value="line 17 102 221 102"> 
    
       <param name=line2 ...>
         <param name=line2_object_0 value="line 221 102 43 221">
     

    В примере № 1 показаны элементы всех типов - прямоугольник, ломанная  линия, полигон, эллипс и сектор круга, текст и растровое изображение. Можно изменить значение параметра слоя draw_layer, который управляет отображением элементов слоя.
    Более подробные примеры,  демонстрирущие возможность апплета  выполнять штриховку элементов, можно посмотреть в разделе "Штриховка".

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

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

    В примере № 4 демонстрируется выделение элементов изображения при "наезжании" курсором (выделение активных объектов). Можно изменить значение следующих параметров

  • active - признак активности (чувствительности) элементов слоя к 
    положению курсора в зависимости от состояния клавиш Shift, Ctrl, Alt.
  • draw_active - признаки управляющие отображением активного элемента: 
    показ текста,  текстовой подсказки,  цвета и толщины границ,  заливки элемента и т.д.
  • cursor - слой, изображение которого появляется рядом с курсором, при его 
    движении над активным элементом.
  • Подробнее о задании и изменении параметров, управляющих положением и цветовым оформлением текстовой подсказке смотрите в разделе "Текстовая подсказка".

    На главную страницу
    Наверх