相对布局

另外一个使用相对布局的方式是对节点使用origin和offset属性来指定相对另外一个节点的位置。

[ Left ] -> [ Right ] { origin: Left; offset: 2,1; }

+------+
| Left |
+------+
  |
  |              +-------+
  +------------> | Right |
                 +-------+

offset属性不允许指定为0, 0；另外，要注意的是不要把一个节点放到另外一个节点内部去了，尤其当节点占据多个单元格的时候。

节点的偏移是从一个节点的左/右或者上/下来计算的，因此对于一个占据三个单元格的节点来说，设置offset为2会把下一个节点放置在它右边偏移两个位置的地方（而不是放在这个节点内部的第一个单元格之后）:

[ A ] { size: 3,2; }

[ A ] -> [ B ] { origin: A; offset: 2,0; }
[ A ] -> [ C ] { origin: A; offset: 1,1; }

+---+     +---+
|   | --> | B |
| A |     +---+
|   |
|   |--+
+---+  v
     +---+
     | C |
     +---+

可以为每一个节点设置origin属性；唯一不允许的是不能创建循环引用, 下面的例子是错误的：

[ A ] { origin: B; offset: 1,1; }
[ B ] { origin: A; offset: 1,1; }       # invalid!

[ C ] { origin: E; offset: 1,1; }
[ D ] { origin: C; offset: 1,1; }
[ E ] { origin: C; offset: 1,1; }       # invalid!

下面是一个使用链式offset 的例子：

[ A ] { origin: B; offset: 2,1; }

-> [ B ] { origin: C; offset: 1,1; }
-> [ C ] { origin: D; offset: 1,1; }
-> [ D ]
-> [ E ]

+---+     +---+
| D | --> | E |
+---+     +---+
  ^  +---+
  +--| C |
     +---+
       ^  +---+
       +--| B |
          +---+
            ^       +---+
            +------ | A |
                    +---+