From f27c32023170ec8e7f515a910fb776cb79990c77 Mon Sep 17 00:00:00 2001 From: Adalyn Black Date: Fri, 19 Jul 2024 08:57:32 -0700 Subject: [PATCH] feat: rounded corners A proof of concept commit for rounded corners. Currently unoptimized and in need of reorganization too. May also make keyboard keys invisible --- src/gui/canvas/builder.rs | 36 +++++---- src/gui/canvas/control.rs | 157 +++++++++++++++++++++++++++++++++++++- src/gui/canvas/mod.rs | 1 + src/gui/modular/mod.rs | 34 +++++---- src/overlays/keyboard.rs | 4 +- src/overlays/toast.rs | 10 +-- src/res/anchor.yaml | 6 +- src/res/settings.yaml | 112 +++++++++++++-------------- src/res/watch.yaml | 28 +++---- 9 files changed, 276 insertions(+), 112 deletions(-) diff --git a/src/gui/canvas/builder.rs b/src/gui/canvas/builder.rs index 74f1b01..5e98dc0 100644 --- a/src/gui/canvas/builder.rs +++ b/src/gui/canvas/builder.rs @@ -39,22 +39,22 @@ impl CanvasBuilder { } // Creates a panel with bg_color inherited from the canvas - pub fn panel(&mut self, x: f32, y: f32, w: f32, h: f32) -> &mut Control { + pub fn panel(&mut self, x: f32, y: f32, w: f32, h: f32, r: f32) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r }, bg_color: self.bg_color, - on_render_bg: Some(Control::render_rect), + on_render_bg: Some(Control::render_rounded_rect), ..Control::new() }); &mut self.canvas.controls[idx] } // Creates a label with fg_color, font_size inherited from the canvas - pub fn label(&mut self, x: f32, y: f32, w: f32, h: f32, text: Arc) -> &mut Control { + pub fn label(&mut self, x: f32, y: f32, w: f32, h: f32, r: f32, text: Arc) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r }, text, fg_color: self.fg_color, size: self.font_size, @@ -72,11 +72,12 @@ impl CanvasBuilder { y: f32, w: f32, h: f32, + r: f32, text: Arc, ) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r }, text, fg_color: self.fg_color, size: self.font_size, @@ -90,7 +91,7 @@ impl CanvasBuilder { pub fn sprite(&mut self, x: f32, y: f32, w: f32, h: f32) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r: 0. }, on_render_bg: Some(Control::render_sprite_bg), ..Control::new() }); @@ -101,7 +102,7 @@ impl CanvasBuilder { pub fn sprite_interactive(&mut self, x: f32, y: f32, w: f32, h: f32) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r: 0. }, on_render_bg: Some(Control::render_sprite_bg), on_render_hl: Some(Control::render_sprite_hl), ..Control::new() @@ -110,17 +111,17 @@ impl CanvasBuilder { } // Creates a button with fg_color, bg_color, font_size inherited from the canvas - pub fn button(&mut self, x: f32, y: f32, w: f32, h: f32, text: Arc) -> &mut Control { + pub fn button(&mut self, x: f32, y: f32, w: f32, h: f32, r: f32, text: Arc) -> &mut Control { let idx = self.canvas.controls.len(); self.canvas.interactive_set_idx(x, y, w, h, idx); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r }, text, fg_color: self.fg_color, bg_color: self.bg_color, size: self.font_size, - on_render_bg: Some(Control::render_rect), + on_render_bg: Some(Control::render_rounded_rect), on_render_fg: Some(Control::render_text_centered), on_render_hl: Some(Control::render_highlight), ..Control::new() @@ -135,6 +136,7 @@ impl CanvasBuilder { y: f32, w: f32, h: f32, + r: f32, cap_type: KeyCapType, label: &[String], ) -> &mut Control { @@ -142,9 +144,9 @@ impl CanvasBuilder { self.canvas.interactive_set_idx(x, y, w, h, idx); self.canvas.controls.push(Control { - rect: Rect { x, y, w, h }, + rect: Rect { x, y, w, h, r }, bg_color: self.bg_color, - on_render_bg: Some(Control::render_rect), + on_render_bg: Some(Control::render_rounded_rect), on_render_hl: Some(Control::render_highlight), ..Control::new() }); @@ -157,6 +159,7 @@ impl CanvasBuilder { y, w, h: h - self.font_size as f32, + r: 0., }; vec![(render, rect, 1f32)] } @@ -167,12 +170,14 @@ impl CanvasBuilder { y: y + (self.font_size as f32) + 12., w, h, + r: 0., }; let rect1 = Rect { x: x + w * 0.5 + 12., y: y + h - (self.font_size as f32) + 8., w, h, + r: 0., }; vec![(render, rect0, 1.0), (render, rect1, 0.8)] } @@ -183,12 +188,14 @@ impl CanvasBuilder { y: y + 2.0, w, h: h * 0.5, + r: 0., }; let rect1 = Rect { x, y: y + h * 0.5 + 2.0, w, h: h * 0.5, + r: 0., }; vec![(render, rect1, 1.0), (render, rect0, 0.8)] } @@ -199,18 +206,21 @@ impl CanvasBuilder { y: y + (self.font_size as f32) + 8., w, h, + r: 0., }; let rect1 = Rect { x: x + 12., y: y + h - (self.font_size as f32) + 4., w, h, + r: 0., }; let rect2 = Rect { x: x + w * 0.5 + 8., y: y + h - (self.font_size as f32) + 4., w, h, + r: 0., }; vec![ (render, rect1, 1.0), diff --git a/src/gui/canvas/control.rs b/src/gui/canvas/control.rs index b294329..1556966 100644 --- a/src/gui/canvas/control.rs +++ b/src/gui/canvas/control.rs @@ -1,9 +1,12 @@ use glam::Vec4; -use std::sync::Arc; -use vulkano::image::view::ImageView; +use std::{sync::Arc, f32::consts::PI}; +use vulkano::{ + buffer::{Buffer, BufferUsage, BufferCreateInfo}, + image::view::ImageView, + memory::allocator::{AllocationCreateInfo, MemoryTypeFilter}}; use crate::{ - backend::input::PointerMode, graphics::WlxCommandBuffer, gui::GuiColor, state::AppState, + backend::input::PointerMode, graphics::{WlxCommandBuffer, Vert2Uv}, gui::GuiColor, state::AppState, }; use super::{CanvasData, Rect}; @@ -49,6 +52,7 @@ impl Control { y: 0., w: 0., h: 0., + r: 0., }, fg_color: Vec4::ONE, bg_color: Vec4::ZERO, @@ -102,6 +106,153 @@ impl Control { self.dirty = true; } + pub fn render_rounded_rect( + &self, + canvas: &CanvasData, + _: &mut AppState, + cmd_buffer: &mut WlxCommandBuffer, + ) -> anyhow::Result<()> { + let pass = { + let r = self.rect.r.min(self.rect.w / 2.0).min(self.rect.h / 2.0); + let rw = r / canvas.width as f32; + let ruw = r / self.rect.w as f32; + let rh = r / canvas.height as f32; + let ruh = r / self.rect.h as f32; + + let x0 = self.rect.x / canvas.width as f32 + rw; + let y0 = self.rect.y / canvas.height as f32 + rh; + + let x1 = self.rect.w / canvas.width as f32 + x0 - rw - rw; + let y1 = self.rect.h / canvas.height as f32 + y0 - rh - rh; + + let pi6s = (PI/6.).sin(); + let pi6c = (PI/6.).cos(); + let pi3s = (PI/3.).sin(); + let pi3c = (PI/3.).cos(); + + let vertices = [ + // Top Left Corner (0-3) + Vert2Uv { + in_pos: [x0 - rw, y0], + in_uv: [0.0, ruh], + }, + Vert2Uv { + in_pos: [x0 - rw * pi6c, y0 - rh * pi6s], + in_uv: [ruw - ruw * pi6c, ruh - ruh * pi6s], + }, + Vert2Uv { + in_pos: [x0 - rw * pi3c, y0 - rh * pi3s], + in_uv: [ruw - ruw * pi3c, ruh - ruh * pi3s], + }, + Vert2Uv { + in_pos: [x0, y0 - rh], + in_uv: [ruw, 0.0], + }, + + // Top Right Corner (4-7) + Vert2Uv { + in_pos: [x1, y0 - rh], + in_uv: [1.0 - ruw, 0.0], + }, + Vert2Uv { + in_pos: [x1 + rw * pi3c, y0 - rh * pi3s], + in_uv: [1.0 - ruw + ruw * pi3c, ruh - ruh * pi3s], + }, + Vert2Uv { + in_pos: [x1 + rw * pi6c, y0 - rh * pi6s], + in_uv: [1.0 - ruw + ruw * pi6c, ruh - ruh * pi6s], + }, + Vert2Uv { + in_pos: [x1 + rw, y0], + in_uv: [1.0, ruh], + }, + + // Bottom Right Corner (8-11) + Vert2Uv { + in_pos: [x1 + rw, y1], + in_uv: [1.0, 1.0 - ruh], + }, + Vert2Uv { + in_pos: [x1 + rw * pi6c, y1 + rh * pi6s], + in_uv: [1.0 - ruw + ruw * pi6c, 1.0 - ruh + ruh * pi6s], + }, + Vert2Uv { + in_pos: [x1 + rw * pi3c, y1 + rh * pi3s], + in_uv: [1.0 - ruw + ruw * pi3c, 1.0 - ruh + ruh * pi3s], + }, + Vert2Uv { + in_pos: [x1, y1 + rh], + in_uv: [1.0 - ruw, 1.0], + }, + + // Bottom Left Corner (12-15) + Vert2Uv { + in_pos: [x0, y1 + rh], + in_uv: [ruw, 1.0], + }, + Vert2Uv { + in_pos: [x0 - rw * pi3c, y1 + rh * pi3s], + in_uv: [ruw - ruw * pi3c, 1.0 - ruh + ruh * pi3s], + }, + Vert2Uv { + in_pos: [x0 - rw * pi6c, y1 + rh * pi6s], + in_uv: [ruw - ruw * pi6c, 1.0 - ruh + ruh * pi6s], + }, + Vert2Uv { + in_pos: [x0 - rw, y1], + in_uv: [0.0, 1.0 - ruh], + }, + ]; + + let mut vertex_string = String::from("["); + for vertex in vertices.iter() { + vertex_string.push('('); + vertex_string.push_str(&vertex.in_uv[0].to_string()); + vertex_string.push(','); + vertex_string.push_str(&vertex.in_uv[1].to_string()); + vertex_string.push_str("),"); + } + vertex_string.push(']'); + //log::info!("{}", vertex_string); + + let vertex_buffer = canvas.graphics.upload_buffer(BufferUsage::VERTEX_BUFFER, vertices.iter())?; + + let set0 = canvas + .pipeline_bg_color + .uniform_buffer(0, self.bg_color.to_array().to_vec())?; + + let indices: [u16; 42] = + [0,1,15, 14,15,1 + ,1,2,14, 13,14,2 + ,2,3,13, 12,13,3 + ,3,4,12, 11,12,4 + ,4,5,11, 10,12,5 + ,5,6,10, 9,10,6 + ,6,7,9, 8, 9,7]; + + canvas.pipeline_bg_color.create_pass( + [canvas.width as _, canvas.height as _], + vertex_buffer, + Buffer::from_iter( + canvas.graphics.memory_allocator.clone(), + BufferCreateInfo { + usage: BufferUsage::INDEX_BUFFER, + ..Default::default() + }, + AllocationCreateInfo { + memory_type_filter: MemoryTypeFilter::PREFER_DEVICE + | MemoryTypeFilter::HOST_SEQUENTIAL_WRITE, + ..Default::default() + }, + indices.iter().cloned(), + )?, + vec![set0], + )? + }; + + cmd_buffer.run_ref(&pass) + } + pub(super) fn render_rect( &self, canvas: &CanvasData, diff --git a/src/gui/canvas/mod.rs b/src/gui/canvas/mod.rs index 00107fa..2a2cbfa 100644 --- a/src/gui/canvas/mod.rs +++ b/src/gui/canvas/mod.rs @@ -26,6 +26,7 @@ pub struct Rect { y: f32, w: f32, h: f32, + r: f32, } pub struct CanvasData { diff --git a/src/gui/modular/mod.rs b/src/gui/modular/mod.rs index d3eaa25..9c92bf8 100644 --- a/src/gui/modular/mod.rs +++ b/src/gui/modular/mod.rs @@ -53,18 +53,18 @@ pub struct OverlayListTemplate { #[serde(tag = "type")] pub enum ModularElement { Panel { - rect: [f32; 4], + rect: [f32; 5], bg_color: Arc, }, Label { - rect: [f32; 4], + rect: [f32; 5], font_size: isize, fg_color: Arc, #[serde(flatten)] data: LabelContent, }, CenteredLabel { - rect: [f32; 4], + rect: [f32; 5], font_size: isize, fg_color: Arc, #[serde(flatten)] @@ -76,7 +76,7 @@ pub enum ModularElement { sprite_st: Option<[f32; 4]>, }, Button { - rect: [f32; 4], + rect: [f32; 5], font_size: isize, fg_color: Arc, bg_color: Arc, @@ -86,7 +86,7 @@ pub enum ModularElement { }, /// Convenience type to save you from having to create a bunch of labels BatteryList { - rect: [f32; 4], + rect: [f32; 5], font_size: isize, fg_color: Arc, fg_color_low: Arc, @@ -96,7 +96,7 @@ pub enum ModularElement { layout: ListLayout, }, OverlayList { - rect: [f32; 4], + rect: [f32; 5], font_size: isize, fg_color: Arc, bg_color: Arc, @@ -139,32 +139,32 @@ pub fn modular_canvas( for elem in elements.iter() { match elem { ModularElement::Panel { - rect: [x, y, w, h], + rect: [x, y, w, h, r], bg_color, } => { canvas.bg_color = color_parse(bg_color).unwrap_or(*FALLBACK_COLOR); - canvas.panel(*x, *y, *w, *h); + canvas.panel(*x, *y, *w, *h, *r); } ModularElement::Label { - rect: [x, y, w, h], + rect: [x, y, w, h, r], font_size, fg_color, data, } => { canvas.font_size = *font_size; canvas.fg_color = color_parse(fg_color).unwrap_or(*FALLBACK_COLOR); - let label = canvas.label(*x, *y, *w, *h, empty_str.clone()); + let label = canvas.label(*x, *y, *w, *h, *r, empty_str.clone()); modular_label_init(label, data); } ModularElement::CenteredLabel { - rect: [x, y, w, h], + rect: [x, y, w, h, r], font_size, fg_color, data, } => { canvas.font_size = *font_size; canvas.fg_color = color_parse(fg_color).unwrap_or(*FALLBACK_COLOR); - let label = canvas.label_centered(*x, *y, *w, *h, empty_str.clone()); + let label = canvas.label_centered(*x, *y, *w, *h, *r, empty_str.clone()); modular_label_init(label, data); } ModularElement::Sprite { @@ -187,7 +187,7 @@ pub fn modular_canvas( } }, ModularElement::Button { - rect: [x, y, w, h], + rect: [x, y, w, h, r], font_size, bg_color, fg_color, @@ -197,11 +197,11 @@ pub fn modular_canvas( canvas.bg_color = color_parse(bg_color).unwrap_or(*FALLBACK_COLOR); canvas.fg_color = color_parse(fg_color).unwrap_or(*FALLBACK_COLOR); canvas.font_size = *font_size; - let button = canvas.button(*x, *y, *w, *h, text.clone()); + let button = canvas.button(*x, *y, *w, *h, *r, text.clone()); modular_button_init(button, data); } ModularElement::BatteryList { - rect: [x, y, w, h], + rect: [x, y, w, h, r], font_size, fg_color, fg_color_low, @@ -229,6 +229,7 @@ pub fn modular_canvas( button_y + 2., button_w - 4., button_h - 4., + *r, empty_str.clone(), ); modular_label_init( @@ -252,7 +253,7 @@ pub fn modular_canvas( } } ModularElement::OverlayList { - rect: [x, y, w, h], + rect: [x, y, w, h, r], font_size, fg_color, bg_color, @@ -277,6 +278,7 @@ pub fn modular_canvas( button_y + 2., button_w - 4., button_h - 4., + *r, screen.name.clone(), ); diff --git a/src/overlays/keyboard.rs b/src/overlays/keyboard.rs index 0569fe1..c68475a 100644 --- a/src/overlays/keyboard.rs +++ b/src/overlays/keyboard.rs @@ -57,7 +57,7 @@ where )?; canvas.bg_color = color_parse("#101010").unwrap(); //safe - canvas.panel(0., 0., size.x, size.y); + canvas.panel(0., 0., size.x, size.y, 5.); canvas.font_size = 18; canvas.bg_color = color_parse("#202020").unwrap(); //safe @@ -146,7 +146,7 @@ where if label.is_empty() { label = LAYOUT.label_for_key(key); } - let button = canvas.key_button(x, y, w, h, cap_type, &label); + let button = canvas.key_button(x, y, w, h, 0., cap_type, &label); button.state = Some(state); button.on_press = Some(key_press); button.on_release = Some(key_release); diff --git a/src/overlays/toast.rs b/src/overlays/toast.rs index 01f59af..0e69c60 100644 --- a/src/overlays/toast.rs +++ b/src/overlays/toast.rs @@ -180,17 +180,17 @@ fn new_toast(toast: Toast, app: &mut AppState) -> Option<(OverlayState, Box 0 { - canvas.label(PADDING.0, 54., og_width, size.1 - 54., toast.body); + canvas.label(PADDING.0, 54., og_width, size.1 - 54., 3., toast.body); canvas.fg_color = color_parse("#101010").unwrap(); // want panic canvas.bg_color = color_parse("#666666").unwrap(); // want panic - canvas.panel(0., 0., size.0, 30.); - canvas.label_centered(PADDING.0, 16., og_width, FONT_SIZE as f32 + 2., title); + canvas.panel(0., 0., size.0, 30., 3.); + canvas.label_centered(PADDING.0, 16., og_width, FONT_SIZE as f32 + 2., 3., title); } else { - canvas.label_centered(PADDING.0, 0., og_width, size.1, title); + canvas.label_centered(PADDING.0, 0., og_width, size.1, 3., title); } let state = OverlayState { diff --git a/src/res/anchor.yaml b/src/res/anchor.yaml index d48068e..0fcc652 100644 --- a/src/res/anchor.yaml +++ b/src/res/anchor.yaml @@ -11,15 +11,15 @@ spawn_pos: [0, 0, -1] elements: - type: Panel - rect: [98, 0, 4, 200] + rect: [98, 0, 4, 200, 2] bg_color: "#ffff00" - type: Panel - rect: [0, 98, 200, 4] + rect: [0, 98, 200, 4, 2] bg_color: "#ffff00" - type: Label - rect: [8, 90, 600, 70] + rect: [8, 90, 600, 70, 2] font_size: 18 fg_color: "#ffff00" source: Static diff --git a/src/res/settings.yaml b/src/res/settings.yaml index cdb7ca0..749367f 100644 --- a/src/res/settings.yaml +++ b/src/res/settings.yaml @@ -11,18 +11,18 @@ spawn_pos: [0, -0.1, -0.5] elements: - type: Panel - rect: [0, 0, 600, 800] + rect: [0, 0, 600, 800, 2] bg_color: "#102030" - type: Label - rect: [15, 35, 600, 70] + rect: [15, 35, 600, 70, 2] font_size: 24 fg_color: "#ffffff" source: Static text: Settings - type: Button - rect: [560, 0, 40, 40] + rect: [560, 0, 40, 40, 2] font_size: 16 bg_color: "#880000" fg_color: "#ffffff" @@ -33,31 +33,31 @@ elements: action: Destroy - type: Panel - rect: [50, 53, 500, 1] + rect: [50, 53, 500, 1, 2] bg_color: "#c0c0c0" ####### Watch Section ####### - type: Label - rect: [15, 85, 570, 24] + rect: [15, 85, 570, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Watch - type: Panel - rect: [250, 105, 1, 100] + rect: [250, 105, 1, 100, 2] bg_color: "#c0c0c0" - type: Label - rect: [288, 105, 100, 24] + rect: [288, 105, 100, 24, 2] font_size: 12 fg_color: "#ffffff" source: Static text: Visibility - type: Button - rect: [270, 120, 100, 30] + rect: [270, 120, 100, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -67,7 +67,7 @@ elements: action: Hide - type: Button - rect: [270, 170, 100, 30] + rect: [270, 170, 100, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -77,18 +77,18 @@ elements: action: SwitchHands - type: Panel - rect: [390, 105, 1, 100] + rect: [390, 105, 1, 100, 2] bg_color: "#c0c0c0" - type: Label - rect: [430, 105, 120, 24] + rect: [430, 105, 120, 24, 2] font_size: 12 fg_color: "#ffffff" source: Static text: Watch Fade - type: Button - rect: [410, 120, 140, 30] + rect: [410, 120, 140, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -106,7 +106,7 @@ elements: ViewAngle: {kind: "MaxOpacity", delta: -0.01} - type: Button - rect: [410, 170, 140, 30] + rect: [410, 170, 140, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -124,14 +124,14 @@ elements: ViewAngle: {kind: "MinOpacity", delta: -0.01} - type: Label - rect: [25, 140, 90, 30] + rect: [25, 140, 90, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: Rotation - type: Button - rect: [108, 120, 30, 30] + rect: [108, 120, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -149,7 +149,7 @@ elements: Rotation: {axis: "X", delta: -0.25} - type: Button - rect: [153, 120, 30, 30] + rect: [153, 120, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -167,7 +167,7 @@ elements: Rotation: {axis: "Y", delta: -0.25} - type: Button - rect: [198, 120, 30, 30] + rect: [198, 120, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -185,14 +185,14 @@ elements: Rotation: {axis: "Z", delta: -0.25} - type: Label - rect: [25, 190, 90, 30] + rect: [25, 190, 90, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: Position - type: Button - rect: [108, 170, 30, 30] + rect: [108, 170, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -210,7 +210,7 @@ elements: Position: {axis: "X", delta: -0.001} - type: Button - rect: [153, 170, 30, 30] + rect: [153, 170, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -228,7 +228,7 @@ elements: Position: {axis: "Y", delta: -0.001} - type: Button - rect: [198, 170, 30, 30] + rect: [198, 170, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#306060" @@ -246,26 +246,26 @@ elements: Position: {axis: "Z", delta: -0.001} - type: Panel - rect: [50, 220, 500, 1] + rect: [50, 220, 500, 1, 2] bg_color: "#c0c0c0" ####### Mirror Section ####### - type: Label - rect: [15, 255, 570, 24] + rect: [15, 255, 570, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Mirrors - type: Label - rect: [25, 290, 30, 30] + rect: [25, 290, 30, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: M1 - type: Button - rect: [60, 270, 110, 30] + rect: [60, 270, 110, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -279,7 +279,7 @@ elements: action: ShowMirror # only fires if not exists - type: Button - rect: [185, 270, 60, 30] + rect: [185, 270, 60, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -290,7 +290,7 @@ elements: action: ToggleInteraction - type: Button - rect: [258, 270, 30, 30] + rect: [258, 270, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#880000" @@ -301,14 +301,14 @@ elements: action: Destroy - type: Label - rect: [25, 340, 30, 30] + rect: [25, 340, 30, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: M2 - type: Button - rect: [60, 320, 110, 30] + rect: [60, 320, 110, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -322,7 +322,7 @@ elements: action: ShowMirror - type: Button - rect: [185, 320, 60, 30] + rect: [185, 320, 60, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -333,7 +333,7 @@ elements: action: ToggleInteraction - type: Button - rect: [258, 320, 30, 30] + rect: [258, 320, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#880000" @@ -344,14 +344,14 @@ elements: action: Destroy - type: Label - rect: [25, 390, 30, 30] + rect: [25, 390, 30, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: M3 - type: Button - rect: [60, 370, 110, 30] + rect: [60, 370, 110, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -365,7 +365,7 @@ elements: action: ShowMirror - type: Button - rect: [185, 370, 60, 30] + rect: [185, 370, 60, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -376,7 +376,7 @@ elements: action: ToggleInteraction - type: Button - rect: [258, 370, 30, 30] + rect: [258, 370, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#880000" @@ -387,27 +387,27 @@ elements: action: Destroy - type: Panel - rect: [300, 240, 1, 200] + rect: [300, 240, 1, 200, 2] bg_color: "#c0c0c0" ####### Color Gain Section ####### - type: Label - rect: [325, 255, 90, 24] + rect: [325, 255, 90, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Color Gain - type: Label - rect: [470, 255, 90, 30] + rect: [470, 255, 90, 30, 2] font_size: 12 fg_color: "#ffffff" source: Static text: (SteamVR) - type: Button - rect: [330, 270, 60, 30] + rect: [330, 270, 60, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#707070" @@ -425,7 +425,7 @@ elements: delta: -0.01 - type: Button - rect: [405, 270, 30, 30] + rect: [405, 270, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#701010" @@ -443,7 +443,7 @@ elements: delta: -0.01 - type: Button - rect: [450, 270, 30, 30] + rect: [450, 270, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#107010" @@ -461,7 +461,7 @@ elements: delta: -0.01 - type: Button - rect: [495, 270, 30, 30] + rect: [495, 270, 30, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#101070" @@ -479,20 +479,20 @@ elements: delta: -0.01 - type: Panel - rect: [325, 315, 225, 1] + rect: [325, 315, 225, 1, 2] bg_color: "#c0c0c0" ####### Playspace Section ####### - type: Label - rect: [325, 345, 90, 24] + rect: [325, 345, 90, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Playspace - type: Button - rect: [330, 360, 220, 30] + rect: [330, 360, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#206060" @@ -502,7 +502,7 @@ elements: action: PlayspaceFixFloor - type: Button - rect: [330, 410, 220, 30] + rect: [330, 410, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#206060" @@ -514,18 +514,18 @@ elements: ####### Notifications Section ####### - type: Panel - rect: [50, 460, 500, 1] + rect: [50, 460, 500, 1, 2] bg_color: "#c0c0c0" - type: Label - rect: [325, 490, 90, 24] + rect: [325, 490, 90, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Notifications - type: Button - rect: [330, 505, 220, 30] + rect: [330, 505, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#401010" @@ -536,7 +536,7 @@ elements: highlight: Notifications - type: Button - rect: [330, 555, 220, 30] + rect: [330, 555, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#401010" @@ -548,14 +548,14 @@ elements: ####### Behavior Section ####### - type: Label - rect: [15, 490, 570, 24] + rect: [15, 490, 570, 24, 2] font_size: 18 fg_color: "#ffffff" source: Static text: Behavior - type: Button - rect: [30, 505, 220, 30] + rect: [30, 505, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#401010" @@ -566,7 +566,7 @@ elements: highlight: AutoRealign - type: Button - rect: [30, 555, 220, 30] + rect: [30, 555, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#401010" @@ -579,11 +579,11 @@ elements: ####### Footer Section ####### - type: Panel - rect: [50, 605, 500, 1] + rect: [50, 605, 500, 1, 2] bg_color: "#c0c0c0" - type: Button - rect: [330, 625, 220, 30] + rect: [330, 625, 220, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#206060" @@ -595,7 +595,7 @@ elements: message: Settings saved successfully. - type: Button - rect: [30, 625, 250, 30] + rect: [30, 625, 250, 30, 2] font_size: 12 fg_color: "#ffffff" bg_color: "#206060" diff --git a/src/res/watch.yaml b/src/res/watch.yaml index 1958140..2e24a2a 100644 --- a/src/res/watch.yaml +++ b/src/res/watch.yaml @@ -9,11 +9,11 @@ size: [400, 200] elements: # background panel - type: Panel - rect: [0, 0, 400, 200] + rect: [0, 0, 400, 200, 3] bg_color: "#353535" - type: Button - rect: [2, 162, 26, 36] + rect: [2, 162, 26, 36, 3] font_size: 14 bg_color: "#808040" fg_color: "#ffffff" @@ -28,7 +28,7 @@ elements: # Keyboard button - type: Button - rect: [32, 162, 60, 36] + rect: [32, 162, 60, 36, 3] font_size: 14 fg_color: "#FFFFFF" bg_color: "#406050" @@ -62,7 +62,7 @@ elements: # bottom row, of keyboard + overlays - type: OverlayList - rect: [94, 160, 306, 40] + rect: [94, 160, 306, 40, 3] font_size: 14 fg_color: "#FFFFFF" bg_color: "#405060" @@ -78,7 +78,7 @@ elements: # local clock - type: Label - rect: [19, 90, 200, 50] + rect: [19, 90, 200, 50, 3] font_size: 46 # Use 32 for 12-hour time fg_color: "#ffffff" source: Clock @@ -87,7 +87,7 @@ elements: # local date - type: Label - rect: [20, 117, 200, 20] + rect: [20, 117, 200, 20, 3] font_size: 14 fg_color: "#ffffff" source: Clock @@ -95,7 +95,7 @@ elements: # local day-of-week - type: Label - rect: [20, 137, 200, 50] + rect: [20, 137, 200, 50, 3] font_size: 14 fg_color: "#ffffff" source: Clock @@ -104,7 +104,7 @@ elements: # alt clock 1 - type: Label - rect: [210, 90, 200, 50] + rect: [210, 90, 200, 50, 3] font_size: 24 # Use 18 for 12-hour time fg_color: "#99BBAA" source: Clock @@ -112,7 +112,7 @@ elements: format: "%H:%M" # 23:59 #format: "%I:%M %p" # 11:59 PM - type: Label - rect: [210, 60, 200, 50] + rect: [210, 60, 200, 50, 3] font_size: 14 fg_color: "#99BBAA" source: Static @@ -120,7 +120,7 @@ elements: # alt clock 2 - type: Label - rect: [210, 150, 200, 50] + rect: [210, 150, 200, 50, 3] font_size: 24 # Use 18 for 12-hour time fg_color: "#AA99BB" source: Clock @@ -128,7 +128,7 @@ elements: format: "%H:%M" # 23:59 #format: "%I:%M %p" # 11:59 PM - type: Label - rect: [210, 120, 200, 50] + rect: [210, 120, 200, 50, 3] font_size: 14 fg_color: "#AA99BB" source: Static @@ -136,7 +136,7 @@ elements: # batteries - type: BatteryList - rect: [0, 0, 400, 30] + rect: [0, 0, 400, 30, 3] font_size: 14 fg_color: "#99BBAA" fg_color_low: "#B06060" @@ -147,7 +147,7 @@ elements: # volume buttons - type: Button - rect: [327, 52, 46, 32] + rect: [327, 52, 46, 32, 3] font_size: 14 fg_color: "#FFFFFF" bg_color: "#505050" @@ -156,7 +156,7 @@ elements: - type: Exec command: [ "pactl", "set-sink-volume", "@DEFAULT_SINK@", "+5%" ] - type: Button - rect: [327, 116, 46, 32] + rect: [327, 116, 46, 32, 3] font_size: 14 fg_color: "#FFFFFF" bg_color: "#505050"