feat: use cards for all views in main view

This commit is contained in:
Gabriele Musco 2023-09-12 07:45:33 +02:00
commit 6fa3021424
No known key found for this signature in database
GPG key ID: 1068D795C80E51DE
5 changed files with 55 additions and 121 deletions

View file

@ -0,0 +1,3 @@
.padded {
padding: 18px;
}

View file

@ -70,20 +70,15 @@ impl SimpleComponent for InstallWivrnBox {
gtk::Box { gtk::Box {
set_orientation: gtk::Orientation::Vertical, set_orientation: gtk::Orientation::Vertical,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::selected_profile())"] #[track = "model.changed(Self::selected_profile())"]
set_visible: model.selected_profile.xrservice_type == XRServiceType::Wivrn, set_visible: model.selected_profile.xrservice_type == XRServiceType::Wivrn,
gtk::Separator {
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Label { gtk::Label {
add_css_class: "heading", add_css_class: "heading",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0, set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: "Install WiVRn APK", set_label: "Install WiVRn APK",
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
@ -91,22 +86,18 @@ impl SimpleComponent for InstallWivrnBox {
gtk::Label { gtk::Label {
add_css_class: "dim-label", add_css_class: "dim-label",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: concat!( set_label: concat!(
"Install the WiVRn APK on your standalong Android headset. ", "Install the WiVRn APK on your standalong Android headset. ",
"You will need to enable Developer Mode on your headset, ", "You will need to enable Developer Mode on your headset, ",
"then press the \"Install WiVRn\" button." "then press the \"Install WiVRn\" button."
), ),
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
}, },
gtk::MenuButton { gtk::MenuButton {
add_css_class: "suggested-action", add_css_class: "suggested-action",
set_label: "Install WiVRn", set_label: "Install WiVRn",
set_margin_start: 12,
set_margin_end: 12,
set_halign: gtk::Align::Start, set_halign: gtk::Align::Start,
#[track = "model.changed(Self::install_wivrn_status())"] #[track = "model.changed(Self::install_wivrn_status())"]
set_sensitive: model.install_wivrn_status != InstallWivrnStatus::InProgress, set_sensitive: model.install_wivrn_status != InstallWivrnStatus::InProgress,
@ -114,8 +105,6 @@ impl SimpleComponent for InstallWivrnBox {
}, },
gtk::Label { gtk::Label {
add_css_class: "error", add_css_class: "error",
set_margin_start: 12,
set_margin_end: 12,
set_xalign: 0.0, set_xalign: 0.0,
#[track = "model.changed(Self::install_wivrn_status())"] #[track = "model.changed(Self::install_wivrn_status())"]
set_visible: matches!(&model.install_wivrn_status, InstallWivrnStatus::Done(Some(_))), set_visible: matches!(&model.install_wivrn_status, InstallWivrnStatus::Done(Some(_))),
@ -127,8 +116,6 @@ impl SimpleComponent for InstallWivrnBox {
}, },
gtk::Label { gtk::Label {
add_css_class: "success", add_css_class: "success",
set_margin_start: 12,
set_margin_end: 12,
set_xalign: 0.0, set_xalign: 0.0,
#[track = "model.changed(Self::install_wivrn_status())"] #[track = "model.changed(Self::install_wivrn_status())"]
set_visible: model.install_wivrn_status == InstallWivrnStatus::Success, set_visible: model.install_wivrn_status == InstallWivrnStatus::Success,

View file

@ -17,7 +17,7 @@ use crate::ui::app::{
DebugViewToggleAction, DebugViewToggleAction,
}; };
use crate::ui::profile_editor::ProfileEditorInit; use crate::ui::profile_editor::ProfileEditorInit;
use crate::ui::util::limit_dropdown_width; use crate::ui::util::{limit_dropdown_width, warning_heading};
use crate::xr_devices::XRDevices; use crate::xr_devices::XRDevices;
use gtk::prelude::*; use gtk::prelude::*;
use relm4::adw::traits::MessageDialogExt; use relm4::adw::traits::MessageDialogExt;
@ -151,7 +151,7 @@ impl SimpleComponent for MainView {
set_hexpand: true, set_hexpand: true,
set_vexpand: true, set_vexpand: true,
gtk::Box { gtk::Box {
set_spacing: 12, set_spacing: 6,
set_margin_top: 12, set_margin_top: 12,
set_margin_bottom: 12, set_margin_bottom: 12,
set_orientation: gtk::Orientation::Vertical, set_orientation: gtk::Orientation::Vertical,
@ -195,8 +195,9 @@ impl SimpleComponent for MainView {
set_hexpand: true, set_hexpand: true,
set_vexpand: false, set_vexpand: false,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::selected_profile())"] #[track = "model.changed(Self::selected_profile())"]
set_visible: match mount_has_nosuid(model.selected_profile.prefix.as_str()) { set_visible: match mount_has_nosuid(model.selected_profile.prefix.as_str()) {
Ok(b) => b, Ok(b) => b,
@ -208,26 +209,7 @@ impl SimpleComponent for MainView {
false false
}, },
}, },
gtk::Separator { warning_heading(),
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Box {
set_orientation: gtk::Orientation::Horizontal,
set_margin_start: 12,
set_margin_end: 12,
set_spacing: 12,
set_hexpand: true,
gtk::Image {
set_icon_name: Some("dialog-warning-symbolic"),
add_css_class: "warning",
},
gtk::Label {
add_css_class: "warning",
add_css_class: "heading",
set_label: "Warning"
}
},
gtk::Label { gtk::Label {
set_label: concat!( set_label: concat!(
"Your current prefix is inside a partition ", "Your current prefix is inside a partition ",
@ -236,9 +218,8 @@ impl SimpleComponent for MainView {
"and will cause noticeable stutter when running XR ", "and will cause noticeable stutter when running XR ",
"applications." "applications."
), ),
set_margin_start: 12,
set_margin_end: 12,
add_css_class: "warning", add_css_class: "warning",
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
} }
@ -248,39 +229,20 @@ impl SimpleComponent for MainView {
set_hexpand: true, set_hexpand: true,
set_vexpand: false, set_vexpand: false,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::selected_profile())"] #[track = "model.changed(Self::selected_profile())"]
set_visible: model.selected_profile.lighthouse_driver == LighthouseDriver::SteamVR && !chaperone_info_exists(), set_visible: model.selected_profile.lighthouse_driver == LighthouseDriver::SteamVR && !chaperone_info_exists(),
gtk::Separator { warning_heading(),
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Box {
set_orientation: gtk::Orientation::Horizontal,
set_margin_start: 12,
set_margin_end: 12,
set_spacing: 12,
set_hexpand: true,
gtk::Image {
set_icon_name: Some("dialog-warning-symbolic"),
add_css_class: "warning",
},
gtk::Label {
add_css_class: "warning",
add_css_class: "heading",
set_label: "Warning"
}
},
gtk::Label { gtk::Label {
set_label: concat!( set_label: concat!(
"SteamVR room configuration not found.\n", "SteamVR room configuration not found.\n",
"To use the SteamVR lighthouse driver, you ", "To use the SteamVR lighthouse driver, you ",
"will need to run SteamVR and perform the room setup.", "will need to run SteamVR and perform the room setup.",
), ),
set_margin_start: 12,
set_margin_end: 12,
add_css_class: "warning", add_css_class: "warning",
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
} }
@ -290,34 +252,16 @@ impl SimpleComponent for MainView {
set_hexpand: true, set_hexpand: true,
set_vexpand: false, set_vexpand: false,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::selected_profile())"] #[track = "model.changed(Self::selected_profile())"]
set_visible: match get_amd_gpu_power_profile() { set_visible: match get_amd_gpu_power_profile() {
None => false, None => false,
Some(GpuPowerProfile::VR) => false, Some(GpuPowerProfile::VR) => false,
Some(_) => true, Some(_) => true,
}, },
gtk::Separator { warning_heading(),
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Box {
set_orientation: gtk::Orientation::Horizontal,
set_margin_start: 12,
set_margin_end: 12,
set_spacing: 12,
set_hexpand: true,
gtk::Image {
set_icon_name: Some("dialog-warning-symbolic"),
add_css_class: "warning",
},
gtk::Label {
add_css_class: "warning",
add_css_class: "heading",
set_label: "Warning"
}
},
gtk::Label { gtk::Label {
set_label: concat!( set_label: concat!(
"Your AMD GPU Power Profile is not set to VR. ", "Your AMD GPU Power Profile is not set to VR. ",
@ -325,15 +269,12 @@ impl SimpleComponent for MainView {
"applications. Activate the VR profile witrh the ", "applications. Activate the VR profile witrh the ",
"following command:", "following command:",
), ),
set_margin_start: 12,
set_margin_end: 12,
add_css_class: "warning", add_css_class: "warning",
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
}, },
gtk::Box { gtk::Box {
set_margin_start: 12,
set_margin_end: 12,
set_orientation: gtk::Orientation::Horizontal, set_orientation: gtk::Orientation::Horizontal,
set_spacing: 6, set_spacing: 6,
gtk::ScrolledWindow { gtk::ScrolledWindow {
@ -380,8 +321,6 @@ impl SimpleComponent for MainView {
}, },
}, },
gtk::Button { gtk::Button {
set_margin_start: 12,
set_margin_end: 12,
set_halign: gtk::Align::Start, set_halign: gtk::Align::Start,
set_label: "Refresh", set_label: "Refresh",
connect_clicked[sender, profiles_dropdown] => move |_| { connect_clicked[sender, profiles_dropdown] => move |_| {
@ -396,20 +335,15 @@ impl SimpleComponent for MainView {
set_hexpand: true, set_hexpand: true,
set_vexpand: false, set_vexpand: false,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::selected_profile())"] #[track = "model.changed(Self::selected_profile())"]
set_visible: model.selected_profile.lighthouse_driver == LighthouseDriver::Survive, set_visible: model.selected_profile.lighthouse_driver == LighthouseDriver::Survive,
gtk::Separator {
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Label { gtk::Label {
add_css_class: "heading", add_css_class: "heading",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0, set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: "Libsurvive Calibration", set_label: "Libsurvive Calibration",
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
@ -417,22 +351,18 @@ impl SimpleComponent for MainView {
gtk::Label { gtk::Label {
add_css_class: "dim-label", add_css_class: "dim-label",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: concat!( set_label: concat!(
"Libsurvive needs to import your SteamVR calibration to work ", "Libsurvive needs to import your SteamVR calibration to work ",
"properly. You need to have used SteamVR with this setup ", "properly. You need to have used SteamVR with this setup ",
"before to be able to import its calibration." "before to be able to import its calibration."
), ),
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
}, },
gtk::Button { gtk::Button {
add_css_class: "suggested-action", add_css_class: "suggested-action",
set_label: "Calibrate", set_label: "Calibrate",
set_margin_start: 12,
set_margin_end: 12,
set_halign: gtk::Align::Start, set_halign: gtk::Align::Start,
connect_clicked[sender] => move |_| { connect_clicked[sender] => move |_| {
sender.output(Self::Output::OpenLibsurviveSetup).expect("Sender outut failed"); sender.output(Self::Output::OpenLibsurviveSetup).expect("Sender outut failed");

View file

@ -27,20 +27,15 @@ impl SimpleComponent for SteamLaunchOptionsBox {
set_hexpand: true, set_hexpand: true,
set_vexpand: false, set_vexpand: false,
set_spacing: 12, set_spacing: 12,
set_margin_top: 12, set_margin_all: 12,
set_margin_bottom: 12, add_css_class: "card",
add_css_class: "padded",
#[track = "model.changed(Self::xrservice_active())"] #[track = "model.changed(Self::xrservice_active())"]
set_visible: model.xrservice_active, set_visible: model.xrservice_active,
gtk::Separator {
set_orientation: gtk::Orientation::Horizontal,
set_hexpand: true,
},
gtk::Label { gtk::Label {
add_css_class: "heading", add_css_class: "heading",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0, set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: "Steam Launch Options", set_label: "Steam Launch Options",
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
@ -48,19 +43,15 @@ impl SimpleComponent for SteamLaunchOptionsBox {
gtk::Label { gtk::Label {
add_css_class: "dim-label", add_css_class: "dim-label",
set_hexpand: true, set_hexpand: true,
set_xalign: 0.0,
set_margin_start: 12,
set_margin_end: 12,
set_label: format!( set_label: format!(
"Set this string in the launch options of Steam games, so that they can pick up the {app} runtime correctly", "Set this string in the launch options of Steam games, so that they can pick up the {app} runtime correctly",
app = APP_NAME) app = APP_NAME)
.as_str(), .as_str(),
set_xalign: 0.0,
set_wrap: true, set_wrap: true,
set_wrap_mode: gtk::pango::WrapMode::Word, set_wrap_mode: gtk::pango::WrapMode::Word,
}, },
gtk::Box { gtk::Box {
set_margin_start: 12,
set_margin_end: 12,
set_orientation: gtk::Orientation::Horizontal, set_orientation: gtk::Orientation::Horizontal,
set_spacing: 6, set_spacing: 6,
gtk::ScrolledWindow { gtk::ScrolledWindow {

View file

@ -21,3 +21,26 @@ pub fn limit_dropdown_width(dd: &gtk4::DropDown, chars: i32) {
dd_child = nc; dd_child = nc;
} }
} }
pub fn warning_heading() -> gtk4::Box {
let b = gtk4::Box::builder()
.orientation(gtk4::Orientation::Horizontal)
.spacing(12)
.hexpand(true)
.build();
b.append(
&gtk4::Image::builder()
.css_classes(["warning"])
.icon_name("dialog-warning-symbolic")
.build(),
);
b.append(
&gtk4::Label::builder()
.css_classes(["warning", "heading"])
.label("Warning")
.build(),
);
b
}