# Objective - Test mobile example on real devices ## Solution - Use [BrowserStack](https://www.browserstack.com) to have access to [real devices](https://www.browserstack.com/list-of-browsers-and-platforms/app_automate) - [App Automate](https://www.browserstack.com/app-automate) to run the example - [App Percy](https://www.browserstack.com/app-percy) to compare the screenshot - Added a daily/manual CI job that will build for iOS and Android, send the apps to BrowserStack, run the app on one iOS device and one Android device, capture a screenshot, send it for visual validation, and archive it in the GitHub action Example run: https://github.com/mockersf/bevy/actions/runs/4521883534 They currently have a bug with the settings to view snapshots, they should be public. I'll raise it to them, and if they don't fix it in time it's possible to work around for everyone to view the results through their API. @cart to get this to work, you'll need - to set up an account on BrowserStack - add the secrets `BROWSERSTACK_USERNAME` and `BROWSERSTACK_ACCESS_KEY` to the Bevy repo - create a project in Percy - add the secret `PERCY_TOKEN` to the Bevy repo and modify the project name line 122 in the `Daily.yml` file
160 lines
4.9 KiB
Rust
160 lines
4.9 KiB
Rust
use bevy::{input::touch::TouchPhase, prelude::*, window::WindowMode};
|
|
|
|
// the `bevy_main` proc_macro generates the required boilerplate for iOS and Android
|
|
#[bevy_main]
|
|
fn main() {
|
|
let mut app = App::new();
|
|
app.add_plugins(DefaultPlugins.set(WindowPlugin {
|
|
primary_window: Some(Window {
|
|
resizable: false,
|
|
mode: WindowMode::BorderlessFullscreen,
|
|
..default()
|
|
}),
|
|
..default()
|
|
}))
|
|
.add_systems(Startup, (setup_scene, setup_music))
|
|
.add_systems(Update, (touch_camera, button_handler));
|
|
|
|
// MSAA makes some Android devices panic, this is under investigation
|
|
// https://github.com/bevyengine/bevy/issues/8229
|
|
#[cfg(target_os = "android")]
|
|
app.insert_resource(Msaa::Off);
|
|
|
|
app.run();
|
|
}
|
|
|
|
fn touch_camera(
|
|
windows: Query<&Window>,
|
|
mut touches: EventReader<TouchInput>,
|
|
mut camera: Query<&mut Transform, With<Camera3d>>,
|
|
mut last_position: Local<Option<Vec2>>,
|
|
) {
|
|
let window = windows.single();
|
|
|
|
for touch in touches.iter() {
|
|
if touch.phase == TouchPhase::Started {
|
|
*last_position = None;
|
|
}
|
|
if let Some(last_position) = *last_position {
|
|
let mut transform = camera.single_mut();
|
|
*transform = Transform::from_xyz(
|
|
transform.translation.x
|
|
+ (touch.position.x - last_position.x) / window.width() * 5.0,
|
|
transform.translation.y,
|
|
transform.translation.z
|
|
+ (touch.position.y - last_position.y) / window.height() * 5.0,
|
|
)
|
|
.looking_at(Vec3::ZERO, Vec3::Y);
|
|
}
|
|
*last_position = Some(touch.position);
|
|
}
|
|
}
|
|
|
|
/// set up a simple 3D scene
|
|
fn setup_scene(
|
|
mut commands: Commands,
|
|
mut meshes: ResMut<Assets<Mesh>>,
|
|
mut materials: ResMut<Assets<StandardMaterial>>,
|
|
asset_server: Res<AssetServer>,
|
|
) {
|
|
// plane
|
|
commands.spawn(PbrBundle {
|
|
mesh: meshes.add(shape::Plane::from_size(5.0).into()),
|
|
material: materials.add(Color::rgb(0.1, 0.2, 0.1).into()),
|
|
..default()
|
|
});
|
|
// cube
|
|
commands.spawn(PbrBundle {
|
|
mesh: meshes.add(Mesh::from(shape::Cube { size: 1.0 })),
|
|
material: materials.add(Color::rgb(0.5, 0.4, 0.3).into()),
|
|
transform: Transform::from_xyz(0.0, 0.5, 0.0),
|
|
..default()
|
|
});
|
|
// sphere
|
|
commands.spawn(PbrBundle {
|
|
mesh: meshes.add(
|
|
Mesh::try_from(shape::Icosphere {
|
|
subdivisions: 4,
|
|
radius: 0.5,
|
|
})
|
|
.unwrap(),
|
|
),
|
|
material: materials.add(Color::rgb(0.1, 0.4, 0.8).into()),
|
|
transform: Transform::from_xyz(1.5, 1.5, 1.5),
|
|
..default()
|
|
});
|
|
// light
|
|
commands.spawn(PointLightBundle {
|
|
transform: Transform::from_xyz(4.0, 8.0, 4.0),
|
|
point_light: PointLight {
|
|
intensity: 5000.0,
|
|
// Shadows makes some Android devices segfault, this is under investigation
|
|
// https://github.com/bevyengine/bevy/issues/8214
|
|
#[cfg(not(target_os = "android"))]
|
|
shadows_enabled: true,
|
|
..default()
|
|
},
|
|
..default()
|
|
});
|
|
// camera
|
|
commands.spawn(Camera3dBundle {
|
|
transform: Transform::from_xyz(-2.0, 2.5, 5.0).looking_at(Vec3::ZERO, Vec3::Y),
|
|
..default()
|
|
});
|
|
|
|
// Test ui
|
|
commands
|
|
.spawn(ButtonBundle {
|
|
style: Style {
|
|
justify_content: JustifyContent::Center,
|
|
align_items: AlignItems::Center,
|
|
position_type: PositionType::Absolute,
|
|
left: Val::Px(50.0),
|
|
right: Val::Px(50.0),
|
|
top: Val::Auto,
|
|
bottom: Val::Px(50.0),
|
|
..default()
|
|
},
|
|
..default()
|
|
})
|
|
.with_children(|b| {
|
|
b.spawn(
|
|
TextBundle::from_section(
|
|
"Test Button",
|
|
TextStyle {
|
|
font: asset_server.load("fonts/FiraSans-Bold.ttf"),
|
|
font_size: 30.0,
|
|
color: Color::BLACK,
|
|
},
|
|
)
|
|
.with_text_alignment(TextAlignment::Center),
|
|
);
|
|
});
|
|
}
|
|
|
|
fn button_handler(
|
|
mut interaction_query: Query<
|
|
(&Interaction, &mut BackgroundColor),
|
|
(Changed<Interaction>, With<Button>),
|
|
>,
|
|
) {
|
|
for (interaction, mut color) in &mut interaction_query {
|
|
match *interaction {
|
|
Interaction::Clicked => {
|
|
*color = Color::BLUE.into();
|
|
}
|
|
Interaction::Hovered => {
|
|
*color = Color::GRAY.into();
|
|
}
|
|
Interaction::None => {
|
|
*color = Color::WHITE.into();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
fn setup_music(asset_server: Res<AssetServer>, audio: Res<Audio>) {
|
|
let music = asset_server.load("sounds/Windless Slopes.ogg");
|
|
audio.play(music);
|
|
}
|