Init

.gitignore

@@ -0,0 +1 @@
+/target

Cargo.toml

@@ -0,0 +1,19 @@
+[package]
+name = "bevy_simple_scroll_view"
+version = "0.1.0"
+edition = "2021"
+
+# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
+
+[dependencies.bevy]
+version = "0.13"
+default-features = false
+features = ["bevy_ui", "bevy_asset", "bevy_text"]
+
+[dev-dependencies.bevy]
+version = "0.13"
+default-features = true
+
+[dev-dependencies]
+bevy_egui = "0.25"
+bevy-inspector-egui = "0.23"

examples/simple.rs

@@ -0,0 +1,75 @@
+use bevy::{input::mouse::MouseMotion, prelude::*, ui::Interaction};
+use bevy_inspector_egui::quick::WorldInspectorPlugin;
+use bevy_simple_scroll_view::*;
+
+const BORDER_COLOR_ACTIVE: Color = Color::rgb(0.75, 0.52, 0.99);
+const BACKGROUND_COLOR: Color = Color::rgb(0.15, 0.15, 0.15);
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins,
+            ScrollViewPlugin,
+            WorldInspectorPlugin::new(),
+        ))
+        .add_systems(Startup, prepare)
+        .add_systems(Update, add_content)
+        .run();
+}
+
+fn prepare(mut commands: Commands) {
+    commands.spawn(Camera2dBundle::default());
+    commands.spawn((
+        NodeBundle {
+            style: Style {
+                width: Val::Percent(100.0),
+                height: Val::Percent(100.0),
+                align_items: AlignItems::Center,
+                justify_content: JustifyContent::Center,
+                ..default()
+            },
+            ..default()
+        },
+        ScrollView,
+    ));
+}
+
+fn add_content(mut commands: Commands, q: Query<Entity, Added<ScrollViewContent>>) {
+    for e in q.iter() {
+        commands.entity(e).with_children(|parent| {
+            for _ in 0..10 {
+                parent.spawn(
+                    (NodeBundle {
+                        style: Style {
+                            width: Val::Px(200.0),
+                            height: Val::Px(200.0),
+                            margin: UiRect::all(Val::Px(5.0)),
+                            border: UiRect::all(Val::Px(5.0)),
+                            padding: UiRect::all(Val::Px(5.0)),
+                            ..default()
+                        },
+                        border_color: BORDER_COLOR_ACTIVE.into(),
+                        background_color: BACKGROUND_COLOR.into(),
+                        ..default()
+                    }),
+                );
+            }
+        });
+    }
+}
+
+fn input_mouse_scroll(
+    mut motion_evr: EventReader<MouseMotion>,
+    mut q: Query<(Entity, &mut Style, &Interaction), With<ScrollViewport>>,
+) {
+    for evt in motion_evr.read() {
+        for (e, mut style, &interaction) in q.iter_mut() {
+            if interaction == Interaction::Hovered {
+                style.top = match style.top {
+                    Val::Px(px) => Val::Px(px + evt.delta.y),
+                    _ => Val::Px(0.0),
+                }
+            }
+        }
+    }
+}

src/lib.rs

@@ -0,0 +1,67 @@
+use bevy::{input::mouse::MouseMotion, prelude::*};
+
+/// A `Plugin` providing the systems and components required to make a ScrollView work.
+pub struct ScrollViewPlugin;
+
+impl Plugin for ScrollViewPlugin {
+    fn build(&self, app: &mut App) {
+        app.register_type::<ScrollView>()
+            .register_type::<ScrollViewport>()
+            .register_type::<ScrollViewContent>()
+            .add_systems(Update, (create_scroll_view, input_mouse_scroll));
+    }
+}
+
+#[derive(Component, Default, Debug, Reflect)]
+pub struct ScrollView;
+
+#[derive(Component, Default, Debug, Reflect)]
+pub struct ScrollViewport;
+
+#[derive(Component, Debug, Reflect)]
+pub struct ScrollViewContent(pub Entity);
+
+pub fn create_scroll_view(mut commands: Commands, q: Query<Entity, Added<ScrollView>>) {
+    for e in q.iter() {
+        commands.entity(e).with_children(|p| {
+            p.spawn((
+                NodeBundle {
+                    style: Style {
+                        overflow: Overflow::clip(),
+                        ..default()
+                    },
+                    ..Default::default()
+                },
+                ScrollViewport,
+            ))
+            .with_children(|v| {
+                v.spawn((
+                    NodeBundle {
+                        style: Style {
+                            flex_direction: bevy::ui::FlexDirection::Column,
+                            ..default()
+                        },
+                        ..default()
+                    },
+                    ScrollViewContent(e.clone()),
+                ));
+            });
+        });
+    }
+}
+
+fn input_mouse_scroll(
+    mut motion_evr: EventReader<MouseMotion>,
+    mut q: Query<(Entity, &mut Style, &Interaction), With<ScrollViewport>>,
+) {
+    for evt in motion_evr.read() {
+        for (e, mut style, &interaction) in q.iter_mut() {
+            if interaction == Interaction::Hovered {
+                style.top = match style.top {
+                    Val::Px(px) => Val::Px(px + evt.delta.y),
+                    _ => Val::Px(0.0),
+                }
+            }
+        }
+    }
+}