WIP: More attributes

This commit is contained in:
JMS55 2023-12-20 22:35:53 -08:00
parent 52b554ddcf
commit b056d7ca06
3 changed files with 124 additions and 47 deletions

View file

@ -31,7 +31,7 @@ fn Editor(cx: Scope) -> Element {
node { node {
width: "100vw", width: "100vw",
height: "100vh", height: "100vh",
justify_content: "space-between", justify_content: "space_between",
SceneTree { selected_entity: selected_entity } SceneTree { selected_entity: selected_entity }
EntityInspector { selected_entity: selected_entity } EntityInspector { selected_entity: selected_entity }
} }
@ -82,7 +82,7 @@ fn SceneTree<'a>(cx: Scope, selected_entity: &'a UseState<Option<Entity>>) -> El
background_color: NEUTRAL_800, background_color: NEUTRAL_800,
text { text {
text: "Spawn Entity", text: "Spawn Entity",
font_size: "18" text_size: "18"
} }
} }
} }
@ -124,7 +124,6 @@ fn EntityInspector<'a>(cx: Scope, selected_entity: &'a UseState<Option<Entity>>)
node { node {
padding: "8", padding: "8",
background_color: NEUTRAL_800, background_color: NEUTRAL_800,
node {
"Component: {name}" "Component: {name}"
} }
} }
@ -133,4 +132,3 @@ fn EntityInspector<'a>(cx: Scope, selected_entity: &'a UseState<Option<Entity>>)
} }
} }
} }
}

View file

@ -362,44 +362,81 @@ fn set_attribute(
background_color: &mut BackgroundColor, background_color: &mut BackgroundColor,
text: Option<&mut Text>, text: Option<&mut Text>,
) { ) {
// TODO: The rest of Style
match (name, value) { match (name, value) {
("display", "flex") => style.display = Display::Flex, ("display", "flex") => style.display = Display::Flex,
("display", "grid") => style.display = Display::Grid, ("display", "grid") => style.display = Display::Grid,
("display", "none") => style.display = Display::None, ("display", "none") => style.display = Display::None,
("position", "relative") => style.position_type = PositionType::Relative, ("position", "relative") => style.position_type = PositionType::Relative,
("position", "absolute") => style.position_type = PositionType::Absolute, ("position", "absolute") => style.position_type = PositionType::Absolute,
("flex-direction", "column") => style.flex_direction = FlexDirection::Column, ("overflow", "visible") => style.overflow = Overflow::visible(),
("background-color", hex) => { ("overflow", "clip") => style.overflow = Overflow::clip(),
("overflow_x", "visible") => style.overflow.x = OverflowAxis::Visible,
("overflow_x", "clip") => style.overflow.x = OverflowAxis::Clip,
("overflow_y", "visible") => style.overflow.y = OverflowAxis::Visible,
("overflow_y", "clip") => style.overflow.y = OverflowAxis::Clip,
("left", val) => style.left = parse_val(val),
("right", val) => style.right = parse_val(val),
("top", val) => style.top = parse_val(val),
("bottom", val) => style.bottom = parse_val(val),
("width", val) => style.width = parse_val(val),
("height", val) => style.height = parse_val(val),
("min_width", val) => style.min_width = parse_val(val),
("min_height", val) => style.min_height = parse_val(val),
("max_width", val) => style.max_width = parse_val(val),
("max_height", val) => style.max_height = parse_val(val),
("aspect_ratio", "none") => style.aspect_ratio = None,
("aspect_ratio", float) => {
style.aspect_ratio = Some(
float
.parse::<f32>()
.unwrap_or_else(|val| panic!("Encountered invalid bevy_dioxus f32 `{val}`.")),
);
}
("align_items", "default") => style.align_items = AlignItems::Default,
("align_items", "start") => style.align_items = AlignItems::Start,
("align_items", "end") => style.align_items = AlignItems::End,
("align_items", "flex_start") => style.align_items = AlignItems::FlexStart,
("align_items", "flex_end") => style.align_items = AlignItems::FlexEnd,
("align_items", "center") => style.align_items = AlignItems::Center,
("align_items", "baseline") => style.align_items = AlignItems::Baseline,
("align_items", "stretch") => style.align_items = AlignItems::Stretch,
// TODO: The rest of the attributes from here on out
("flex_direction", "column") => style.flex_direction = FlexDirection::Column,
("background_color", hex) => {
background_color.0 = Color::hex(hex).expect(&format!( background_color.0 = Color::hex(hex).expect(&format!(
"Encountered invalid bevy_dioxus hex Color `{hex}`." "Encountered invalid bevy_dioxus Color hex `{hex}`."
)); ));
} }
("padding", val) => style.padding = UiRect::all(parse_val(val)), ("padding", val) => style.padding = UiRect::all(parse_val(val)),
("width", val) => style.width = parse_val(val), ("justify_content", "space_between") => {
("height", val) => style.height = parse_val(val),
("justify-content", "space-between") => {
style.justify_content = JustifyContent::SpaceBetween; style.justify_content = JustifyContent::SpaceBetween;
} }
("align-content", "space-between") => style.align_content = AlignContent::SpaceBetween, ("align_content", "space_between") => style.align_content = AlignContent::SpaceBetween,
("text", val) if text.is_some() => text.unwrap().sections[0] = val.into(), ("text", new_text) if text.is_some() => text.unwrap().sections[0] = new_text.into(),
("text-alignment", "left") if text.is_some() => { ("text_direction", "inherit") if text.is_some() => style.direction = Direction::Inherit,
("text_direction", "left_to_right") if text.is_some() => {
style.direction = Direction::LeftToRight;
}
("text_direction", "right_to_left") if text.is_some() => {
style.direction = Direction::RightToLeft;
}
("text_alignment", "left") if text.is_some() => {
text.unwrap().alignment = TextAlignment::Left; text.unwrap().alignment = TextAlignment::Left;
} }
("text-alignment", "center") if text.is_some() => { ("text_alignment", "center") if text.is_some() => {
text.unwrap().alignment = TextAlignment::Center; text.unwrap().alignment = TextAlignment::Center;
} }
("text-alignment", "right") if text.is_some() => { ("text_alignment", "right") if text.is_some() => {
text.unwrap().alignment = TextAlignment::Right; text.unwrap().alignment = TextAlignment::Right;
} }
("font-size", val) if text.is_some() => { ("text_size", val) if text.is_some() => {
text.unwrap().sections[0].style.font_size = val text.unwrap().sections[0].style.font_size = val
.parse::<f32>() .parse::<f32>()
.unwrap_or_else(|val| panic!("Encountered invalid bevy_dioxus f32 `{val}`.")); .unwrap_or_else(|val| panic!("Encountered invalid bevy_dioxus f32 `{val}`."));
} }
("font-color", hex) if text.is_some() => { ("text_color", hex) if text.is_some() => {
text.unwrap().sections[0].style.color = Color::hex(hex).expect(&format!( text.unwrap().sections[0].style.color = Color::hex(hex).expect(&format!(
"Encountered invalid bevy_dioxus hex Color `{hex}`." "Encountered invalid bevy_dioxus Color hex `{hex}`."
)); ));
} }
_ => panic!("Encountered unsupported bevy_dioxus attribute `{name}: {value}`."), _ => panic!("Encountered unsupported bevy_dioxus attribute `{name}: {value}`."),

View file

@ -1,46 +1,88 @@
macro_rules! node_attributes {
() => {
pub const display: AttributeDescription = ("display", None, false);
pub const position: AttributeDescription = ("position", None, false);
pub const overflow: AttributeDescription = ("overflow", None, false);
pub const overflow_x: AttributeDescription = ("overflow_x", None, false);
pub const overflow_y: AttributeDescription = ("overflow_y", None, false);
pub const left: AttributeDescription = ("left", None, false);
pub const right: AttributeDescription = ("right", None, false);
pub const top: AttributeDescription = ("top", None, false);
pub const bottom: AttributeDescription = ("bottom", None, false);
pub const width: AttributeDescription = ("width", None, false);
pub const height: AttributeDescription = ("height", None, false);
pub const min_width: AttributeDescription = ("min_width", None, false);
pub const min_height: AttributeDescription = ("min_height", None, false);
pub const aspect_ratio: AttributeDescription = ("aspect_ratio", None, false);
pub const align_items: AttributeDescription = ("align_items", None, false);
pub const justify_items: AttributeDescription = ("justify_items", None, false);
pub const align_self: AttributeDescription = ("align_self", None, false);
pub const justify_self: AttributeDescription = ("justify_self", None, false);
pub const align_content: AttributeDescription = ("align_content", None, false);
pub const justify_content: AttributeDescription = ("justify_content", None, false);
pub const margin: AttributeDescription = ("margin", None, false);
pub const margin_left: AttributeDescription = ("margin_left", None, false);
pub const margin_right: AttributeDescription = ("margin_right", None, false);
pub const margin_top: AttributeDescription = ("margin_top", None, false);
pub const margin_bottom: AttributeDescription = ("margin_bottom", None, false);
pub const padding: AttributeDescription = ("padding", None, false);
pub const padding_left: AttributeDescription = ("padding_left", None, false);
pub const padding_right: AttributeDescription = ("padding_right", None, false);
pub const padding_top: AttributeDescription = ("padding_top", None, false);
pub const padding_bottom: AttributeDescription = ("padding_bottom", None, false);
pub const border_size: AttributeDescription = ("border_size", None, false);
pub const border_size_left: AttributeDescription = ("border_size_left", None, false);
pub const border_size_right: AttributeDescription = ("border_size_right", None, false);
pub const border_size_top: AttributeDescription = ("border_size_top", None, false);
pub const border_size_bottom: AttributeDescription = ("border_size_bottom", None, false);
pub const border_color: AttributeDescription = ("border_color", None, false);
pub const flex_direction: AttributeDescription = ("flex_direction", None, false);
pub const flex_wrap: AttributeDescription = ("flex_wrap", None, false);
pub const flex_grow: AttributeDescription = ("flex_grow", None, false);
pub const flex_shrink: AttributeDescription = ("flex_shrink", None, false);
pub const flex_basis: AttributeDescription = ("flex_basis", None, false);
pub const row_gap: AttributeDescription = ("row_gap", None, false);
pub const column_gap: AttributeDescription = ("column_gap", None, false);
pub const grid_auto_flow: AttributeDescription = ("grid_auto_flow", None, false);
pub const grid_template_rows: AttributeDescription = ("grid_template_rows", None, false);
pub const grid_template_columns: AttributeDescription =
("grid_template_columns", None, false);
pub const grid_auto_rows: AttributeDescription = ("grid_auto_rows", None, false);
pub const grid_auto_columns: AttributeDescription = ("grid_auto_columns", None, false);
pub const grid_row: AttributeDescription = ("grid_row", None, false);
pub const grid_column: AttributeDescription = ("grid_column", None, false);
pub const background_color: AttributeDescription = ("background_color", None, false);
pub const translation: AttributeDescription = ("translation", None, false);
pub const rotation: AttributeDescription = ("rotation", None, false);
pub const scale: AttributeDescription = ("scale", None, false);
pub const visibility: AttributeDescription = ("visibility", None, false);
pub const z_index: AttributeDescription = ("z_index", None, false);
};
}
#[allow(non_camel_case_types, non_upper_case_globals)] #[allow(non_camel_case_types, non_upper_case_globals)]
pub mod dioxus_elements { pub mod dioxus_elements {
pub use crate::events::events; pub use crate::events::events;
const NAME_SPACE: Option<&'static str> = Some("bevy_ui");
pub type AttributeDescription = (&'static str, Option<&'static str>, bool); pub type AttributeDescription = (&'static str, Option<&'static str>, bool);
const NAME_SPACE: Option<&'static str> = Some("bevy_ui");
pub struct node; pub struct node;
impl node { impl node {
pub const TAG_NAME: &'static str = "node"; pub const TAG_NAME: &'static str = "node";
pub const NAME_SPACE: Option<&'static str> = NAME_SPACE; pub const NAME_SPACE: Option<&'static str> = NAME_SPACE;
node_attributes!();
// TODO: The rest of Style
pub const display: AttributeDescription = ("display", None, false);
pub const position: AttributeDescription = ("position", None, false);
pub const flex_direction: AttributeDescription = ("flex-direction", None, false);
pub const background_color: AttributeDescription = ("background-color", None, false);
pub const padding: AttributeDescription = ("padding", None, false);
pub const width: AttributeDescription = ("width", None, false);
pub const height: AttributeDescription = ("height", None, false);
pub const justify_content: AttributeDescription = ("justify-content", None, false);
pub const align_content: AttributeDescription = ("align-content", None, false);
} }
pub struct text; pub struct text;
impl text { impl text {
pub const TAG_NAME: &'static str = "text"; pub const TAG_NAME: &'static str = "text";
pub const NAME_SPACE: Option<&'static str> = NAME_SPACE; pub const NAME_SPACE: Option<&'static str> = NAME_SPACE;
pub const text: AttributeDescription = ("text", None, false); pub const text: AttributeDescription = ("text", None, false);
pub const text_alignment: AttributeDescription = ("text-alignment", None, false); pub const text_direction: AttributeDescription = ("text_direction", None, false);
pub const font_size: AttributeDescription = ("font-size", None, false); pub const text_alignment: AttributeDescription = ("text_alignment", None, false);
pub const font_color: AttributeDescription = ("font-color", None, false); pub const text_size: AttributeDescription = ("text_size", None, false);
// TODO: The rest of Style pub const text_color: AttributeDescription = ("text_color", None, false);
// TODO: Reduce duplication node_attributes!();
pub const display: AttributeDescription = ("display", None, false);
pub const position: AttributeDescription = ("position", None, false);
pub const flex_direction: AttributeDescription = ("flex-direction", None, false);
pub const background_color: AttributeDescription = ("background-color", None, false);
pub const padding: AttributeDescription = ("padding", None, false);
pub const width: AttributeDescription = ("width", None, false);
pub const height: AttributeDescription = ("height", None, false);
pub const justify_content: AttributeDescription = ("justify-content", None, false);
pub const align_content: AttributeDescription = ("align-content", None, false);
} }
} }