Documentation
Documentation pages for Arranger for Adobe XD.
Download playground file here ->
Honeycomb Layout

1. General
- Arrange any type of object: rectangles, ellipses, polygons or even text.
- Objects need to be inside a group for Arranger to do its magic.
- If they are not inside a group Arranger will create a group from the selected objects.
2. Columns
- Set the maximum number of columns. Every other row will be shorter to achieve the honeycomb layout.
- Lowest number of columns is 2. Zero and negative numbers are not possible.
3. Offset
- Offset is the most important value to achieve honeycomb layouts.
- x: you usually want this to be half the width of an item.
- y: this works the same as „x“ but just for height.
BUT: most of the time y needs to be negative to move up between the objects of the row above.


4. Layout
- The first (default) option is symmetric layout. This is similiar to center a textfield. Rows are layout by their center.
- The second option is asymmetric layouts. That means the rows are aligned on the left side.

5. Alternate Rows
- By default each row starts with the long row. After that comes the short row and so on.
- Here you can change that order and start with the short row.

6. Spacing
- In „Grid“ this is called gutters. This defines the distance between object on x and y axis.
- Important for hexagons: if you have hexagon objects you need to adjust spacing additionally to offset.

7. Random Order
- With this option the order of objects will be randomized.
- If you uncheck it then it will reset to your default order defined by layers.
- Note: The new random order is just „virtual“. This real order in layers is not changed.