Wiki source code of Working With Layout Options
Version 6.1 by cds on 2013/09/11 19:29
Show last authors
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{warning}} | ||
| 2 | We haven't finished writing this page yet. | ||
| 3 | {{/warning}} | ||
| 4 | |||
| 5 | |||
| 6 | |||
| 7 | This page describes how layout options are applied by KIML during the layout process. After having read this, you should be able to answer the following questions: | ||
| 8 | |||
| 9 | * What are //layout options//? | ||
| 10 | * How do layout options end up in KGraph elements? | ||
| 11 | * How can I set layout options on elements programmatically? | ||
| 12 | |||
| 13 | This page does not list the available layout options, and neither does it explain any of them. You can find a list of layout options provided by KIML [[over here>>doc:KIML Layout Options]]. | ||
| 14 | |||
| 15 | |||
| 16 | |||
| 17 | **Contents** | ||
| 18 | |||
| 19 | |||
| 20 | |||
| 21 | {{toc/}} | ||
| 22 | |||
| 23 | = Layout Options and What They Are Good For = | ||
| 24 | |||
| 25 | Even the most basic layout algorithm provides some settings for you to play with. This might be something as simple as the space left between different nodes, or something as complex as changing how node labels are placed and how that influences the size of each node. Each such setting must be registered with KIML as a //layout option//, and each algorithm must specify exactly which of these options it supports. Registering a layout option is done through one of KIML's extension points and can look like this: | ||
| 26 | |||
| 27 | {{code language="html/xml"}} | ||
| 28 | <extension point="de.cau.cs.kieler.kiml.layoutProviders"> | ||
| 29 | <layoutOption | ||
| 30 | id="de.cau.cs.kieler.nodeLabelPlacement" | ||
| 31 | name="Node Label Placement" | ||
| 32 | description="Hints for where node labels are to be placed; if empty, the node label's position is not modified." | ||
| 33 | advanced="true" | ||
| 34 | appliesTo="nodes" | ||
| 35 | type="enumset" | ||
| 36 | class="de.cau.cs.kieler.kiml.options.NodeLabelPlacement" | ||
| 37 | default=""> | ||
| 38 | </layoutOption> | ||
| 39 | </extension> | ||
| 40 | {{/code}} | ||
| 41 | |||
| 42 | (% style="line-height: 1.4285715;" %)Let's walk through the parameters available for layout options (not every available parameter appears in the example above): | ||
| 43 | |||
| 44 | * (% style="line-height: 1.4285715;" %){{code language="none"}}id{{/code}} – A unique identifier for this layout option. It is recommended that the identifier be prefixed by the plug-in name, to guarantee uniqueness.(%%)\\ | ||
| 45 | * {{code language="none"}}type{{/code}} – Defines the data type of this option; must be either {{code language="none"}}boolean{{/code}}, {{code language="none"}}string{{/code}}, {{code language="none"}}int{{/code}}, {{code language="none"}}float{{/code}}, {{code language="none"}}enum{{/code}}, {{code language="none"}}enumset{{/code}}, or {{code language="none"}}object{{/code}}. The types {{code language="none"}}enum{{/code}}, {{code language="none"}}enumset{{/code}}, and {{code language="none"}}object{{/code}} require the {{code language="none"}}class{{/code}} attribute to be set. | ||
| 46 | * (% style="line-height: 1.4285715;" %){{code language="none"}}name{{/code}} – A user friendly name of this layout option, to be displayed in the UI. | ||
| 47 | |||
| 48 | * (% style="line-height: 1.4285715;" %){{code language="none"}}description{{/code}} – A user friendly description of this layout option, to be displayed in the UI. The description should contain all information needed to understand what this option does. | ||
| 49 | |||
| 50 | * (% style="line-height: 1.4285715;" %){{code language="none"}}advanced{{/code}} – Whether the option should only be shown in advanced mode in the layout view; default is {{code language="none"}}false{{/code}}. | ||
| 51 | |||
| 52 | * {{code language="none"}}appliesTo{{/code}} – A comma separated list of targets on which the layout option can be applied; a target can be either {{code language="none"}}parents{{/code}} (for nodes that contain further nodes), {{code language="none"}}nodes{{/code}} (for all nodes regardless of whether they contain further nodes or not), {{code language="none"}}edges{{/code}}, {{code language="none"}}ports{{/code}}, or {{code language="none"}}labels{{/code}}. If omitted, the layout option is not shown to the user in the layout view, which is a good thing for options that will be set programmatically anyway.\\ | ||
| 53 | * (% style="line-height: 1.4285715;" %){{code language="none"}}class{{/code}} – An optional Java class giving more detail on the data type. For {{code language="none"}}enum{{/code}} and {{code language="none"}}enumset{{/code}} options this attribute must hold the Enum class of the option. For {{code language="none"}}object{{/code}} options it must hold the class name of an {{code language="none"}}IDataObject{{/code}} implementation. | ||
| 54 | |||
| 55 | * (% style="line-height: 1.4285715;" %){{code language="none"}}default{{/code}} – The default value to use when no other value can be determined for this option. | ||
| 56 | * (% style="line-height: 1.4285715;" %){{code language="none"}}lowerBound{{/code}} – An optional lower bound on the values of this layout option. This is used when a layout configuration is determined automatically. | ||
| 57 | * (% style="line-height: 1.4285715;" %){{code language="none"}}upperBound{{/code}} – An optional upper bound on the values of this layout option. This is used when a layout configuration is determined automatically. | ||
| 58 | * (% style="line-height: 1.4285715;" %){{code language="none"}}variance{{/code}} – An optional variance for values of this layout option. This is used when a layout configuration is determined automatically. The variance is taken as multiplier for Gaussian distributions when new values are determined. Options with uniform distibution, such as Boolean or enumeration types, do not need a variance value, since all values have equal probability. A variance of 0 implies that the option shall not be used in automatic configuration, regardless of its type. | ||
| 59 | |||
| 60 | |||
| 61 | {{warning title="ToDo"}} | ||
| 62 | Provide a better explanation of what the latter three parameters are used for. Are they only relevant to evolutionary layout? | ||
| 63 | {{/warning}} | ||
| 64 | |||
| 65 | (% style="line-height: 1.4285715;" %)If a layout algorithm supports a particular layout option, it must tell KIML so. Here's an example: | ||
| 66 | |||
| 67 | {{code language="html/xml"}} | ||
| 68 | <extension point="de.cau.cs.kieler.kiml.layoutProviders"> | ||
| 69 | <layoutAlgorithm ...> | ||
| 70 | <knownOption | ||
| 71 | option="de.cau.cs.kieler.borderSpacing" | ||
| 72 | default="20"> | ||
| 73 | </knownOption> | ||
| 74 | </layoutAlgorithm> | ||
| 75 | </extension> | ||
| 76 | {{/code}} | ||
| 77 | |||
| 78 | (% style="line-height: 1.4285715;" %)This tells KIML that the defined layout algorithm supports the border spacing option. And even more, it overrides the default value declared by the layout option and sets it to 20. | ||
| 79 | |||
| 80 | = (% style="line-height: 1.4285715;" %)The Layout Options Manager(%%) = | ||
| 81 | |||
| 82 | (% style="line-height: 1.4285715;" %)By now, we have an idea of what layout options do and why they are important in the first place. However, we haven't looked at how layout options end up on KGraph elements yet. This is where the [[{{code language="none"}}LayoutOptionsManager{{/code}}>>url:http://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/pragmatics/browse/plugins/de.cau.cs.kieler.kiml.ui/src/de/cau/cs/kieler/kiml/ui/service/LayoutOptionManager.java||shape="rect"]] comes in. | ||
| 83 | |||
| 84 | {{tip}} | ||
| 85 | The [[KIML page>>doc:Infrastructure for Meta Layout (KIML)]] has a high-level explanation of what happens when during the layout process. To take a look at it if you haven't already – it will make the following concepts easier to understand. | ||
| 86 | {{/tip}} | ||
| 87 | |||
| 88 | (% style="line-height: 1.4285715;" %)After a layout manager has finished turning a given diagram into its KGraph representation, the layout options manager is asked to enrich the KGraph elements with layout options. The option values can come from different sources: the user might have set some using the layout view; there might be some defaults for certain kinds of diagrams; or the programmer might have decided to attach some layout options to certain elements for just this one layout run. Whatever the source, the options manager is in charge of collecting all these layout option values and making sure they find their way to the correct KGraph element. To start off with a clean plate, it first makes sure there are no layout options attached to the KGraph elements. It then does two things: collect every eligible source of layout options, and transfer layout options to the correct KGraph elements. Sounds easy enough. | ||
| 89 | |||
| 90 | (% style="line-height: 1.4285715;" %)The question remains how the layout options sources work. Each source is represented by a class that implements the [[{{code language="none"}}ILayoutConfig{{/code}}>>url:https://git.rtsys.informatik.uni-kiel.de/projects/KIELER/repos/pragmatics/browse/plugins/de.cau.cs.kieler.kiml/src/de/cau/cs/kieler/kiml/config/ILayoutConfig.java||shape="rect"]] interface, called a //layout configuration//. KIML currently provides the following layout configurations, each representing a particular source of layout options: | ||
| 91 | |||
| 92 | * {{code language="none"}}DefaultLayoutConfig{{/code}} – Sets fixed default values defined for layout options. | ||
| 93 | * {{code language="none"}}EclipseLayoutConfig{{/code}} – Users can define default layout options to be set on elements that meet certain criteria via the KIML preference page. This layout configuration takes these options and applies them. | ||
| 94 | * {{code language="none"}}SemanticLayoutConfig{{/code}} – ??? | ||
| 95 | * {{code language="none"}}GmfLayoutConfig{{/code}} / {{code language="none"}}GraphitiLayoutConfig{{/code}} – These configurations apply layout options set by the user in the layout view or stored in the notation model file of a diagram. | ||
| 96 | * {{code language="none"}}VolatileLayoutConfig{{/code}} – A configuration whose only purpose it is to make sure certain layout options are set on certain diagram elements in a particular layout run. | ||
| 97 | |||
| 98 | The options manager collects all available and applicable layout configurations and sorts them by priority (incidentally, the configurations were sorted by increasing priority just now). For every graph element, each configuration is asked to provide layout options, starting with the default layout configuration and working through the priority chain. | ||
| 99 | |||
| 100 | == A Few Details on Layout Configurations == | ||
| 101 | |||
| 102 | What we just learned is a bit of a simplification of what happens. The layout options manager not only asks each layout configuration to provide layout options for each graph element. Before we look at the details, let's take a look at the methods each layout configuration provides: | ||
| 103 | |||
| 104 | {{code language="java"}} | ||
| 105 | public interface ILayoutConfig { | ||
| 106 | int getPriority(); | ||
| 107 | |||
| 108 | void enrich(LayoutContext context); | ||
| 109 | |||
| 110 | Object getValue(LayoutOptionData<?> optionData, LayoutContext context); | ||
| 111 | |||
| 112 | void transferValues(KLayoutData layoutData, LayoutContext context); | ||
| 113 | } | ||
| 114 | {{/code}} | ||
| 115 | |||
| 116 | It is not hard to guess what {{code language="none"}}getPriority(){{/code}} does: it returns the priority a given layout configuration has. If two layout configurations set a layout option to different values on a given graph element, the value set by the configuration with lower priority gets overwritten. The other three methods look a bit more obscure, so we have to provide more details on what the options manager does, exactly. | ||
| 117 | |||
| 118 | ENRICHING (+ WHAT IS A LAYOUT CONTEXT) | ||
| 119 | |||
| 120 | TRANSFERRING | ||
| 121 | |||
| 122 | GETVALUE (for the layout view?) | ||
| 123 | |||
| 124 | == (% style="line-height: 1.4285715;" %)Implementing a Layout Configuration(%%) == | ||
| 125 | |||
| 126 | (% style="line-height: 1.4285715;" %)deciding what options are applicable depending on the context object; setting the options; | ||
| 127 | |||
| 128 | |||
| 129 | = (% style="line-height: 1.4285715;" %)Programmatically Setting Layout Options(%%) = | ||
| 130 | |||
| 131 | {{warning title="ToDo"}} | ||
| 132 | Write this section. This will be about when to use the different kinds of layout configurations, mainly {{code language="none"}}SemanticLayoutConfig{{/code}} and {{code language="none"}}VolatileLayoutConfig{{/code}}. | ||
| 133 | {{/warning}} | ||
| 134 | |||
| 135 | (% style="line-height: 1.4285715;" %) |