diff --git a/README.md b/README.md index 013c40d4d0e6b4866dee90e1d132356ecd4e654d..11775bd35a9a453df12dd6ce64c38487a4ec0612 100644 --- a/README.md +++ b/README.md @@ -20,7 +20,7 @@ Kayak UI is in the very early stages of development. Important features are miss - Basic widget and global state management - Input events (Mouse, Keyboard, Char) - Fast and accurate layouts using morphorm: https://github.com/geom3trik/morphorm -- A few default widgets check out [kayak_widgets](./kayak_widgets)! +- A few default widgets check out [src/widgets](./src/widgets)! - Style system built to kind of mimic CSS styles. - Image and Nine patch rendering. - Vec widgets see vec_widget example! @@ -43,18 +43,13 @@ Kayak UI is in the very early stages of development. Important features are miss <img src="images/screen1.png" alt="Kayak UI" width="600" /> ## Usage -Because bevy's new renderer is not released yet there is no crate on crates.io yet. For now please use the following: +Use bevy 0.6! ```rust -kayak_ui = { git="https://github.com/StarArawn/kayak_ui", rev="{INSERT_COMMIT_SHA_HERE}" } -kayak_widgets = { git="https://github.com/StarArawn/kayak_ui", rev="{INSERT_COMMIT_SHA_HERE}" } -bevy = { git="https://github.com/bevyengine/bevy", rev="{INSERT_COMMIT_SHA_HERE}" } +kayak_ui = { git="https://github.com/StarArawn/kayak_ui", rev="{INSERT_COMMIT_SHA_HERE}", features = ["bevy_renderer"] } +bevy = "0.6.0" ``` -It's also worth mentioning that you will need to use the same bevy revision that this library uses which is currently: `1d0d8a3397bd6fc2c14d42ffd0668d2443748912`. - -This is temporary and will change when bevy 0.6 is released. - ## Declarative Kayak UI makes it painless to build out complex UI's using custom or pre-built widgets. Custom widgets are layed out in a XML like syntax that allows you to more easily visualize the widget tree. Here's an example of that syntax: ```rust @@ -73,7 +68,7 @@ rsx! { You can easily declare your own custom widgets: ```rust #[widget] -pub fn MyCustomWidget(children: Children) { +pub fn MyCustomWidget(props: MyCustomWidgetProps) { rsx! { <> {children} @@ -87,7 +82,7 @@ pub fn MyCustomWidget(children: Children) { Widget's can create their own state and will re-render when that state changes. ```rust #[widget] -fn Counter(context: &mut KayakContext) { +fn Counter() { let (count, set_count, ..) = use_state!(0i32); let on_event = OnEvent::new(move |_, event| match event.event_type { EventType::Click(..) => set_count(count + 1), @@ -111,7 +106,7 @@ fn Counter(context: &mut KayakContext) { Widget's can also access global state and when the global state is bound to the widget it will auto re-render: ```rust #[widget] -fn Counter(context: &mut KayakContext) { +fn Counter() { let global_count = { if let Ok(world) = context.get_global_state::<World>() { if let Some(global_count) = world.get_resource::<Binding<GlobalCount>>() { diff --git a/examples/fold.rs b/examples/fold.rs index 1e0a1bee8d538b5b35bb25d991063ab2e086eb62..880bcd4a87a23a555a1ab0867c9a2aed908f60b9 100644 --- a/examples/fold.rs +++ b/examples/fold.rs @@ -15,7 +15,7 @@ use kayak_ui::{ }; #[widget] -fn FolderTree(props: FolderTreeProps) { +fn FolderTree() { let button_text_styles = Style { width: StyleProp::Value(Units::Stretch(1.0)), height: StyleProp::Value(Units::Pixels(22.0)), diff --git a/examples/hooks.rs b/examples/hooks.rs index 00e294aab7b3335669927cf2917ac37002f2d6a0..d4a25335917f80914decbe4508b6b4a503c98582 100644 --- a/examples/hooks.rs +++ b/examples/hooks.rs @@ -22,7 +22,7 @@ use kayak_ui::{ /// A simple widget that tracks how many times a button is clicked using simple state data #[widget] -fn StateCounter(props: StateCounterProps) { +fn StateCounter() { // On its own, a widget can't track anything, since every value will just be reset when the widget is re-rendered. // To get around this, and keep track of a value, we have to use states. States are values that are kept across renders. // Additionally, anytime a state is updated with a new value, it causes the containing widget to re-render, making it diff --git a/kayak_render_macros/src/widget.rs b/kayak_render_macros/src/widget.rs index 04b65d7984df93e36e1b3d6084aab24deedde35c..fede573ccc3199e60a53a030faada0d2efa5d77b 100644 --- a/kayak_render_macros/src/widget.rs +++ b/kayak_render_macros/src/widget.rs @@ -112,7 +112,7 @@ impl Widget { }; let constructor = quote! { - <#name as kayak_core::Widget>::constructor(#prop_ident) + <#name as #kayak_core::Widget>::constructor(#prop_ident) }; (props, constructor)