Google Git
Sign in
apache / netbeans-website-cleanup / refs/heads/asciidoc-features / . / src / content / platform / tutorials / 60 / nbm-visual_library_ru.html
blob: ae7d778ea4a4f28377d29ad080998b41fd1e7f3a [file] [log] [blame]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- -*- xhtml -*- -->
<title>Руководство по работе с Visual Library на платформе NetBeans 6.0</title>
<link rel="stylesheet" type="text/css" href="../../../netbeans.css">
<meta name="AUDIENCE" content="NBUSER">
<meta name="TYPE" content="ARTICLE">
<meta name="EXPIRES" content="N">
<meta name="developer" content="geertjan.wielenga@sun.com">
<meta name="indexed" content="y">
<meta name="description"
content="A walk-through of the basic features of the Visual Library API.">
<!-- Copyright (c) 2006 Sun Microsystems, Inc. All rights reserved. -->
<!-- Use is subject to license terms.-->
</head>
<body>
<h1>Руководство по работе с Visual Library в среде NetBeans </h1>
<p>Это руководство посвящено работе с основными возможностями, предусмотренными в интерфейсе API для Visual Library в среде NetBeans. Интерфейс API для Visual Library &ndash; это интерфейс визуализации, который удобно использовать в контексте, например, моделирования и построения графов.
</p><p><b>Содержание</b></p>
<img src="../../images/articles/60/netbeans-stamp60-61.gif" class="stamp" width="114" height="114" alt="Содержимое на этой странице относится к среде IDE NetBeans 6.1" title="Содержимое на этой странице относится к среде IDE NetBeans 6.1"> </p>
<ul class="toc">
<li><a href="#getting-started">Настройка модуля</a>
</li><li><a href="#creating-the-scene">Создание рабочего пространства</a>
</li><li><a href="#creating-a-palette">Создание палитры элементов для рабочего пространства</a>
</li><li><a href="#adding-a-layer-widget">Добавление элемента &quot;LayerWidget&quot;</a>
</li><li><a href="#adding-an-icon-widget">Добавление элемента &quot;IconNodeWidget&quot; с функциональностью перетаскивания</a>
</li><li><a href="#adding-to-scene">Добавление функциональности в рабочее пространство</a>
</li><li><a href="#adding-to-widget">Добавление функциональности к элементу &quot;IconNodeWidget&quot;</a>
</li></ul>
<p><b>Для работы с этим руководством требуется программное обеспечение и ресурсы, перечисленные в следующей таблице. </b></p>
<table>
<tbody>
<tr>
<th class="tblheader" scope="col">Программное обеспечение или ресурс</th>
<th class="tblheader" scope="col">Требуемая версия</th>
</tr>
<tr>
<td class="tbltd1">Среда IDE NetBeans</td>
<td class="tbltd1">версия <a href="http://download.netbeans.org/netbeans/6.1/final/">версия 6.1</a> или<br>
версия 6.0</td>
</tr>
<tr>
<td class="tbltd1">Комплект для разработчика на языке Java (JDK)</td>
<td class="tbltd1"><a href="http://java.sun.com/javase/downloads/index.jsp">версия 6</a> или<br>
версия 5</td>
</tr>
</tbody>
</table>
<p class="tips">Дополнительно, в целях поиска и устранения ошибок, можно <a href="http://plugins.netbeans.org/PluginPortal/faces/PluginDetailPage.jsp?pluginid=2701">загрузить готовые примеры</a> и изучить исходный код.
</p><p>В этом руководстве также будут использоваться 3 значка. Здесь можно щелкнуть каждый из них правой кнопкой мыши и сохранить его локально, либо скопировать в местоположение проекта модуля после его создания в соответствии с указаниями, приведенными в данном руководстве. Это следующие значки:
</p><p><img border="1" src="../../images/tutorials/vislib/image1.png"/>
<img border="1" src="../../images/tutorials/vislib/image2.png"/>
<img border="1" src="../../images/tutorials/vislib/image3.png"/>
</p><p>Вся информация, которая потребуется для работы с интерфейсом API для Visual Library, собрана в следующих двух источниках:
</p><ul>
<li><a href="http://graph.netbeans.org/">Страница проекта Visual Library</a>
</li><li><a href="http://graph.netbeans.org/documentation.html">Документация по Visual Library 2.0</a>
</li></ul>
<p>Также см. <a href="http://www.javalobby.org/eps/netbeans_visual_library/">демонстрацию по Visual Library, подготовленную Романом Штроблем (Roman Strobl),</a> на сайте Javalobby.
<!-- ===================================================================================== -->
</p><p></p><h2><a name="getting-started"></a>Настройка модуля</h2>
<p>В этом разделе демонстрируется использование программ-мастеров для создания проекта модуля и собственного оконного элемента.
</p><ol>
<li>Выберите &quot;File &gt; New Project&quot;. В мастере создания проекта выберите &quot;NetBeans Modules&quot; в области &quot;Categories&quot; и &quot;Module&quot; в области &quot;Projects&quot;. Нажмите кнопку &quot;Next&quot;. Введите <tt>ShapeSample</tt> в поле &quot;Project Name&quot; и укажите соответствующую папку на диске в поле &quot;Project Location&quot;. Выберите &quot;Standalone Module&quot; и &quot;Set as Main Project&quot;, если эти параметры не выбраны. Нажмите кнопку &quot;Next&quot;.
<p></p></li><li>Введите <tt>org.netbeans.shapesample</tt> в поле &quot;Code Name Base&quot; и <tt>Shape Sample</tt> в поле &quot;Module Display Name&quot;. Нажмите кнопку &quot;Finish&quot;.
<p></p></li><li>Щелкните проект правой кнопкой мыши, выберите &quot;Properties&quot;, щелкните &quot;Libraries&quot; в диалоговом окне &quot;Project Properties&quot; и установите зависимость от следующих интерфейсов API:
<p></p><ul>
<li>Visual Library API
</li><li>Utilities API
</li></ul>
<p>Нажмите кнопку &quot;OK&quot;.
</p><p></p></li><li>Щелкните проект модуля правой кнопкой мыши, выберите &quot;New &gt; File/Folder&quot;, затем выберите &quot;Window Component&quot; из категории &quot;NetBeans Module Development&quot;. Нажмите кнопку &quot;Next&quot;. Выберите <tt>editor</tt> в раскрывающемся списке и затем выберите &quot;Open on Application Start&quot;. Нажмите кнопку &quot;Next&quot;.
<p></p></li><li>Введите <tt>Shape</tt> в поле &quot;Class Name Prefix&quot;. При необходимости можно добавить значок размером 16x16 пикселей. Нажмите кнопку &quot;Finish&quot;.</p>
<p>Создается несколько файлов, один из которых &ndash; <tt>ShapeTopComponent</tt>. Откройте этот файл в режиме проектирования. Экран должен выглядеть следующим образом:
</p><p><img border="1" src="../../images/tutorials/vislib/shapetopcomponent.png"/>
</p><p></p></li><li>Щелкните правой кнопкой мыши элемент &quot;TopComponent&quot; в режиме проектирования, выберите &quot;Set Layout&quot; и затем выберите &quot;BorderLayout&quot;.
</li></ol>
<p></p><h2><a name="creating-the-scene"></a>Создание рабочего пространства</h2>
<p>Программирование с использованием интерфейса API для Visual Library аналогично программированию в Swing. При этом составляется и изменяется дерево визуальных элементов, именуемых элементами оформления окон (widgets). Корень дерева представлен классом &quot;Scene&quot;, содержащим все визуальные характеристики рабочего пространства. Само рабочее пространство также представляет собой элемент оформления окон. Необходимо создать представление рабочего пространства, которое является элементом &quot;JComponent&quot;. Затем следует добавить &quot;JComponent&quot; к элементу &quot;JScrollPane&quot;.
</p><p>В этом разделе представлена процедура добавления элемента &quot;JScrollPane&quot; к &quot;TopComponent&quot;. Затем создается новое рабочее пространство. Представление рабочего пространства передается в элемент &quot;TopComponent&quot;, что позволяет вывести его в элементе &quot;JScrollPane&quot; элемента &quot;TopComponent&quot;. После этого осуществляется установка проекта модуля и вывод на экран первого рабочего пространства.</p>
<ol>
<li>При помощи окна &quot;Palette&quot; (Ctrl-Shift-8) перетащите <tt>JScrollPane</tt> к элементу &quot;TopComponent&quot;. В окне &quot;Inspector&quot; щелкните правой кнопкой мыши <tt>JScrollPane</tt>, выберите &quot;Change Variable Name&quot; и введите <tt>shapePane</tt>.
<p></p></li><li>В пакете <tt>org.netbeans.shapesample</tt> создайте класс Java с именем <tt>GraphSceneImpl</tt>. Этот класс должен расширять <tt>GraphScene</tt>.</p>
<p>Появляется красное подчеркивание, указывающее на ошибку, и изображение лампочки. Подтвердите создание оператора импорта средой IDE.
</p><p>Снова появляется красное подчеркивание, указывающее на ошибку, и изображение лампочки. Подтвердите создание абстрактных методов класса средой IDE.
</p><p></p></li><li>Создайте фиктивную реализацию класса путем добавления значимых идентификаторов и настройки возврата <tt>null</tt> там, где это необходимо, для удовлетворения всех требований класса:
<pre class="examplecode">public class GraphSceneImpl extends GraphScene {
public GraphSceneImpl() {
}
protected Widget attachNodeWidget(Object node) {
return null;
}
protected Widget attachEdgeWidget(Object edge) {
return null;
}
protected void attachEdgeSourceAnchor(Object edge, Object oldSourceNode, Object newSourceNode) {
}
protected void attachEdgeTargetAnchor(Object edge, Object oldTargetNode, Object newTargetNode) {
}
}</pre>
<p></p></li><li>Теперь вставьте в конструктор элемента &quot;TopComponent&quot; экземпляр класса <tt>GraphSceneImpl</tt>. Для этого добавьте в конец конструктора класса <tt>ShapeTopComponent</tt> следующее:
<pre class="examplecode">GraphSceneImpl scene = new GraphSceneImpl();
myView = scene.createView();
shapePane.setViewportView(myView);
add(scene.createSatelliteView(), BorderLayout.WEST);</pre>
<p>Обратите внимание, что создается два представления. Первое &ndash; это развернутое представление для визуализации графов, моделей и т.д. Второе &ndash; вспомогательное представление с левой стороны элемента &quot;TopComponent&quot;. Наличие двух представлений позволит пользователю быстро перемещаться по основному представлению с одновременным обзором всего рабочего пространства.</p>
<p>Объявите представление &quot;JComponent&quot;:
</p><pre class="examplecode">private JComponent myView;</pre>
<p></p></li><li>Обеспечивать сохранение состояния элемента &quot;TopComponent&quot; при перезапуске среды IDE не требуется. Напротив, в нашем случае это будет ошибкой. Поэтому замените PERSISTENCE_ALWAYS на PERSISTENCE_NEVER, как показано ниже:
<pre class="examplecode">public int getPersistenceType() {
return TopComponent.PERSISTENCE_NEVER;
}</pre>
<p></p></li><li>Щелкните правой кнопкой мыши узел проекта и выберите &quot;Install/Reload in Development IDE&quot;. Если появляется предупреждающее сообщение, нажмите кнопку &quot;OK&quot;.</p>
<p>В процессе установки модуля в списке пунктов меню &quot;Window&quot; появляется новый пункт &quot;Shape&quot;. При выборе этого пункта запускается подготовленная реализация интерфейса API для Visual Library:
</p><p><img border="1" src="../../images/tutorials/vislib/firstscene.png"/>
</p></li>
<!-- ===================================================================================== -->
<p></p><h2><a name="creating-a-palette"></a>Создание палитры элементов для рабочего пространства</h2>
<p>Для практического применения интерфейса API для Visual Library будет реализован <a href="https://netbeans.org/download/dev/javadoc/org-netbeans-spi-palette/overview-summary.html">интерфейс API &quot;Palette&quot;</a>, что позволит создать палитру элементов с фигурами, показанными в начале данного руководства. Затем добавим функциональность перетаскивания, предусмотренную в интерфейсе API для Visual Library, при помощи которой можно будет размещать фигуры в рабочем пространстве путем перетаскивания. После этого расширим рабочее пространство путем добавления дополнительных возможностей, например, масштабирования и перемещения по рабочему пространству.
</p><ol>
<li>Поскольку это руководство посвящено интерфейсу API для Visual Library, а не интерфейсу &quot;Palette&quot;, подробное описание принципов работы последнего здесь не приводится. По этой теме существует достаточно много других руководств (<a href="https://netbeans.org/kb/trails/platform.html">например, здесь</a>). Поэтому просто скопируйте и вставьте в новый пакет с именем <tt>org.netbeans.shapesample.palette</tt> следующие файлы:
<ul>
<li><a href="../../images/tutorials/vislib/Category.java">Category.java</a>
</li><li><a href="../../images/tutorials/vislib/CategoryChildren.java">CategoryChildren.java</a>
</li><li><a href="../../images/tutorials/vislib/CategoryNode.java">CategoryNode.java</a>
</li><li><a href="../../images/tutorials/vislib/PaletteSupport.java">PaletteSupport.java</a>
</li><li><a href="../../images/tutorials/vislib/Shape.java">Shape.java</a>
</li><li><a href="../../images/tutorials/vislib/ShapeChildren.java">ShapeChildren.java</a>
</li><li><a href="../../images/tutorials/vislib/ShapeNode.java">ShapeNode.java</a>
</li></ul>
<p></p></li><li>Добавьте зависимости от интерфейсов API Actions, Nodes и Common Palette аналогично способу, описанному в действии 3 раздела &quot;Начало работы&quot;.</p>
<p></p></li><li>Затем добавьте палитру к элементу &quot;Lookup&quot; элемента &quot;TopComponent&quot; путем вставки следующей строки в конец конструктора &quot;TopComponent&quot;:
<pre class="examplecode">associateLookup( Lookups.fixed( new Object[] { PaletteSupport.createPalette() } ) );</pre>
<p></p></li><li>Среда IDE предложит вставить операторы импорта для <tt>org.openide.util.lookup.Lookups</tt> и <tt>org.netbeans.shapesample.palette.PaletteSupport</tt>. Подтвердите предложение, после чего средой IDE будут автоматически созданы операторы импорта.
<p></p></li><li>Поместите изображения, приведенные в начале этого руководства, в пакет <tt>org.netbeans.shapesample.palette</tt>.</p>
<p>Окно &quot;Projects&quot; теперь должно выглядеть следующим образом:</p>
<p><img border="1" src="../../images/tutorials/vislib/proj-window.png"/>
</p><p></p></li><li>Установите модуль еще раз. При вызове элемента &quot;TopComponent&quot; при помощи соответствующего пункта меню справа от рабочего пространства отображается палитра элементов:</p>
<p><img border="1" src="../../images/tutorials/vislib/firstpalette.png"/>
</p></li>
<!-- ===================================================================================== -->
<p></p><h2><a name="adding-a-layer-widget"></a>Добавление элемента &quot;LayerWidget&quot;</h2>
<p>Элемент <a href="http://graph.netbeans.org/documentation.html#LayerWidget">LayerWidget</a> представляет собой &quot;прозрачный слой&quot; (glasspane), похожий на элемент &quot;JGlassPane&quot; в Swing. Этот элемент прозрачен по умолчанию. Прежде, чем двигаться дальше, добавим элемент &quot;LayerWidget&quot; к рабочему пространству, что позволит в дальнейшем размешать видимые элементы оформления окон путем их перетаскивания в это пространство.
</p><ol><li>Объявите элемент &quot;LayerWidget&quot; в классе <tt>GraphSceneImpl</tt>:
<pre class="examplecode">private LayerWidget mainLayer;</pre>
<p></p></li><li>В конструкторе класса <tt>GraphSceneImpl</tt> добавьте элемент &quot;LayerWidget&quot; как подчиненный элемент рабочего пространства:
<pre class="examplecode">mainLayer = new LayerWidget (this);
addChild (mainLayer);</pre></li></ol>
<p>Теперь при перетаскивании элементов из палитры в рабочее пространство в качестве элементов оформления окон они будут добавляться как подчиненные элементу &quot;LayerWidget&quot;. Поскольку элементы &quot;LayerWidget&quot; по умолчанию являются прозрачными, можно добавить множество таких элементов, один над другим, и таким образом вставить в рабочее пространство, например, фоновое изображение.
</p><p>Для получения более подробной информации см. описание элемента <a href="http://graph.netbeans.org/documentation.html#LayerWidget">LayerWidget</a> в документации Javadoc.
<!-- ===================================================================================== -->
</p><p></p><h2><a name="adding-an-icon-widget"></a>Добавление элемента &quot;IconNodeWidget&quot; с функциональностью перетаскивания</h2>
<p>Ранее конструктор класса <tt>GraphSceneImpl</tt> использовался для передачи рабочего пространства в элемент &quot;JScrollPane&quot; элемента &quot;TopComponent&quot;. Рабочее пространство существует, однако для него еще не настроено поведение. Для настройки поведения нами будут использоваться действия. В этом разделе будет рассмотрено действие <tt><a href="http://graph.netbeans.org/documentation.html#AcceptAction">AcceptAction</a></tt>. Это действие предоставляет функциональность перетаскивания. Функциональность перетаскивания может применяться в отношении элемента оформления окон, однако в нашем случае она будет применена к самому рабочему пространству.
</p><p>Для определения того, что должно происходить при перетаскивании элемента из палитры в пределах рабочего пространства, будет использоваться действие <tt>createAcceptAction</tt>. Здесь задействованы два метода. Первый метод &ndash; <tt>isAcceptable()</tt> &ndash; позволяет определить приемлемость элемента для рабочего пространства. Таким образом можно протестировать перемещаемый элемент. Также можно определить изображение, которое будет появляться при перетаскивании. Это демонстрируется в примере ниже. Если возвращается <tt>true</tt>, вызывается метод <tt>accept</tt>. Получение изображения от перемещаемого элемента производится с использованием того же вспомогательного метода, что и ранее. Затем вызывается метод <tt>addNode</tt>, создающий новый экземпляр <a href="http://graph.netbeans.org/documentation.html#IconNodeWidget">IconNodeWidget</a> и передающий изображение, полученное от перемещаемого элемента.
</p><p>Весь код в этом разделе взаимосвязан, и пока не будут добавлены все названные ниже методы, в коде будут появляться ошибки, обозначенные красным подчеркиванием. Тем не менее, мы попробуем добавить все методы в некоторой логической последовательности.
</p><ol>
<li>Прежде всего, добавьте к конструктору класса <tt>GraphSceneImpl</tt> <tt>createAcceptAction</tt> и два связанных метода:
<pre class="examplecode">getActions().addAction(ActionFactory.createAcceptAction(new AcceptProvider() {
public ConnectorState isAcceptable(Widget widget, Point point, Transferable transferable) {
Image dragImage = getImageFromTransferable(transferable);
JComponent view = getView();
Graphics2D g2 = (Graphics2D) view.getGraphics();
Rectangle visRect = view.getVisibleRect();
view.paintImmediately(visRect.x, visRect.y, visRect.width, visRect.height);
g2.drawImage(dragImage,
AffineTransform.getTranslateInstance(point.getLocation().getX(),
point.getLocation().getY()),
null);
return ConnectorState.ACCEPT;
}
public void accept(Widget widget, Point point, Transferable transferable) {
Image image = getImageFromTransferable(transferable);
Widget w = GraphSceneImpl.this.addNode(new MyNode(image));
w.setPreferredLocation(widget.convertLocalToScene(point));
}
}));</pre>
<p><b>Примечание:</b> После добавления вышеприведенного кода некоторые красные подчеркивания не исчезнут, свидетельствуя о наличии ошибки. Причина появления ошибок состоит в том, что этот код содержит ссылки на метод и класс, которые еще не созданы. Они будут созданы на одном из следующих этапов.
</p><p></p></li><li>Затем в классе <tt>GraphSceneImpl</tt> добавьте вспомогательный метод для получения изображения из перемещаемого элемента:
<pre class="examplecode">private Image getImageFromTransferable(Transferable transferable) {
Object o = null;
try {
o = transferable.getTransferData(DataFlavor.imageFlavor);
} catch (IOException ex) {
ex.printStackTrace();
} catch (UnsupportedFlavorException ex) {
ex.printStackTrace();
}
return o instanceof Image ? (Image) o : Utilities.loadImage(&quot;org/netbeans/shapesample/palette/shape1.png&quot;);
}</pre>
<p>Обратите внимание, что можно указать любое произвольное изображение на случай, если вспомогательный метод не возвращает какое-либо изображение. В примере для этого будет использоваться изображение &quot;<tt>shape1.png</tt>&quot;.</p>
<p></p></li><li>Создайте новый класс с именем <tt>MyNode</tt>. Этот класс представляет узел в графо-ориентированной модели. Он не может быть непосредственно изображением, так как каждый узел в модели должен быть уникальным (это проверяется методом &quot;equals&quot;). Если бы использовались непосредственно изображения, то можно было бы получить только 3 узла в рабочем пространстве (по одному для каждого изображения). При помощи класса &quot;MyNode&quot; можно получить несколько узлов, каждый из которых может иметь свой собственный или совместно используемый экземпляр изображения.
<pre class="examplecode">public class MyNode {
private Image image;
public MyNode(Image image) {
this.image = image;
}
public Image getImage() {
return image;
}
}</pre>
<p></p></li><li>Измените подпись класса <tt>GraphSceneImpl</tt>, как показано ниже, для получения узла классом реализации &quot;Visual Library&quot;:</li>
<pre class="examplecode">extends GraphScene&lt;MyNode, String&gt;</pre>
<p>Подтвердите автоматическое создание средой IDE новых заглушек для абстрактных методов.
</p><p>Кроме того, поскольку в нашем примере используются общие объекты, в среде IDE должен присутствовать инструментарий JDK 1.5. Если точная версия неизвестна, щелкните правой кнопкой мыши проект, выберите &quot;Properties&quot; и перейдите на страницу &quot;Sources&quot;. В раскрывающемся списке &quot;Source Level&quot; выберите &quot;1.5&quot;.
</p><p></p><li>Наконец, определите новый элемент оформления окон в классе <tt>GraphSceneImpl</tt>. Этот метод автоматически вызывается методом <tt>accept</tt>. Он используется для определения элемента оформления окон Visual Library при перетаскивании элемента палитры.
<pre class="examplecode">protected Widget attachNodeWidget(MyNode node) {
IconNodeWidget widget = new IconNodeWidget(this);
widget.setImage(node.getImage());
widget.setLabel(Long.toString(node.hashCode()));
widget.getActions().addAction(ActionFactory.createMoveAction());
mainLayer.addChild(widget);
return widget;
}</pre>
<p>Обратите внимание на установку изображения, получаемого от узла. В качестве идентифицирующей метки будет использоваться генерируемое случайное число. По умолчанию элемент оформления окон существует, но его поведение не определено. Для получения возможности перемещения элемента оформления окон в рабочем пространстве необходимо создать действие по перемещению. Перед возвратом элемента оформления окон в рабочее пространство его следует добавить в качестве подчиненного элементу &quot;LayerWidget&quot;, который был создан в предыдущем разделе.</p>
<p></p></li><li>Перезагрузите модуль и снова откройте окно &quot;Shape&quot;.</p>
<p>Теперь имеется возможность перетаскивания элементов из палитры. При перемещении элемента в рабочем пространстве отображается изображение, которое было определено как изображение при перетаскивании. По завершении перемещения оно заменяется элементом оформления окон, отображаемым в рабочем пространстве, а также во вспомогательном представлении, как показано на следующем рисунке:
</p><p><img border="1" src="../../images/tutorials/vislib/finishedscene.png"/></p>
</li></ol>
<!-- ===================================================================================== -->
<p></p><h2><a name="adding-to-scene"></a>Добавление функциональности в рабочее пространство</h2>
<p>В предыдущем разделе мы добавили к рабочему пространству <tt><a href="http://graph.netbeans.org/documentation.html#AcceptAction">AcceptAction</a></tt>. Необходимо было определить два метода, которые проверяли возможность перетаскивания элемента и способ его обработки. В этом разделе при помощи <tt><a href="http://graph.netbeans.org/documentation.html#ZoomAction">ZoomAction</a></tt> к рабочему пространству будет добавлена функциональность для изменения масштаба.
</p><ol>
<li>Добавьте следующую строку в конструктор класса <tt>GraphSceneImpl</tt>:
<pre class="examplecode">getActions().addAction(ActionFactory.createZoomAction());</pre>
<p></p></li><li>Установите модуль еще раз.
<p></p></li><li>Удерживая нажатой клавишу CTRL, попробуйте изменить масштаб в рабочем пространстве при помощи колеса мыши:</p>
<p><img border="1" src="../../images/tutorials/vislib/zoom.png"/></p>
<p><img border="1" src="../../images/tutorials/vislib/unzoom.png"/></p>
</li></ol>
<p><b>Примечание:</b> Фигуры визуализируются как изображения. SVG в настоящее время не поддерживается.
</p><p>Как и ранее, для добавления возможности перемещения по рабочему пространству вставьте следующую строку:
</p><pre class="examplecode">getActions().addAction(ActionFactory.createPanAction());</pre>
<p>После добавления этой строки пользователь сможет перемещаться по рабочему пространству в любом направлении путем нажатия и поворота колеса мыши.
<!-- ===================================================================================== -->
</p><p></p><h2><a name="adding-to-widget"></a>Добавление функциональности к элементу &quot;IconNodeWidget&quot;</h2>
<p>Ранее для добавления возможности перемещения элемента оформления окон &quot;IconNodeWidget&quot; к нему было добавлено действие <tt><a href="http://graph.netbeans.org/documentation.html#MoveAction">MoveAction</a></tt>. Аналогичным образом для этого элемента оформления окон можно настроить и другие возможности поведения. В этом разделе мы добавим действия <tt><a href="http://graph.netbeans.org/documentation.html#HoverAction">HoverAction</a></tt>, <tt><a href="http://graph.netbeans.org/documentation.html#SelectAction">SelectAction</a></tt> и <tt><a href="http://graph.netbeans.org/documentation.html#InplaceEditorAction">InplaceEditorAction</a></tt>.
</p><p>Действие <tt>InplaceEditorAction</tt> позволит пользователю изменять подпись (метку) элемента:
</p><p><img border="1" src="../../images/tutorials/vislib/editable.png"/></p>
<p>Действие <tt>SelectAction</tt> используется для изменения цвета подписи при выделении элемента оформления окон, а действие <tt>HoverAction</tt> изменяет цвет подписи при наведении на элемент указателя мыши:
</p><p><img border="1" src="../../images/tutorials/vislib/selectable-hoverable.png"/></p>
<ol>
<p></p><li>Сначала определим действие &quot;Editor&quot;, которое будет добавлено к элементу &quot;IconNodeWidget&quot;:
<pre class="examplecode">private WidgetAction editorAction = ActionFactory.createInplaceEditorAction(new LabelTextFieldEditor());</pre>
<p></p></li><li>Затем определим <tt>LabelTextFieldEditor</tt>:
<pre class="examplecode">private class LabelTextFieldEditor implements TextFieldInplaceEditor {
public boolean isEnabled(Widget widget) {
return true;
}
public String getText(Widget widget) {
return ((LabelWidget) widget).getLabel();
}
public void setText(Widget widget, String text) {
((LabelWidget) widget).setLabel(text);
}
}</pre>
<p></p></li><li>Наконец, присвоим действие &quot;Editor&quot; элементу &quot;IconNodeWidget&quot; способом, аналогичным вышеописанной настройке действия &quot;Move&quot;:
<pre class="examplecode">widget.getLabelWidget().getActions().addAction(editorAction);</pre>
<p>Здесь сначала получаем элемент &quot;LabelWidget&quot; элемента оформления окон &quot;IconNodeWidget&quot;. Затем к &quot;LabelWidget&quot; добавляется действие &quot;Editor&quot;.</p>
<p></p></li><li>Среда IDE предложит добавить несколько операторов импорта. В каждом случае следует подтвердить предложенный средой IDE оператор.
<p></p></li><li>Затем, в случаях <tt>SelectAction</tt> и <tt>HoverAction</tt>, потребуется лишь присвоить эти действия элементу &quot;IconNodeWidget&quot;:
<pre class="examplecode">widget.getActions().addAction(createSelectAction());
widget.getActions().addAction(createObjectHoverAction());</pre>
<p></p></li><li>Теперь необходимо определить порядок выполнения созданных действий. Для получения более подробной информации см. раздел <a href="http://graph.netbeans.org/documentation.html#OrderOfActions">Определение порядка действий</a> в документации. После изменения порядка действий код <tt>attachNodeWidget</tt> должен выглядеть следующим образом:
<pre class="examplecode">protected Widget attachNodeWidget(MyNode node) {
IconNodeWidget widget = new IconNodeWidget(this);
widget.setImage(node.getImage());
widget.setLabel(Long.toString(node.hashCode()));
//Двойной щелчок, событие используется только при двойном щелчке:
widget.getLabelWidget().getActions().addAction(editorAction);
//Однократный щелчок, событие не используется:
widget.getActions().addAction(createSelectAction());
//Перетаскивание мышью, событие используется во время перемещения указателя мыши:
widget.getActions().addAction(ActionFactory.createMoveAction());
//Наведение мыши; событие используется при перемещении указателя мыши по элементу оформления окон :
widget.getActions().addAction(createObjectHoverAction());
mainLayer.addChild(widget);
return widget;
}</pre>
<p></p></li><li>Установите и снова протестируйте модуль. Как было показано в начале этого раздела, при наведении указателя мыши на подпись к элементу оформления окон или при выделении этого элемента его цвет изменяется. Кроме того, после щелчка подписи ее текст можно изменить.
</li></ol>
<p>Поздравляем! Руководство по работе с Visual Library 2.0 в среде NetBeans 6.0 завершено.</p>
<br>
<div class="feedback-box"><a href="https://netbeans.org/about/contact_form.html?to=3&amp;subject=Feedback:%20Visual%20Library%20API%20Tutorial%20NetBeans%206.0">Мы ждем ваших отзывов</a></div>
<br style="clear:both;" />
<a name="next_steps"></a><h2>Что дальше?</h2>
<p>Для получения дополнительной информации о работе с интерфейсом API для &quot;Visual Library&quot; см.:</p>
<ul>
<li><a href="http://www.javalobby.org/eps/netbeans_visual_library/">Демонстрация по Visual Library, подготовленная Романом Штроблем (Roman Strobl),</a> на сайте Javalobby.
</li><li><a href="http://graph.netbeans.org/">Страница проекта Visual Library</a>
</li><li><a href="http://graph.netbeans.org/documentation.html">Документация по Visual Library 2.0</a>
</li></ul>
</ol></ol></body>
</html>