Add Board widget for absolute positioning

masonry/src/widget/mod.rs

@@ -14,6 +14,7 @@ mod widget_state;
 mod tests;
 
 mod align;
+mod board;
 mod button;
 mod checkbox;
 mod flex;
@@ -34,6 +35,7 @@ mod widget_arena;
 
 pub use self::image::Image;
 pub use align::Align;
+pub use board::{Board, BoardParams, ConcreteShape, KurboShape};
 pub use button::Button;
 pub use checkbox::Checkbox;
 pub use flex::{Axis, CrossAxisAlignment, Flex, FlexParams, MainAxisAlignment};

masonry/src/widget/widget_pod.rs

@@ -57,6 +57,33 @@ impl<W: Widget> WidgetPod<W> {
     pub fn id(&self) -> WidgetId {
         self.id
     }
+
+    /// Take the inner widget, if it has not been inserted yet.
+    pub fn inner(self) -> Option<W> {
+        if let WidgetPodInner::Created(w) = self.inner {
+            Some(w)
+        } else {
+            None
+        }
+    }
+
+    /// Get access to the inner widget, if it has not been inserted yet.
+    pub fn as_ref(&self) -> Option<&W> {
+        if let WidgetPodInner::Created(w) = &self.inner {
+            Some(w)
+        } else {
+            None
+        }
+    }
+
+    /// Get access to the inner widget, if it has not been inserted yet.
+    pub fn as_mut(&mut self) -> Option<&mut W> {
+        if let WidgetPodInner::Created(w) = &mut self.inner {
+            Some(w)
+        } else {
+            None
+        }
+    }
 }
 
 impl<W: Widget + 'static> WidgetPod<W> {

xilem/Cargo.toml

@@ -76,7 +76,7 @@ crate-type = ["cdylib"]
 workspace = true
 
 [dependencies]
-xilem_core.workspace = true
+xilem_core = { workspace = true, features = ["kurbo"] }
 masonry.workspace = true
 winit.workspace = true
 tracing.workspace = true

xilem/examples/board.rs

@@ -0,0 +1,78 @@
+// Copyright 2024 the Xilem Authors
+// SPDX-License-Identifier: Apache-2.0
+
+use masonry::{
+    widget::{CrossAxisAlignment, MainAxisAlignment},
+    Size,
+};
+use winit::error::EventLoopError;
+use xilem::view::{
+    board, button, flex, label, Axis, BoardExt, BoardParams, FlexExt as _, FlexSpacer, GraphicsExt,
+};
+use xilem::{Color, EventLoop, WidgetView, Xilem};
+
+struct AppState {
+    buttons: Vec<bool>,
+    clicked: Option<usize>,
+}
+
+impl AppState {
+    fn view(&mut self) -> impl WidgetView<Self> {
+        flex((
+            FlexSpacer::Fixed(30.0),
+            flex((
+                button("B", |state: &mut AppState| state.buttons.push(true)),
+                button("C", |state: &mut AppState| state.buttons.push(false)),
+                button("-", |state: &mut AppState| {
+                    state.buttons.pop();
+                    state.clicked = None;
+                }),
+                label(self.clicked.map_or_else(
+                    || String::from("Nothing has been clicked."),
+                    |i| format!("Button {i} has been clicked."),
+                )),
+            ))
+            .direction(Axis::Horizontal),
+            FlexSpacer::Fixed(10.0),
+            board(
+                self.buttons
+                    .iter()
+                    .copied()
+                    .enumerate()
+                    .map(|(i, is_button)| {
+                        let origin = i as f64 * 15. + 10.;
+                        let size = Size::new(30., 30.);
+                        if is_button {
+                            button(i.to_string(), move |state: &mut AppState| {
+                                state.clicked = Some(i);
+                            })
+                            .positioned(BoardParams::new((origin, origin), size))
+                            .into_any_board()
+                        } else {
+                            vello::kurbo::Circle::new((origin + 15., origin + 15.), 15.)
+                                .fill(Color::NAVY)
+                                .stroke(Color::PAPAYA_WHIP, vello::kurbo::Stroke::new(2.))
+                                .into_any_board()
+                        }
+                    })
+                    .collect::<Vec<_>>(),
+            )
+            .flex(1.),
+        ))
+        .direction(Axis::Vertical)
+        .cross_axis_alignment(CrossAxisAlignment::Center)
+        .main_axis_alignment(MainAxisAlignment::Center)
+    }
+}
+
+fn main() -> Result<(), EventLoopError> {
+    let app = Xilem::new(
+        AppState {
+            buttons: Vec::new(),
+            clicked: None,
+        },
+        AppState::view,
+    );
+    app.run_windowed(EventLoop::with_user_event(), "Board".into())?;
+    Ok(())
+}