pebble-scalable 1.2.0 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +16 -8
- package/dist.zip +0 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
# pebble-scalable
|
|
2
2
|
|
|
3
3
|
Package aiming to make it easy to make scaling layouts for different display
|
|
4
|
-
sizes by defining their dimension only
|
|
4
|
+
sizes by defining their dimension only once.
|
|
5
5
|
|
|
6
6
|
- [Setting up](#setting-up)
|
|
7
7
|
- [Dimensions](#dimensions)
|
|
@@ -29,19 +29,22 @@ Add the includes at the top of your source.
|
|
|
29
29
|
Get values for layout dimensions based on display size:
|
|
30
30
|
|
|
31
31
|
```c
|
|
32
|
-
// Get a percentage of the display width and height
|
|
33
|
-
const int half_w = scalable_x(
|
|
34
|
-
const int half_h = scalable_y(
|
|
32
|
+
// Get a percentage (thousands) of the display width and height
|
|
33
|
+
const int half_w = scalable_x(500);
|
|
34
|
+
const int half_h = scalable_y(500);
|
|
35
35
|
|
|
36
36
|
// Get a GRect based only on percentage width/height
|
|
37
|
-
const GRect center_rect = scalable_grect(
|
|
37
|
+
const GRect center_rect = scalable_grect(330, 330, 330, 330);
|
|
38
38
|
```
|
|
39
39
|
|
|
40
40
|
If a percentage isn't precise enough, the x/y or w/h can be nudged by some pixels:
|
|
41
41
|
|
|
42
42
|
```c
|
|
43
43
|
// A rect nudged by 5px in x and 2px in y
|
|
44
|
-
|
|
44
|
+
GRect precise = scalable_nudge(scalable_grect(100, 100, 200, 200), 5, 2);
|
|
45
|
+
|
|
46
|
+
// Nudge more only on Emery
|
|
47
|
+
precise = scalable_nudge_emery(precise, 5, 2);
|
|
45
48
|
```
|
|
46
49
|
|
|
47
50
|
## Centering
|
|
@@ -49,7 +52,7 @@ const GRect precise = scalable_nudge_xy(scalable_grect(10, 10, 20, 20), 5, 2);
|
|
|
49
52
|
A GRect can be centered in either the X or Y axis, or both:
|
|
50
53
|
|
|
51
54
|
```c
|
|
52
|
-
const GRect r = scalable_grect(
|
|
55
|
+
const GRect r = scalable_grect(100, 500, 200, 200);
|
|
53
56
|
|
|
54
57
|
// Center horizontally
|
|
55
58
|
const GRect centered_h = scalable_center_x(r);
|
|
@@ -96,9 +99,14 @@ graphics_draw_text(
|
|
|
96
99
|
ctx,
|
|
97
100
|
"This text should appear in the middle third on any platform or display size",
|
|
98
101
|
scalable_get_font(FONT_ID_SMALL),
|
|
99
|
-
scalable_grect(0,
|
|
102
|
+
scalable_grect(0, 330, 1000, 330),
|
|
100
103
|
GTextOverflowModeTrailingEllipsis,
|
|
101
104
|
GTextAlignmentCenter,
|
|
102
105
|
NULL
|
|
103
106
|
);
|
|
104
107
|
```
|
|
108
|
+
|
|
109
|
+
## TODO
|
|
110
|
+
|
|
111
|
+
- [ ] Solution for picking bitmaps (to work with their scalable GRects)
|
|
112
|
+
- [ ] Functions per-platform
|
package/dist.zip
CHANGED
|
Binary file
|