Add alignment note as per https://github.com/orgs/espruino/discussions/3596#discussioncomment-13196482
parent
5ee4355bc3
commit
8a9277f38e
|
|
@ -3,6 +3,8 @@ Bangle.js Layout Library
|
||||||
|
|
||||||
> Take a look at README.md for hints on developing with this library.
|
> Take a look at README.md for hints on developing with this library.
|
||||||
|
|
||||||
|
**Please see more complete documentation at https://www.espruino.com/Bangle.js+Layout**
|
||||||
|
|
||||||
Usage
|
Usage
|
||||||
-----
|
-----
|
||||||
|
|
||||||
|
|
@ -85,6 +87,40 @@ Other functions:
|
||||||
- `layout.setUI()` - Re-add any UI input handlers
|
- `layout.setUI()` - Re-add any UI input handlers
|
||||||
|
|
||||||
|
|
||||||
|
Alignment
|
||||||
|
----------
|
||||||
|
|
||||||
|
You can align elements within their `h` or `v` containers with `halign` and `valign`, however within an element, text is always rendered centered.
|
||||||
|
|
||||||
|
As a result, if you want to align text, you shouldn't use `fillx:1` in the text element as the element will then fill to all available space and won't align.
|
||||||
|
|
||||||
|
```JS
|
||||||
|
var layout = new Layout( {
|
||||||
|
type:"v", c: [{
|
||||||
|
type:"txt",
|
||||||
|
font:"20%",
|
||||||
|
fillx:0, // must be 0 for halign to work
|
||||||
|
filly:1,
|
||||||
|
halign:-1, // LEFT align
|
||||||
|
label:"Left"
|
||||||
|
}, {
|
||||||
|
type:"txt",
|
||||||
|
font:"20%",
|
||||||
|
fillx:0,
|
||||||
|
filly:1,
|
||||||
|
halign:0, // CENTER align
|
||||||
|
label:"Center"
|
||||||
|
}, {
|
||||||
|
type:"txt",
|
||||||
|
font:"20%",
|
||||||
|
fillx:0,
|
||||||
|
filly:1,
|
||||||
|
halign:1, // CERIGHTNTER align
|
||||||
|
label:"Right"},
|
||||||
|
]
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
Using with `E.showMenu`/`E.showPrompt`/etc
|
Using with `E.showMenu`/`E.showPrompt`/etc
|
||||||
--------------------------------------
|
--------------------------------------
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue