Create and use a Virtual Joystick in a UI for bevy Game Engine.
Aviable and compatible versions
| bevy | VirtualJoystick |
|---|---|
| 0.13 | 2.2.0 |
| 0.12 | 2.1.0 |
| 0.11 | 2.0.1 |
| 0.10.1 | 1.1.2 |
- Support Mouse and Touch
- Easy usage
- Multiple Joysticks on screen
- Multiple types of joystick behaviour
- Track events on Joystick (Press, Drag and Up)
- Support Axis block (Horizontal, Vertical or Both)
NOTE: To compile android projects you can use cargo-apk or the docker-rust-android project container where you don't have to install or prepare any sdk, for more details see the readme of the mobile projects
| Both (Default) | Horizontal | Vertical |
|---|---|---|
 |
 |
 |
| Fixed | Floating (Default) | Dynamic (TODO: Fix movement feel) |
|---|---|---|
|
 |
 |
- inspect: for world inspect with egui inspector
serde(default): for serialization support for all types (usable for save and load settings)
virtual_joystick = {
version = "*",
default-features = false,
features = [ "inspect", "serde" ]
}Check out the examples for details.
# to run example
cargo run --example simple -F=inspectAdd to Cargo.toml
[dependencies]
bevy = "0.12"
virtual_joystick = "*" # Add your versionThe minimal requirement:
use bevy::prelude::*;
// import crate
use virtual_joystick::*;
// ID for joysticks
#[derive(Default, Reflect, Hash, Clone, PartialEq, Eq)]
enum JoystickControllerID {
#[default]
Joystick1,
Joystick2,
}
#[bevy_main]
fn main() {
App::new()
.add_plugins(DefaultPlugins)
// Add plugin to application
.add_plugin(VirtualJoystickPlugin::<JoystickControllerID>::default())
.run()
}Create Joystick
#[bevy_main]
fn main() {
App::new()
.add_plugins(DefaultPlugins)
// Add plugin to application
.add_plugin(VirtualJoystickPlugin)
// Create system
.add_startup_system(create_scene)
// update System
.add_system(update_player)
.run()
}
fn create_scene(mut cmd: Commands, asset_server: Res<AssetServer>) {
cmd.spawn(Camera2dBundle::default());
cmd.spawn_empty().insert(Player(30.));
// Spawn Virtual Joystick at horizontal center
create_joystick(
&mut cmd,
asset_server.load("Knob.png"),
asset_server.load("Outline.png"),
None,
None,
Some(Color::ORANGE_RED.with_a(0.3)),
Vec2::new(75., 75.),
Vec2::new(150., 150.),
VirtualJoystickNode {
dead_zone: 0.,
id: "UniqueJoystick".to_string(),
axis: VirtualJoystickAxis::Both,
behaviour: VirtualJoystickType::Floating,
},
Style {
width: Val::Px(150.),
height: Val::Px(150.),
position_type: PositionType::Absolute,
left: Val::Percent(50.),
bottom: Val::Percent(15.),
..default()
},
);
}Use variable generated by Joystick
fn update_joystick(
mut joystick: EventReader<VirtualJoystickEvent<String>>,
mut player: Query<(&mut Transform, &Player)>,
time_step: Res<Time>,
) {
// Get player
let (mut player, player_data) = player.single_mut();
// Iter each joystick event
for j in joystick.read() {
let Vec2 { x, y } = j.axis();
// Verify ID of joystick for movement
match j.id() {
JoystickControllerID::Joystick1 => {
// Move player using joystick axis value
player.translation.x += x * player_data.0 * time_step.delta_seconds();
player.translation.y += y * player_data.0 * time_step.delta_seconds();
}
}
}
}- WIP: Add more better documentation
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent