This example demonstrates how to integrate Slint UI into a Bevy application.
It shows how to render a Slint component into a Bevy Image (texture) and display it on a 3D quad mesh attached to a rotating cube, complete with mouse interaction handling via raycasting.
- Custom Platform Backend: Implements a
slint::platform::Platformto bridge Slint's windowing to Bevy. - Texture Rendering: Uses Slint's software renderer to draw the UI into a pixel buffer, which is then copied to a Bevy texture.
- Input Forwarding: Raycasts from the camera through the mouse position to detect intersection with the UI quad, then translates hit coordinates to Slint pointer events, enabling interactive UI elements like buttons and sliders.
- 3D Scene Integration: The UI is rendered on a quad mesh attached to a rotating cube, alongside other 3D objects (a cow model).
- Keyboard Controls: Use arrow keys to rotate the cube and observe the UI from different angles.
- Animations: The slider automatically animates to demonstrate Slint's animation system working within Bevy.
- System dependencies for Bevy (see Bevy's setup guide)
cargo run --releaseThe integration consists of a few key parts:
SlintBevyPlatform: A custom implementation ofslint::platform::Platformthat manages window adapters.BevyWindowAdapter: Implementsslint::platform::WindowAdapter. It doesn't create a native OS window but instead maintains a buffer for the software renderer.render_slintSystem: A Bevy system that runs every frame. It triggers the Slint renderer and updates the Bevy image with the new pixel data.handle_inputSystem: Raycasts from the camera through the mouse position, checks for intersection with the UI quad, converts the 3D hit point to UV coordinates, then to Slint's logical coordinates, and dispatches pointer events to the Slint window.
main.rs: Contains the entire example code, including the Slint UI definition (in theslint!macro), the Bevy systems, and the adapter logic.