| <?php require_once($_SERVER['DOCUMENT_ROOT'] . "/eclipse.org-common/system/app.class.php"); require_once($_SERVER['DOCUMENT_ROOT'] . "/eclipse.org-common/system/nav.class.php"); require_once($_SERVER['DOCUMENT_ROOT'] . "/eclipse.org-common/system/menu.class.php"); $App = new App(); $Nav = new Nav(); $Menu = new Menu(); include($App->getProjectCommon()); # All on the same line to unclutter the user's desktop' |
| |
| $pageTitle = "Eclipse Graphical Editing Framework (GEF) Directed Graph Example (Digraph2)"; |
| $pageKeywords = "Eclipse Graphical Editing Framework (GEF) Directed Graph Example (Digraph2)"; |
| $pageAuthor = "Anthony Hunter, IBM Rational Software"; |
| |
| # Paste your HTML content between the EOHTML markers! |
| $html = <<<EOHTML |
| |
| <div id="midcolumn"> |
| |
| <STYLE type="text/css"> |
| TT { font-size : 100%; } |
| </STYLE> |
| |
| <h1>Graphical Editing Framework (GEF) Directed Graph Example (Digraph2)</h1> |
| |
| <h2>Getting the source for the example</h2> |
| |
| <p><a href="digraph2.psf"> |
| A team project set file for the digraph2 example is here</a>. |
| Download the team project set file and do the following to import the plug-in project into your workspace.</p> |
| <ul> |
| <li>From the File menu, choose Import. This will open the Import dialog. |
| <li>In the Import dialog, choose Team > Team Project Set and click Next. |
| <li>Browse for or type in the name of the project set file and click Finish. |
| <li>The digraph2 project contained in the project set will be fetched from the CVS repository on Eclipse.org. |
| </ul> |
| <p>The example was created with <a href="http://download.eclipse.org/downloads" target="_top">Eclipse 3.3</a> |
| and <a href="http://download.eclipse.org/tools/gef/downloads" target="_top">GEF 3.3</a></p> |
| <hr/> |
| |
| <h2><a name="Digraph2GraphicalEditor"></a>Basic Graphical Editor with Connections</h2> |
| |
| <p>The objective of the digraph2 example is to add connections to the |
| <a href="digraph1.php">digraph1 example</a>.</p> |
| <p><img src="images/digraph2_editor.png" alt="digraph2_editor"/></p> |
| <h3>Model</h3> |
| <p>We add edges (<tt>Digraph2Edge</tt>) to our domain model.</p> |
| <h3>Figure</h3> |
| <p>Each edge figure is a <tt>PolylineConnection</tt>. We also add <tt>Digraph2ConnectionAnchor</tt> |
| to anchor the edges to the nodes. The edges are anchored to the bottom center and top center of the |
| nodes.</p> |
| <h3>EditPart</h3> |
| <p>We add an EditPart for edges (<tt>Digraph2EdgeEditPart</tt>). We also need to make |
| <tt>Digraph2NodeEditPart</tt> implement <tt>NodeEditPart</tt> to add source and target connections |
| to the nodes in our directed graph. We finally added a <tt>ManhattanConnectionRouter</tt> to the |
| <tt>ConnectionLayer</tt> in the <tt>refreshVisuals()</tt> method in our <tt>Digraph2GraphEditPart</tt>.</p> |
| <h3>Factory</h3> |
| <p>We add <tt>Digraph2EdgeEditPart</tt> to <tt>Digraph2EditPartFactory</tt>.</p> |
| <h3>Policy</h3> |
| <p>We make use of a <tt>ConnectionEditPolicy</tt> to place the edges on the graph |
| (<tt>Digraph2ConnectionEditPolicy</tt>).</p> |
| <h3>Editor</h3> |
| <p>We did not need to make any additional changes to our <tt>Digraph2GraphicalEditor</tt>.</p> |
| <h3>Opening the Example Editor</h3> |
| <p>The graph example editor opens for any file with the <tt>digraph2</tt> file extension. |
| So we need a project and file in the workspace to open the editor. First, create a new project resource |
| <tt> File > New > Project</tt>. Then a new file resource, such as <tt>file.digraph2</tt> using |
| <tt> File > New > File</tt>. After creating the file, the Directed Graph Example Editor will open.</p> |
| |
| <hr/> |
| |
| <p><b>By Anthony Hunter, IBM Rational Software</b><br/> |
| <font size="-1">$Header: /cvsroot/org.eclipse/www/gef/reference/digraph2.php,v 1.3 2007/11/16 04:37:12 ahunter Exp $</font></p> |
| <p><em> Please send comments about this example document to |
| the</em> <a href="news://news.eclipse.org/eclipse.tools.gef">eclipse.tools.gef</a> <em>newsgroup.</em></p> |
| <br/><br/> |
| </div> |
| |
| EOHTML; |
| |
| |
| # Generate the web page |
| $App->generatePage($theme, $Menu, $Nav, $pageAuthor, $pageKeywords, $pageTitle, $html); |
| ?> |