svg key symbols

This commit is contained in:
galister
2025-06-19 07:14:24 +09:00
parent 7d7ab8055d
commit 775310c614
14 changed files with 70 additions and 3 deletions

View File

@@ -1,5 +1,28 @@
<layout>
<!-- Key cap with a single label. -->
<!-- Used for special keys. -->
<template name="KeySpecial">
<rectangle
border_color="#0044CC"
border="2"
round="8"
color="#000A1C"
color2="#000002"
gradient="vertical"
width="${width}"
height="${height}"
min_width="${width}"
min_height="${height}"
max_width="${width}"
max_height="${height}"
margin="4"
align_items="center"
justify_content="center">
<sprite color="#FFFFFF" width="32" height="32" src="keyboard/${text}.svg" />
</rectangle>
</template>
<!-- Key cap with a single label. -->
<!-- Used for letter keys on layouts without AltGr. -->
<template name="KeyLetter">

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m11.4 16l2.6-2.6l2.6 2.6l1.4-1.4l-2.6-2.6L18 9.4L16.6 8L14 10.6L11.4 8L10 9.4l2.6 2.6l-2.6 2.6zM9 20q-.475 0-.9-.213t-.7-.587L2 12l5.4-7.2q.275-.375.7-.587T9 4h11q.825 0 1.413.587T22 6v12q0 .825-.587 1.413T20 20z"/></svg>

After

Width:  |  Height:  |  Size: 442 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m12 15l-5-5h10z"/></svg>

After

Width:  |  Height:  |  Size: 245 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m14 17l-5-5l5-5z"/></svg>

After

Width:  |  Height:  |  Size: 246 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="M8 17q.425 0 .713-.288T9 16t-.288-.712T8 15t-.712.288T7 16t.288.713T8 17m0-4q.425 0 .713-.288T9 12t-.288-.712T8 11t-.712.288T7 12t.288.713T8 13m0-4q.425 0 .713-.288T9 8t-.288-.712T8 7t-.712.288T7 8t.288.713T8 9m3 8h6v-2h-6zm0-4h6v-2h-6zm0-4h6V7h-6zM5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h14q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21z"/></svg>

After

Width:  |  Height:  |  Size: 583 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m10 21l-6-6l6.025-6.025l1.4 1.425l-3.6 3.6H17V4h2v12H7.825l3.6 3.575z"/></svg>

After

Width:  |  Height:  |  Size: 299 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="M10 17V7l5 5z"/></svg>

After

Width:  |  Height:  |  Size: 243 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="M8 18v-5H3l9-11l9 11h-5v5zm-4 4v-2h16v2z"/></svg>

After

Width:  |  Height:  |  Size: 270 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="M6.5 21q-1.45 0-2.475-1.025T3 17.5t1.025-2.475T6.5 14H8v-4H6.5q-1.45 0-2.475-1.025T3 6.5t1.025-2.475T6.5 3t2.475 1.025T10 6.5V8h4V6.5q0-1.45 1.025-2.475T17.5 3t2.475 1.025T21 6.5t-1.025 2.475T17.5 10H16v4h1.5q1.45 0 2.475 1.025T21 17.5t-1.025 2.475T17.5 21t-2.475-1.025T14 17.5V16h-4v1.5q0 1.45-1.025 2.475T6.5 21m0-2q.625 0 1.063-.437T8 17.5V16H6.5q-.625 0-1.062.438T5 17.5t.438 1.063T6.5 19m11 0q.625 0 1.063-.437T19 17.5t-.437-1.062T17.5 16H16v1.5q0 .625.438 1.063T17.5 19M10 14h4v-4h-4zM6.5 8H8V6.5q0-.625-.437-1.062T6.5 5t-1.062.438T5 6.5t.438 1.063T6.5 8M16 8h1.5q.625 0 1.063-.437T19 6.5t-.437-1.062T17.5 5t-1.062.438T16 6.5z"/></svg>

After

Width:  |  Height:  |  Size: 862 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m7 20l-5-5l5-5l1.4 1.425L5.825 14H13v2H5.825L8.4 18.575zm10-6l-1.4-1.425L18.175 10H11V8h7.175L15.6 5.425L17 4l5 5z"/></svg>

After

Width:  |  Height:  |  Size: 344 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="M20 18V6h2v12zm-8 0l-1.425-1.4l3.6-3.6H2v-2h12.175L10.6 7.4L12 6l6 6z"/></svg>

After

Width:  |  Height:  |  Size: 299 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="white" d="m7 14l5-5l5 5z"/></svg>

After

Width:  |  Height:  |  Size: 244 B

View File

@@ -1,5 +1,5 @@
use glam::{IVec2, Vec2};
use idmap::{idmap, IdMap};
use idmap::{IdMap, idmap};
use idmap_derive::IntegerId;
use input_linux::{
AbsoluteAxis, AbsoluteInfo, AbsoluteInfoSetup, EventKind, InputId, Key, RelativeAxis,
@@ -10,7 +10,7 @@ use serde::Deserialize;
use std::mem::transmute;
use std::sync::LazyLock;
use std::{fs::File, sync::atomic::AtomicBool};
use strum::{EnumIter, EnumString, IntoEnumIterator};
use strum::{AsRefStr, EnumIter, EnumString, IntoEnumIterator};
use xkbcommon::xkb;
#[cfg(feature = "wayland")]

View File

@@ -38,6 +38,21 @@ use wgui::{
const PIXELS_PER_UNIT: f32 = 80.;
const AUTO_RELEASE_MODS: [KeyModifier; 5] = [SHIFT, CTRL, ALT, SUPER, META];
const SPECIAL_KEYS: [VirtualKey; 13] = [
VirtualKey::BackSpace,
VirtualKey::Down,
VirtualKey::Left,
VirtualKey::Menu,
VirtualKey::Return,
VirtualKey::KP_Enter,
VirtualKey::Right,
VirtualKey::LShift,
VirtualKey::RShift,
VirtualKey::LSuper,
VirtualKey::RSuper,
VirtualKey::Tab,
VirtualKey::Up,
];
pub const KEYBOARD_NAME: &str = "kbd";
@@ -195,7 +210,23 @@ where
KeyType::NumPad => {
label.push(keymap.label_for_key(vk, NUM_LOCK));
}
KeyType::Other => {}
KeyType::Other => {
if SPECIAL_KEYS.contains(&vk) {
cap_type = KeyCapType::Special;
match vk {
VirtualKey::RShift | VirtualKey::LShift => {
label.push("shift".into());
}
VirtualKey::RSuper | VirtualKey::LSuper => {
label.push("super".into());
}
VirtualKey::KP_Enter => {
label.push("return".into());
}
_ => label.push(format!("{vk:?}").to_lowercase()),
}
}
}
}
}
@@ -534,6 +565,8 @@ impl OverlayRenderer for KeyboardBackend {
#[derive(Debug)]
pub enum KeyCapType {
/// Label an SVG
Special,
/// Label is in center of keycap
Letter,
/// Label on the top