Some more layout features, align/stretch.

This commit is contained in:
2026-03-25 22:57:58 -04:00
parent cd55cf14c5
commit e2c2563b7e
6 changed files with 115 additions and 13 deletions

View File

@@ -41,7 +41,7 @@ fn CounterApp(title: &'static str) -> impl IntoView {
};
view! {
column(gap = 16.0, padding = 24.0, text_style = text_style) {
column(gap = 16.0, padding = 24.0, align_items = AlignItems::Center, text_style = text_style) {
text(role = TextRole::Heading(1), size = 32.0, weight = FontWeight::Semibold, color = Color::rgba(0, 0, 0, 255)) {
title
}
@@ -51,6 +51,7 @@ fn CounterApp(title: &'static str) -> impl IntoView {
block(
padding = 16.0,
gap = 8.0,
align_self = AlignItems::Stretch,
background = Color::rgba(255, 255, 255, 200),
border_radius = 12.0,
border = Border::new(2.0, Color::rgba(0, 0, 0, 120)),

View File

@@ -68,9 +68,9 @@ pub mod prelude {
view,
};
pub use ruin_ui::{
Border, Color, CursorIcon, Edges, Element, ElementId, InteractionTree, PointerButton,
PointerEventKind, RoutedPointerEvent, RoutedPointerEventKind, ScrollbarStyle,
TextFontFamily, TextStyle, TextWrap, UiSize,
AlignItems, Border, Color, CursorIcon, Edges, Element, ElementId, InteractionTree,
PointerButton, PointerEventKind, RoutedPointerEvent, RoutedPointerEventKind,
ScrollbarStyle, TextFontFamily, TextStyle, TextWrap, UiSize,
};
}

View File

@@ -1,4 +1,4 @@
use ruin_ui::{Color, Element, ElementId};
use ruin_ui::{AlignItems, Color, Element, ElementId};
use crate::context::allocate_element_id;
use crate::converters::{IntoBorder, IntoEdges, IntoShadow};
@@ -82,6 +82,16 @@ impl ContainerProps {
self
}
pub fn align_items(mut self, align: AlignItems) -> Self {
self.element = self.element.align_items(align);
self
}
pub fn align_self(mut self, align: AlignItems) -> Self {
self.element = self.element.align_self(align);
self
}
pub fn shadow(mut self, shadow: impl IntoShadow) -> Self {
self.element = self.element.shadow(shadow.into_shadow());
self
@@ -118,6 +128,16 @@ pub fn block() -> ContainerBuilder {
impl ContainerBuilder {
impl_props_methods!();
pub fn align_items(mut self, align: AlignItems) -> Self {
self.props = self.props.align_items(align);
self
}
pub fn align_self(mut self, align: AlignItems) -> Self {
self.props = self.props.align_self(align);
self
}
pub fn shadow(mut self, shadow: impl IntoShadow) -> Self {
self.props = self.props.shadow(shadow);
self