Demo of some of the components that come with hcj.
Conventions used in these examples' code:
var nbsp;c nbsp;= nbsp;hcj.component;
var nbsp;p nbsp;= nbsp;c.text;
var nbsp;pm nbsp;= nbsp;c.text({measureWidth: nbsp;true});
var nbsp;h1 nbsp;= nbsp;c.text({size: nbsp;'40px'});
var nbsp;h1m nbsp;= nbsp;c.text({size: nbsp;'40px', nbsp;measureWidth: nbsp;true});
Display all kinds of text
big text
[show code]
little text
[show code]
colored text
[show code]
funky text
[show code]
secret text
[show code]
Display images
[show code]
Separate items horizontally and vertically
TEXT
TEXT
TEXT
TEXT
[show code]
Align items horizontally and vertically
LEFT
RIGHT
MIDDLE
[show code]
TOP
BOTTOM
MIDDLE
LARGE TOP
LARGE BOTTOM
LARGE MIDDLE
LARGER TOP
LARGER BOTTOM
LARGER MIDDLE
[show code]
Show a stream of components. Text is changed each time you press the button
ALZIMMVGYX
[show code]
Show a grid of components
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
GRID TEXT
[show code]
Maintain aspect ratio even in adverse conditions, both by "covering" and by "containing"
[show code]
Choose the largest component that fits in the display area
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
cccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee
fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff
ggggggggggggggggggggggggggggggggggggggggggggggggggggggg
hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
iiiiiiiiiiiii
[show code]
Display things on top of each other
Some text
Hello
hi
hi
hi
[show code]
Load content asynchoronusly
[show code]
Display components side by side and in a stack
A
B
C
[show code]
A
B
C
[show code]
Apply font and background colors
MERRY CHRISTMAS
[show code]
Add margins and borders
HCJ
[show code]
HCJ
[show code]
Crop components
HALP
[show code]
Link to google
knowledge awaits
[show code]
Arbitrarily position components and specify their widths and heights
HCJ
HCJ
HCJ
HCJ
[show code]
Handle events
[show code]