63 lines
2.2 KiB
Markdown
63 lines
2.2 KiB
Markdown
|
# Viewboxes
|
||
|
|
|
||
|
|
Viewboxes are the mechanism by which things are positioned on the screen.
|
||
|
|
|
||
|
|
Viewboxes allow you to split the screen (`Size`) into many different sections. You can then anchor objects to specific anchor points within each box you create.
|
||
|
|
|
||
|
|
For instance: Here's a few Viewboxes:
|
||
|
|
|
||
|
|
```
|
||
|
|
TopHeaderView: Size[0] ^
|
||
|
|
100~,
|
||
|
|
0-,
|
||
|
|
]
|
||
|
|
|
||
|
|
TopHeaderHalves: TopHeaderView[1] >
|
||
|
|
1:2,
|
||
|
|
1:2,
|
||
|
|
]
|
||
|
|
|
||
|
|
TopHeaderThirdsLeft: TopHeaderHalves[0] ^
|
||
|
|
1:3,
|
||
|
|
1:3,
|
||
|
|
1:3,
|
||
|
|
]
|
||
|
|
```
|
||
|
|
|
||
|
|
The viewboxes above resolve to these
|
||
|
|
|
||
|
|
- `TopHeaderView`
|
||
|
|
|
||
|
|
- `TopHeaderHalves`
|
||
|
|
|
||
|
|
- `TopHeaderThirdsLeft`
|
||
|
|
|
||
|
|
|
||
|
|
The only Viewbox that's provided for you is `Size`, which is just one box, that is the full size of the screen.
|
||
|
|
|
||
|
|
- `TopHeaderView` splits `Size` into 2 boxes
|
||
|
|
- One box is 100 logical pixels long
|
||
|
|
- And the second box has a minimum length of 0 logical pixels (you can use `0-` to just make the box take the rest of the splitting area).
|
||
|
|
|
||
|
|
- `TopHeaderHalves` splits `TopHeaderView` into 2 more boxes
|
||
|
|
- One box takes one half of the splitting area
|
||
|
|
- And the other box takes the other half of the splitting area
|
||
|
|
|
||
|
|
- Finally, `TopHeaderThirdsLeft` splits `TopHeaderView` into 3 more boxes
|
||
|
|
- One box takes one third of the splitting area
|
||
|
|
- Another box takes one third of the splitting area
|
||
|
|
- And the last box takes one third of the splitting area
|
||
|
|
|
||
|
|
You'll also notice that each viewbox is split in different directions
|
||
|
|
|
||
|
|
- `^` and `_` mean that the viewbox is splititng horizontally, or that the boxes are travelling downwards as the box index increases
|
||
|
|
- `>` and `<` mean that the viewbox is splitting vertically, or that the boxes are travelling to the right as the box index increases
|
||
|
|
|
||
|
|
Viewboxes support many constraints aside from just ratios
|
||
|
|
|
||
|
|
- `{number}%`: Allocates a given percentage of the splitting area
|
||
|
|
- `{number}-`: Allocates at least a given size of the splitting area
|
||
|
|
- `{number}+`: Allocates at most a given size of the splitting area
|
||
|
|
- `{number}~`: Allocates the exact size given of the splitting area
|
||
|
|
- `{number}:{number}`: Allocates the given ratio of the splitting area
|