Added more clipping stuff.

Cargo.toml

@@ -25,5 +25,5 @@ kayak_font = { path = "kayak_font", optional = true }
 kayak_render_macros = { path = "kayak_render_macros" }
 
 [dev-dependencies]
-bevy = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+bevy = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 kayak_widgets = { path = "kayak_widgets" }

bevy_kayak_ui/Cargo.toml

@@ -5,12 +5,12 @@ edition = "2021"
 
 [dependencies]
 bytemuck = "1.7.2"
-bevy = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+bevy = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 kayak_core = { path = "../kayak_core" }
 kayak_render_macros = { path = "../kayak_render_macros" }
 kayak_font = { path = "../kayak_font" }
 #kayak_font = { path = "../kayak_font" }
-crevice = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+crevice = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 serde = "1.0"
 serde_json = "1.0"
 serde_path_to_error = "0.1"

bevy_kayak_ui/src/camera/camera.rs

 use bevy::{
     prelude::{Bundle, GlobalTransform, Transform},
-    render2::{
+    render::{
         camera::{Camera, CameraProjection, DepthCalculation, WindowOrigin},
         primitives::Frustum,
         view::VisibleEntities,

bevy_kayak_ui/src/camera/mod.rs

 use bevy::{
     prelude::{CoreStage, Plugin},
-    render2::camera::ActiveCameras,
+    render::camera::ActiveCameras,
 };
 
 mod camera;
@@ -17,7 +17,7 @@ impl Plugin for KayakUICameraPlugin {
         active_cameras.add(UICameraBundle::UI_CAMERA);
         app.add_system_to_stage(
             CoreStage::PostUpdate,
-            bevy::render2::camera::camera_system::<UIOrthographicProjection>,
+            bevy::render::camera::camera_system::<UIOrthographicProjection>,
         );
     }
 }

bevy_kayak_ui/src/camera/ortho.rs

@@ -3,7 +3,7 @@ use bevy::prelude::Component;
 use bevy::{
     math::Mat4,
     reflect::Reflect,
-    render2::camera::{CameraProjection, DepthCalculation, ScalingMode, WindowOrigin},
+    render::camera::{CameraProjection, DepthCalculation, ScalingMode, WindowOrigin},
 };
 
 #[derive(Debug, Clone, Component, Reflect)]

bevy_kayak_ui/src/lib.rs

@@ -2,7 +2,7 @@ use bevy::{
     input::{mouse::MouseButtonInput, ElementState},
     math::Vec2,
     prelude::{EventReader, IntoExclusiveSystem, MouseButton, Plugin, Res, World},
-    render2::color::Color,
+    render::color::Color,
     window::{CursorMoved, Windows},
 };
 

bevy_kayak_ui/src/render/mod.rs

 use bevy::{
     core_pipeline::node::MAIN_PASS_DRIVER,
     prelude::{Commands, Plugin, Res},
-    render2::{
+    render::{
         camera::ActiveCameras,
         render_graph::{EmptyNode, RenderGraph, SlotInfo, SlotType},
-        render_phase::{sort_phase_system, DrawFunctions, RenderPhase},
+        render_phase::{DrawFunctions, RenderPhase},
         RenderApp, RenderStage,
     },
 };
@@ -44,8 +44,8 @@ impl Plugin for BevyKayakUIRenderPlugin {
         let render_app = app.sub_app(RenderApp);
         render_app
             .init_resource::<DrawFunctions<TransparentUI>>()
-            .add_system_to_stage(RenderStage::Extract, extract_core_pipeline_camera_phases)
-            .add_system_to_stage(RenderStage::PhaseSort, sort_phase_system::<TransparentUI>);
+            .add_system_to_stage(RenderStage::Extract, extract_core_pipeline_camera_phases);
+        // .add_system_to_stage(RenderStage::PhaseSort, sort_phase_system::<TransparentUI>);
 
         let pass_node_ui = MainPassUINode::new(&mut render_app.world);
         let mut graph = render_app.world.get_resource_mut::<RenderGraph>().unwrap();

bevy_kayak_ui/src/render/ui_pass.rs

 use bevy::core::FloatOrd;
 use bevy::ecs::prelude::*;
-use bevy::render2::render_phase::{DrawFunctionId, PhaseItem};
-use bevy::render2::render_resource::{CachedPipelineId, RenderPassColorAttachment};
-use bevy::render2::{
+use bevy::render::render_phase::{DrawFunctionId, PhaseItem};
+use bevy::render::render_resource::{CachedPipelineId, RenderPassColorAttachment};
+use bevy::render::{
     render_graph::{Node, NodeRunError, RenderGraphContext, SlotInfo, SlotType},
     render_phase::{DrawFunctions, RenderPhase, TrackedRenderPass},
     render_resource::{LoadOp, Operations, RenderPassDescriptor},

bevy_kayak_ui/src/render/ui_pass_driver.rs

 use bevy::ecs::world::World;
-use bevy::render2::{
+use bevy::render::{
     camera::ExtractedCameraNames,
     render_graph::{Node, NodeRunError, RenderGraphContext, SlotValue},
     renderer::RenderContext,

bevy_kayak_ui/src/render/unified/font/extract.rs

 use bevy::{
     math::Vec2,
     prelude::{Assets, Res},
-    sprite2::Rect,
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 use kayak_font::{Alignment, CoordinateSystem, KayakFont};
@@ -39,13 +39,15 @@ pub fn extract_texts(
 
     let font = font.unwrap();
 
+    let line_height = font_size * 1.2;
+
     let chars_layouts = font.get_layout(
         CoordinateSystem::PositiveYDown,
         Alignment::Start,
-        Vec2::new(layout.posx, layout.posy + font_size),
+        Vec2::new(layout.posx, layout.posy + line_height),
         Vec2::new(layout.width, layout.height),
         content,
-        font_size * 1.2,
+        line_height,
         font_size,
     );
 

bevy_kayak_ui/src/render/unified/font/mod.rs

 use bevy::{
     prelude::{Plugin, Res, ResMut},
-    render2::{
+    render::{
         render_asset::RenderAssets,
         renderer::{RenderDevice, RenderQueue},
         texture::Image,

bevy_kayak_ui/src/render/unified/image/extract.rs

-use bevy::{math::Vec2, prelude::Res, render2::color::Color, sprite2::Rect};
+use bevy::{math::Vec2, prelude::Res, render::color::Color, sprite::Rect};
 use kayak_core::render_primitive::RenderPrimitive;
 
 use crate::{

bevy_kayak_ui/src/render/unified/image/image_manager.rs

-use bevy::{prelude::Handle, render2::texture::Image, utils::HashMap};
+use bevy::{prelude::Handle, render::texture::Image, utils::HashMap};
 
 #[derive(Debug, Clone)]
 pub struct ImageManager {

bevy_kayak_ui/src/render/unified/mod.rs

 use bevy::{
+    math::Vec2,
     prelude::{Assets, Commands, HandleUntyped, Plugin, Res},
     reflect::TypeUuid,
-    render2::{
-        render_phase::DrawFunctions, render_resource::Shader, texture::Image, RenderApp,
-        RenderStage,
+    render::{
+        color::Color, render_phase::DrawFunctions, render_resource::Shader, texture::Image,
+        RenderApp, RenderStage,
     },
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 use kayak_font::KayakFont;
@@ -17,7 +19,7 @@ use crate::{
     BevyContext, FontMapping, ImageManager,
 };
 
-use self::pipeline::ImageBindGroups;
+use self::pipeline::{ExtractQuadBundle, ExtractedQuad, ImageBindGroups, UIQuadType};
 
 pub mod font;
 pub mod image;
@@ -93,6 +95,28 @@ pub fn extract(
                     nine_patch::extract_nine_patch(&render_primitive, &image_manager, &images);
                 extracted_quads.extend(nine_patch_quads);
             }
+            RenderPrimitive::Clip { layout } => {
+                // dbg!(&layout);
+                extracted_quads.push(ExtractQuadBundle {
+                    extracted_quad: ExtractedQuad {
+                        rect: Rect {
+                            min: Vec2::new(layout.posx, layout.posy),
+                            max: Vec2::new(layout.posx + layout.width, layout.posy + layout.height),
+                        },
+                        color: Color::default(),
+                        vertex_index: 0,
+                        char_id: 0,
+                        z_index: layout.z_index,
+                        font_handle: None,
+                        quad_type: UIQuadType::Clip,
+                        type_index: 0,
+                        border_radius: (0.0, 0.0, 0.0, 0.0),
+                        image: None,
+                        uv_min: None,
+                        uv_max: None,
+                    },
+                });
+            }
             _ => {}
         }
     }

bevy_kayak_ui/src/render/unified/nine_patch/extract.rs

 use bevy::{
     math::Vec2,
     prelude::{Assets, Res},
-    render2::{color::Color, texture::Image},
-    sprite2::Rect,
+    render::{color::Color, texture::Image},
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 

bevy_kayak_ui/src/render/unified/pipeline.rs

@@ -6,7 +6,7 @@ use bevy::{
     },
     math::{const_vec3, Mat4, Quat, Vec2, Vec3, Vec4},
     prelude::{Bundle, Component, Entity, FromWorld, Handle, Query, Res, ResMut, World},
-    render2::{
+    render::{
         color::Color,
         render_asset::RenderAssets,
         render_phase::{Draw, DrawFunctions, RenderPhase, TrackedRenderPass},
@@ -26,7 +26,7 @@ use bevy::{
         texture::{BevyDefault, GpuImage, Image},
         view::{ViewUniformOffset, ViewUniforms},
     },
-    sprite2::Rect,
+    sprite::Rect,
     utils::HashMap,
 };
 use bytemuck::{Pod, Zeroable};
@@ -255,7 +255,7 @@ impl FromWorld for UnifiedPipeline {
             label: Some("font_texture_array_view"),
             format: Some(TextureFormat::Rgba8UnormSrgb),
             dimension: Some(TextureViewDimension::D2),
-            aspect: bevy::render2::render_resource::TextureAspect::All,
+            aspect: bevy::render::render_resource::TextureAspect::All,
             base_mip_level: 0,
             base_array_layer: 0,
             mip_level_count: None,
@@ -305,6 +305,7 @@ pub enum UIQuadType {
     Quad,
     Text,
     Image,
+    Clip,
 }
 
 #[derive(Debug, Component, Clone)]
@@ -388,7 +389,11 @@ pub fn prepare_quads(
         &render_device,
     );
 
-    for (i, mut extracted_sprite) in extracted_quads.iter_mut().enumerate() {
+    for (i, mut extracted_sprite) in extracted_quads
+        .iter_mut()
+        .filter(|es| es.quad_type != UIQuadType::Clip)
+        .enumerate()
+    {
         let sprite_rect = extracted_sprite.rect;
         let color = extracted_sprite.color.as_linear_rgba_f32();
 
@@ -396,6 +401,7 @@ pub fn prepare_quads(
             UIQuadType::Quad => extracted_sprite.type_index = quad_type_offset,
             UIQuadType::Text => extracted_sprite.type_index = text_type_offset,
             UIQuadType::Image => extracted_sprite.type_index = image_type_offset,
+            UIQuadType::Clip => {}
         };
 
         let uv_min = extracted_sprite.uv_min.unwrap_or(Vec2::ZERO);
@@ -575,6 +581,16 @@ impl Draw<TransparentUI> for DrawUI {
         let view_uniform = views.get(view).unwrap();
         let quad_meta = quad_meta.into_inner();
         let extracted_quad = quads.get(item.entity).unwrap();
+
+        if extracted_quad.quad_type == UIQuadType::Clip {
+            let x = extracted_quad.rect.min.x as u32;
+            let y = extracted_quad.rect.min.y as u32;
+            let width = extracted_quad.rect.width() as u32;
+            let height = extracted_quad.rect.height() as u32;
+            pass.set_scissor_rect(x, y, width, height);
+            return;
+        }
+
         if let Some(pipeline) = pipelines.into_inner().get(item.pipeline) {
             pass.set_render_pipeline(pipeline);
             pass.set_vertex_buffer(0, quad_meta.vertices.buffer().unwrap().slice(..));

bevy_kayak_ui/src/render/unified/quad/extract.rs

-use bevy::{math::Vec2, sprite2::Rect};
+use bevy::{math::Vec2, sprite::Rect};
 use kayak_core::render_primitive::RenderPrimitive;
 
 use crate::{

examples/bevy.rs

@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Res, ResMut},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, UICameraBundle};
 use kayak_ui::core::Index;
@@ -42,6 +42,8 @@ fn startup(
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
+
         rsx! {
             <App styles={Some(styles.clone())}>
                 <Window position={(50.0, 50.0)} size={(300.0, 300.0)} title={"Window 1".to_string()}>
@@ -65,7 +67,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();

examples/clipping.rs

+use bevy::{
+    math::Vec2,
+    prelude::{App as BevyApp, AssetServer, Commands, Handle, Res, ResMut},
+    window::{WindowDescriptor, Windows},
+    DefaultPlugins,
+};
+use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, ImageManager, UICameraBundle};
+use kayak_ui::core::{
+    layout_cache::Space,
+    rsx,
+    styles::{Style, StyleProp, Units},
+    Index,
+};
+use kayak_widgets::{App, Clip, NinePatch, Text};
+
+fn startup(
+    mut commands: Commands,
+    windows: Res<Windows>,
+    asset_server: Res<AssetServer>,
+    mut image_manager: ResMut<ImageManager>,
+    mut font_mapping: ResMut<FontMapping>,
+) {
+    commands.spawn_bundle(UICameraBundle::new());
+
+    let window_size = if let Some(window) = windows.get_primary() {
+        Vec2::new(window.width(), window.height())
+    } else {
+        panic!("Couldn't find primary window!");
+    };
+
+    font_mapping.add(asset_server.load("roboto.kayak_font"));
+
+    let handle: Handle<bevy::render::texture::Image> = asset_server.load("kenny/panel_brown.png");
+    let panel_brown_handle = image_manager.get(&handle);
+
+    let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
+        // Hack to trick the proc macro for right now..
+        let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
+
+        let nine_patch_styles = Style {
+            width: StyleProp::Value(Units::Pixels(512.0)),
+            height: StyleProp::Value(Units::Pixels(512.0)),
+            left: StyleProp::Value(Units::Stretch(1.0)),
+            right: StyleProp::Value(Units::Stretch(1.0)),
+            top: StyleProp::Value(Units::Stretch(1.0)),
+            bottom: StyleProp::Value(Units::Stretch(1.0)),
+            padding_left: StyleProp::Value(Units::Pixels(25.0)),
+            padding_right: StyleProp::Value(Units::Pixels(25.0)),
+            padding_top: StyleProp::Value(Units::Pixels(25.0)),
+            padding_bottom: StyleProp::Value(Units::Pixels(25.0)),
+            ..Style::default()
+        };
+
+        let clip_styles = Style {
+            // padding_left: StyleProp::Value(Units::Pixels(25.0)),
+            // padding_right: StyleProp::Value(Units::Pixels(25.0)),
+            // padding_top: StyleProp::Value(Units::Pixels(15.0)),
+            // padding_bottom: StyleProp::Value(Units::Pixels(125.0)),
+            ..Style::default()
+        };
+
+        let lorem_ipsum = r#"
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed tellus neque. Proin tempus ligula a mi molestie aliquam. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam venenatis consequat ultricies. Sed ac orci purus. Nullam velit nisl, dapibus vel mauris id, dignissim elementum sapien. Vestibulum faucibus sapien ut erat bibendum, id lobortis nisi luctus. Mauris feugiat at lectus at pretium. Pellentesque vitae finibus ante. Nulla non ex neque. Cras varius, lorem facilisis consequat blandit, lorem mauris mollis massa, eget consectetur magna sem vel enim. Nam aliquam risus pulvinar, volutpat leo eget, eleifend urna. Suspendisse in magna sed ligula vehicula volutpat non vitae augue. Phasellus aliquam viverra consequat. Nam rhoncus molestie purus, sed laoreet neque imperdiet eget. Sed egestas metus eget sodales congue.
+
+Sed vel ante placerat, posuere lacus sit amet, tempus enim. Cras ullamcorper ex vitae metus consequat, a blandit leo semper. Nunc lacinia porta massa, a tempus leo laoreet nec. Sed vel metus tincidunt, scelerisque ex sit amet, lacinia dui. In sollicitudin pulvinar odio vitae hendrerit. Maecenas mollis tempor egestas. Nulla facilisi. Praesent nisi turpis, accumsan eu lobortis vestibulum, ultrices id nibh. Suspendisse sed dui porta, mollis elit sed, ornare sem. Cras molestie est libero, quis faucibus leo semper at.
+ 
+Nulla vel nisl rutrum, fringilla elit non, mollis odio. Donec convallis arcu neque, eget venenatis sem mattis nec. Nulla facilisi. Phasellus risus elit, vehicula sit amet risus et, sodales ultrices est. Quisque vulputate felis orci, non tristique leo faucibus in. Duis quis velit urna. Sed rhoncus dolor vel commodo aliquet. In sed tempor quam. Nunc non tempus ipsum. Praesent mi lacus, vehicula eu dolor eu, condimentum venenatis diam. In tristique ligula a ligula dictum, eu dictum lacus consectetur. Proin elementum egestas pharetra. Nunc suscipit dui ac nisl maximus, id congue velit volutpat. Etiam condimentum, mauris ac sodales tristique, est augue accumsan elit, ut luctus est mi ut urna. Mauris commodo, tortor eget gravida lacinia, leo est imperdiet arcu, a ullamcorper dui sapien eget erat.
+
+Vivamus pulvinar dui et elit volutpat hendrerit. Praesent luctus dolor ut rutrum finibus. Fusce ut odio ultrices, laoreet est at, condimentum turpis. Morbi at ultricies nibh. Mauris tempus imperdiet porta. Proin sit amet tincidunt eros. Quisque rutrum lacus ac est vehicula dictum. Pellentesque nec augue mi.
+
+Vestibulum rutrum imperdiet nisl, et consequat massa porttitor vel. Ut velit justo, vehicula a nulla eu, auctor eleifend metus. Ut egestas malesuada metus, sit amet pretium nunc commodo ac. Pellentesque gravida, nisl in faucibus volutpat, libero turpis mattis orci, vitae tincidunt ligula ligula ut tortor. Maecenas vehicula lobortis odio in molestie. Curabitur dictum elit sed arcu dictum, ut semper nunc cursus. Donec semper felis non nisl tincidunt elementum.
+        "#.to_string();
+
+        rsx! {
+            <App styles={Some(styles.clone())}>
+                <NinePatch
+                    styles={Some(nine_patch_styles)}
+                    border={Space {
+                        left: 30.0,
+                        right: 30.0,
+                        top: 30.0,
+                        bottom: 30.0,
+                    }}
+                    handle={panel_brown_handle}
+                >
+                    <Clip styles={Some(clip_styles)}>
+                        <Text content={lorem_ipsum} size={14.0} />
+                    </Clip>
+                </NinePatch>
+            </App>
+        }
+    });
+
+    commands.insert_resource(context);
+}
+
+fn main() {
+    BevyApp::new()
+        .insert_resource(WindowDescriptor {
+            width: 1270.0,
+            height: 720.0,
+            title: String::from("UI Example"),
+            ..Default::default()
+        })
+        .add_plugins(DefaultPlugins)
+        .add_plugin(BevyKayakUIPlugin)
+        .add_startup_system(startup)
+        .run();
+}