padding

src/elements/div.rs

@@ -13,7 +13,7 @@ pub struct Div {
 impl Element for Div {
     fn render(&mut self, scope: &mut crate::render_scope::RenderScope) {
         let (width, height) = scope.get_size_or(self.size.0, self.size.1);
-        scope.draw_background(width, height);
+        scope.draw_rect(width, height, 0);
     }
 
     fn after_render(&mut self, scope: &mut crate::render_scope::RenderScope) {
@@ -23,6 +23,9 @@ impl Element for Div {
 
         for elem in self.children.lock().unwrap().iter() {
             scope.clear();
+            if let Some(style) = elem.get() {
+                scope.set_style(style);
+            }
             if let Some(t) = elem.get() {
                 scope.set_transform(&t);
             }
@@ -31,14 +34,13 @@ impl Element for Div {
                 scope.set_transform(&t);
             }
             let t = scope.get_transform_mut();
-            transform.width = transform.width.max(t.x + t.width);
-            transform.height = transform.height.max(t.y + t.height);
-            t.x += transform.x;
-            t.y += transform.y;
+            transform.width = transform.width.max(t.x + t.width + (t.px * 2));
+            transform.height = transform.height.max(t.y + t.height + (t.py * 2));
+            t.x += transform.x + transform.px;
+            t.y += transform.y + transform.py;
 
             scope.draw();
             elem.0.lock().unwrap().after_render(scope);
-            scope.clear();
         }
         scope.set_parent_size(w, h);
         self.size = (transform.width, transform.height);

src/elements/flex.rs

@@ -20,7 +20,7 @@ pub struct FlexCol {
 impl Element for FlexRow {
     fn render(&mut self, scope: &mut crate::render_scope::RenderScope) {
         let (width, height) = scope.get_size_or(self.size.0, self.size.1);
-        scope.draw_background(width, height);
+        scope.draw_rect(width, height, 0);
     }
 
     fn after_render(&mut self, scope: &mut crate::render_scope::RenderScope) {
@@ -32,6 +32,9 @@ impl Element for FlexRow {
 
         for elem in self.children.lock().unwrap().iter() {
             scope.clear();
+            if let Some(style) = elem.get() {
+                scope.set_style(style);
+            }
             if let Some(t) = elem.get() {
                 scope.set_transform(&t);
             }
@@ -45,6 +48,8 @@ impl Element for FlexRow {
             t.x += transform.x;
             t.y += transform.y + v;
             v += t.height + self.gap;
+            t.px += transform.px;
+            t.py += transform.py;
 
             scope.draw();
 
@@ -81,7 +86,7 @@ impl FlexRow {
 impl Element for FlexCol {
     fn render(&mut self, scope: &mut crate::render_scope::RenderScope) {
         let (width, height) = scope.get_size_or(self.size.0, self.size.1);
-        scope.draw_background(width, height);
+        scope.draw_rect(width, height, 0);
     }
 
     fn after_render(&mut self, scope: &mut crate::render_scope::RenderScope) {
@@ -93,6 +98,9 @@ impl Element for FlexCol {
 
         for elem in self.children.lock().unwrap().iter() {
             scope.clear();
+            if let Some(style) = elem.get() {
+                scope.set_style(style);
+            }
             if let Some(t) = elem.get() {
                 scope.set_transform(&t);
             }
@@ -101,11 +109,13 @@ impl Element for FlexCol {
                 scope.set_transform(&t);
             }
             let t = scope.get_transform_mut();
-            transform.width = transform.width.max(v + t.width);
-            transform.height = transform.height.max(t.height);
+            transform.width = transform.width.max(v + t.width + (t.px * 2));
+            transform.height = transform.height.max(t.height + (t.py * 2));
             t.x += transform.x + v;
             t.y += transform.y;
             v += t.width + self.gap;
+            t.px += transform.px;
+            t.py += transform.py;
 
             scope.draw();