Make x, y, w, h all configurable with style sheets.

toitware · Dec 12, 2023 · d0f7e5b · d0f7e5b
1 parent 48d609a
commit d0f7e5b
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 9 deletions.
diff --git a/src/element.toit b/src/element.toit
@@ -179,6 +179,12 @@ abstract class Element implements Window:
         invalidate
         border_ = value
         invalidate
+    else if key == "x":
+      x = value
+    else if key == "y":
+      y = value
+    else:
+      print "Unknown style key: '$key'"
 
   abstract type -> string
 
@@ -289,9 +295,9 @@ class Div extends Element:
       invalidate
 
   set-attribute_ key/string value -> none:
-    if key == "width":
+    if key == "w":
       w = value
-    else if key == "height":
+    else if key == "h":
       h = value
     else:
       super key value
@@ -334,6 +340,8 @@ class Label extends Element implements ColoredElement:
       orientation = value
     else if key == "alignment":
       alignment = value
+    else if key == "label":
+      label = value
     else:
       super key value
 

diff --git a/src/style.toit b/src/style.toit
@@ -624,6 +624,10 @@ class Style:
   constructor.empty: return EMPTY-STYLE_
 
   constructor
+      --x/int?=null
+      --y/int?=null
+      --w/int?=null
+      --h/int?=null
       --color/int?=null
       --font/Font?=null
       --background=null
@@ -632,6 +636,10 @@ class Style:
       --id-map/Map?=null
       --type-map/Map?=null
       .map_={:}:
+    if x != null: map_["x"] = x
+    if y != null: map_["y"] = y
+    if w != null: map_["w"] = w
+    if h != null: map_["h"] = h
     if color != null: map_["color"] = color
     if font != null: map_["font"] = font
     if border != null: map_["border"] = border

diff --git a/tests/horizontal-slider-visualized.toit b/tests/horizontal-slider-visualized.toit
@@ -55,8 +55,8 @@ main args:
           "slider": Style {
               "background-hi": heat,
               "background-lo": cold,
-              "width": 120,
-              "height": 20,
+              "w": 120,
+              "h": 20,
               "horizontal": true,
           },
           "label": Style --font=sans10 --color=0xffffff,

diff --git a/tests/slider-rotated-visualized.toit b/tests/slider-rotated-visualized.toit
@@ -52,11 +52,9 @@ main args:
 
   style := Style
       --type-map={
-          "slider": Style {
+          "slider": Style --w=20 --h=100 {
               "background-hi": heat,
               "background-lo": cold,
-              "width": 20,
-              "height": 100,
           },
           "label": Style --font=sans10 --color=0xffffff,
       }

diff --git a/tests/slider-visualized.toit b/tests/slider-visualized.toit
@@ -55,8 +55,8 @@ main args:
           "slider": Style {
               "background-hi": heat,
               "background-lo": cold,
-              "width": 20,
-              "height": 100,
+              "w": 20,
+              "h": 100,
           },
           "label": Style --font=sans10 --color=0xffffff,
       }