Add spacing to HStack/VStack

fwcd · Aug 25, 2024 · a4f059e · a4f059e
1 parent 8ae8845
commit a4f059e
Show file tree

Hide file tree

Showing 9 changed files with 54 additions and 24 deletions.
diff --git a/nuit-bridge-adwaita/src/node_widget/mod.rs b/nuit-bridge-adwaita/src/node_widget/mod.rs
@@ -7,8 +7,6 @@ use nuit_core::{Event, IdPath, IdPathBuf, Node};
 
 // See https://gtk-rs.org/gtk4-rs/stable/latest/book/g_object_subclassing.html
 
-const DEFAULT_SPACING: i32 = 10;
-
 glib::wrapper! {
     pub struct NodeWidget(ObjectSubclass<imp::NodeWidget>)
         @extends gtk::Box, gtk::Widget;
@@ -85,15 +83,15 @@ impl NodeWidget {
                 }
                 self.append(&button);
             },
-            Node::HStack { wrapped } => {
-                let gtk_box = gtk::Box::new(Orientation::Horizontal, DEFAULT_SPACING);
+            Node::HStack { spacing, wrapped } => {
+                let gtk_box = gtk::Box::new(Orientation::Horizontal, *spacing as i32);
                 for (child_path, child) in wrapped.value().children_from(&IdPathBuf::from(wrapped.id().clone())) {
                     gtk_box.append(&self.child(child.clone(), &child_path))
                 }
                 self.append(&gtk_box);
             },
-            Node::VStack { wrapped } => {
-                let gtk_box = gtk::Box::new(Orientation::Vertical, DEFAULT_SPACING);
+            Node::VStack { spacing, wrapped } => {
+                let gtk_box = gtk::Box::new(Orientation::Vertical, *spacing as i32);
                 for (child_path, child) in wrapped.value().children_from(&IdPathBuf::from(wrapped.id().clone())) {
                     gtk_box.append(&self.child(child.clone(), &child_path))
                 }

diff --git a/nuit-bridge-swiftui/Sources/NuitBridgeSwiftUI/Node.swift b/nuit-bridge-swiftui/Sources/NuitBridgeSwiftUI/Node.swift
@@ -12,8 +12,8 @@ indirect enum Node: Codable, Hashable {
     case group(children: [Identified<Node>])
 
     // MARK: Layout
-    case vStack(wrapped: Identified<Node>)
-    case hStack(wrapped: Identified<Node>)
+    case vStack(spacing: Double, wrapped: Identified<Node>)
+    case hStack(spacing: Double, wrapped: Identified<Node>)
     case zStack(wrapped: Identified<Node>)
     case list(wrapped: Identified<Node>)
 

diff --git a/nuit-bridge-swiftui/Sources/NuitBridgeSwiftUI/NodeView.swift b/nuit-bridge-swiftui/Sources/NuitBridgeSwiftUI/NodeView.swift
@@ -44,12 +44,12 @@ struct NodeView: View {
             }
 
         // MARK: Layout
-        case let .vStack(wrapped: wrapped):
-            VStack {
+        case let .vStack(spacing: spacing, wrapped: wrapped):
+            VStack(spacing: spacing) {
                 NodeView(node: wrapped.value, idPath: idPath + [wrapped.id])
             }
-        case let .hStack(wrapped: wrapped):
-            HStack {
+        case let .hStack(spacing: spacing, wrapped: wrapped):
+            HStack(spacing: spacing) {
                 NodeView(node: wrapped.value, idPath: idPath + [wrapped.id])
             }
         case let .zStack(wrapped: wrapped):

diff --git a/nuit-core/src/compose/defaults.rs b/nuit-core/src/compose/defaults.rs
@@ -0,0 +1 @@
+pub const DEFAULT_SPACING: f64 = 10.0;
diff --git a/nuit-core/src/compose/mod.rs b/nuit-core/src/compose/mod.rs
@@ -1,5 +1,7 @@
+mod defaults;
 mod shape;
 mod view;
 
+pub use defaults::*;
 pub use shape::*;
 pub use view::*;
diff --git a/nuit-core/src/compose/view/layout/h_stack.rs b/nuit-core/src/compose/view/layout/h_stack.rs
@@ -1,15 +1,24 @@
-use crate::{View, Node, Bind, Context, Event, IdPath, Id, IdentifyExt};
+use crate::{Bind, Context, Event, Id, IdPath, IdentifyExt, Node, View, DEFAULT_SPACING};
 
 /// A view that lays out its children horizontally.
-#[derive(Debug, Clone, PartialEq, Eq)]
+#[derive(Debug, Clone, PartialEq)]
 pub struct HStack<T> {
+    spacing: f64,
     wrapped: T,
 }
 
 impl<T> HStack<T> {
     pub fn new(wrapped: T) -> Self {
         Self {
-            wrapped
+            spacing: DEFAULT_SPACING,
+            wrapped,
+        }
+    }
+
+    pub fn with_spacing(spacing: f64, wrapped: T) -> Self {
+        Self {
+            spacing,
+            wrapped,
         }
     }
 }
@@ -27,6 +36,9 @@ impl<T> View for HStack<T> where T: View {
     }
 
     fn render(&self, context: &Context) -> Node {
-        Node::HStack { wrapped: Box::new(self.wrapped.render(&context.child(0)).identify(0)) }
+        Node::HStack {
+            spacing: self.spacing,
+            wrapped: Box::new(self.wrapped.render(&context.child(0)).identify(0)),
+        }
     }
 }
diff --git a/nuit-core/src/compose/view/layout/v_stack.rs b/nuit-core/src/compose/view/layout/v_stack.rs
@@ -1,15 +1,24 @@
-use crate::{View, Node, Bind, Context, IdPath, Event, Id, IdentifyExt};
+use crate::{Bind, Context, Event, Id, IdPath, IdentifyExt, Node, View, DEFAULT_SPACING};
 
 /// A view that lays out its children vertically.
-#[derive(Debug, Clone, PartialEq, Eq)]
+#[derive(Debug, Clone, PartialEq)]
 pub struct VStack<T> {
+    spacing: f64,
     wrapped: T,
 }
 
 impl<T> VStack<T> {
     pub fn new(wrapped: T) -> Self {
         Self {
-            wrapped
+            spacing: DEFAULT_SPACING,
+            wrapped,
+        }
+    }
+
+    pub fn with_spacing(spacing: f64, wrapped: T) -> Self {
+        Self {
+            spacing,
+            wrapped,
         }
     }
 }
@@ -27,6 +36,9 @@ impl<T> View for VStack<T> where T: View {
     }
 
     fn render(&self, context: &Context) -> Node {
-        Node::VStack { wrapped: Box::new(self.wrapped.render(&context.child(0)).identify(0)) }
+        Node::VStack {
+            spacing: self.spacing,
+            wrapped: Box::new(self.wrapped.render(&context.child(0)).identify(0)),
+        }
     }
 }
diff --git a/nuit-core/src/node/diff.rs b/nuit-core/src/node/diff.rs
@@ -65,9 +65,14 @@ impl NodeDiff {
                 self.traverse_identified(id_path, c1, c2);
             },
             (Node::Button { label: l1 }, Node::Button { label: l2 }) => self.traverse_identified(id_path, l1, l2),
+            (Node::VStack { spacing: s1, wrapped: w1 }, Node::VStack { spacing: s2, wrapped: w2 }) |
+            (Node::HStack { spacing: s1, wrapped: w1 }, Node::HStack { spacing: s2, wrapped: w2 }) => {
+                if s1 != s2 {
+                    self.changed.push(id_path.to_owned());
+                }
+                self.traverse_identified(id_path, w1, w2);
+            },
             (Node::Child { wrapped: w1 }, Node::Child { wrapped: w2 }) |
-            (Node::VStack { wrapped: w1 }, Node::VStack { wrapped: w2 }) |
-            (Node::HStack { wrapped: w1 }, Node::HStack { wrapped: w2 }) |
             (Node::ZStack { wrapped: w1 }, Node::ZStack { wrapped: w2 }) |
             (Node::List { wrapped: w1 }, Node::List { wrapped: w2 }) => self.traverse_identified(id_path, w1, w2),
             (Node::Modified { wrapped: w1, modifier: m1 }, Node::Modified { wrapped: w2, modifier: m2 }) => {

diff --git a/nuit-core/src/node/node.rs b/nuit-core/src/node/node.rs
@@ -21,8 +21,8 @@ pub enum Node {
     Group { children: Vec<Identified<Node>> },
 
     // Layout
-    VStack { wrapped: Box<Identified<Node>> },
-    HStack { wrapped: Box<Identified<Node>> },
+    VStack { spacing: f64, wrapped: Box<Identified<Node>> },
+    HStack { spacing: f64, wrapped: Box<Identified<Node>> },
     ZStack { wrapped: Box<Identified<Node>> },
     List { wrapped: Box<Identified<Node>> },