feat(coding): improve keyboard UI with icons, layers, and emoji #2

Merged

addison merged 51 commits from exe-dev-bot/keyboard:feat/keyboard-ui-improvements into main 2026-01-29 07:09:57 -05:00

Conversation 14 Commits 51 Files changed 15 +493 -133

exe-dev-bot commented 2026-01-28 10:09:19 -05:00

Contributor

Copy link

Summary

Major UI improvements to the coding keyboard mode.

Changes

Visual Improvements

• Replace UTF-8 symbols with Material vector icons (backspace, enter, shift, space, arrows)
• Remove gaps between keys (reduced to 1px margins)
• Fix keyboard height to ~1/3 of screen (matches standard keyboards)
• Add staggered row offsets (ASDF row offset by 0.5 key width on each side)

Layer 3 (New)

• Function keys F1-F12
• Navigation keys (Home, End, PgUp, PgDn, Ins, Del, PrtSc, Pause)
• Common emoji (😀😂❤️👍👎🔥✅❌⭐🎉👏🤔😢😠👀💯🚀✨👋🙏💪🤷👌)

Consistency Fixes

• Layer buttons always in bottom right corner across all layers
• Consistent row weights and structure between layers
• Backspace always on row 4, enter always on row 5

Developer Experience

• New justfile recipes: show-keyboard, open-textfield, tap
• Updated AGENTS.md with keyboard layout conventions and ADB tips

Testing

just run && just show-keyboard

Then tap L2 → L3 to see all layers.

## Summary Major UI improvements to the coding keyboard mode. ## Changes ### Visual Improvements - Replace UTF-8 symbols with Material vector icons (backspace, enter, shift, space, arrows) - Remove gaps between keys (reduced to 1px margins) - Fix keyboard height to ~1/3 of screen (matches standard keyboards) - Add staggered row offsets (ASDF row offset by 0.5 key width on each side) ### Layer 3 (New) - Function keys F1-F12 - Navigation keys (Home, End, PgUp, PgDn, Ins, Del, PrtSc, Pause) - Common emoji (😀😂❤️👍👎🔥✅❌⭐🎉👏🤔😢😠👀💯🚀✨👋🙏💪🤷👌) ### Consistency Fixes - Layer buttons always in bottom right corner across all layers - Consistent row weights and structure between layers - Backspace always on row 4, enter always on row 5 ### Developer Experience - New justfile recipes: `show-keyboard`, `open-textfield`, `tap` - Updated AGENTS.md with keyboard layout conventions and ADB tips ## Testing ```bash just run && just show-keyboard ``` Then tap L2 → L3 to see all layers.

exe-dev-bot added 22 commits 2026-01-28 10:09:20 -05:00

feat: initial kwila keyboard implementation ... db382a511b

- InputMethodService with three modes (Image, Coding, Voice)
- Image/OCR mode using ML Kit text recognition
- Coding mode with sticky modifier keys (Ctrl, Alt, Super, Tab, Esc)
- Voice mode with OpenRouter Whisper transcription
- Settings activity with encrypted API key storage
- Material 3 dark theme
- Gradle Kotlin DSL build configuration
- justfile for common tasks
- Forgejo Actions CI/CD workflows

Co-authored-by: Shelley <shelley@exe.dev>

feat(icons): add PNG launcher icons generated via html2png.dev ... 3302c918e3

- Add high-quality launcher icons for all Android densities
- Add adaptive icon foreground PNG for Android 8+
- Icon features bold K letter in primary purple (#BB86FC) on dark background
- Generated from 512x512 source and resized with ImageMagick

Co-authored-by: Shelley <shelley@exe.dev>

feat(coding): add full QWERTY keyboard with arrow keys and enter ... 77fb265bae

- Full QWERTY layout with numbers and symbols
- Arrow keys (←↑↓→) for cursor navigation
- Enter, Backspace, Space keys
- Shift key (sticky like other modifiers)
- All keys work with Ctrl/Alt/Super modifiers
- Modifiers auto-release after keypress

Co-authored-by: Shelley <shelley@exe.dev>

feat(coding): implement two-layer shell-optimized keyboard ... 4e233a72cc

Layer 1 (Primary):
- Full QWERTY with numbers
- High-frequency symbols: - / . $ (ranks 1-4 in shell usage)
- Esc, Ctrl, Tab on bottom row
- Tap L2 to toggle layers

Layer 2 (Navigation & Symbols):
- All brackets: [] {} () <>
- Terminal symbols: | > : ~ = ; " ' \ `
- Arrow keys in natural cluster
- Alt, Super modifiers
- Tap L1 to return

Sticky modifiers with visual feedback (purple highlight when armed)

Co-authored-by: Shelley <shelley@exe.dev>

fix(ci): use full GitHub URLs for actions ... 6d1a1da3e1

Co-authored-by: Shelley <shelley@exe.dev>

fix(ci): use upload-artifact v3 for Forgejo compatibility ... 27741589f1

Co-authored-by: Shelley <shelley@exe.dev>

fix: use MaterialComponents theme for TabLayout compatibility ... 43cab8e218

Co-authored-by: Shelley <shelley@exe.dev>

refactor: change package to dev.kwila.keyboard and use kwila logo ... 7002a9dbfa

- Changed app ID from cloud.kwila.keyboard to dev.kwila.keyboard
- Updated launcher icons to use official Kwila logo from kwila.dev

Co-authored-by: Shelley <shelley@exe.dev>

fix: use app name for launcher activity label ... e7fe4556c0

Co-authored-by: Shelley <shelley@exe.dev>

fix: show helpful message when API key not configured ... d53793602e

Voice mode now shows 'Set OpenRouter API key in settings' and
disables the mic button when no API key is set.

Co-authored-by: Shelley <shelley@exe.dev>

fix: update package name in justfile uninstall recipe ... 2d32e5b2d1

Co-authored-by: Shelley <shelley@exe.dev>

fix: use NoActionBar theme variant for Material Components ... b63e8cf82f

Co-authored-by: Shelley <shelley@exe.dev>

feat(settings): add buttons to enable and select keyboard ... 8634adbc28

- 'Enable Kwila Keyboard' opens system input method settings
- 'Select Input Method' shows the keyboard picker dialog
- Changed Material3 styles to MaterialComponents for compatibility
- Allow clearing API key (voice mode is optional)

Co-authored-by: Shelley <shelley@exe.dev>

fix(service): wrap inflater with themed context for Material components ... ebe1f6622a

InputMethodService doesn't inherit app theme, causing TabLayout crash.
Use ContextThemeWrapper to apply Theme.KwilaKeyboard to inflated views.

Co-authored-by: Shelley <shelley@exe.dev>

fix(settings): remove duplicate hint from API key input ... b792f40d37

Co-authored-by: Shelley <shelley@exe.dev>

feat(keyboard): ui improvements ... 1111069ff6

- remove rounded corners from keys
- make coding mode the default
- move period next to $ and enter above L2
- mark image and voice modes as coming soon

Co-authored-by: Shelley <shelley@exe.dev>

fix(ime): correct settings activity package name in method.xml ... 9db574e259

Co-authored-by: Shelley <shelley@exe.dev>

ci(pr): include commit SHA in build comment ... c3e4c99ab3

Co-authored-by: Shelley <shelley@exe.dev>

feat(dev): add emulator management commands to justfile ... e4e62121d8

Co-authored-by: Shelley <shelley@exe.dev>

docs: update AGENTS.md with emulator testing workflow ... 43314b5df8

Co-authored-by: Shelley <shelley@exe.dev>

docs: make emulator instructions more general ... b36f169ffa

Co-authored-by: Shelley <shelley@exe.dev>

feat(coding): improve keyboard UI with icons, layers, and emoji ... 0c35af27e2

- Replace UTF-8 symbols with Material vector icons for backspace, enter,
  shift, space, and arrow keys
- Remove gaps between keys (1px margins)
- Fix keyboard height to ~1/3 screen
- Add staggered row offsets (ASDF row offset by 0.5 key)
- Add Layer 3 with function keys (F1-F12), navigation, and common emoji
- Make layer buttons consistent (always bottom right corner)
- Update AGENTS.md with keyboard layout conventions and ADB tips
- Add justfile recipes: show-keyboard, open-textfield, tap

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 10:20:39 -05:00

Copy link

📦 Build Successful!

Commit: 0c35af2
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `0c35af2` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/445/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-28 10:53:53 -05:00

fix(coding): handle shift key on layer 3 ... 973cde6591

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 10:57:32 -05:00

ci: use shared debug keystore for consistent APK signing ... e070fee88b

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 11:02:30 -05:00

Copy link

📦 Build Successful!

Commit: 973cde6
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `973cde6` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/446/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-28 11:12:46 -05:00

feat(coding): reduce to 4 rows, move numbers to L2 ... b8fe89991c

- Layer 1: QWERTY only (4 rows, bigger keys for easier tapping)
- Layer 2: Numbers + symbols + modifiers (Esc, Tab, Ctrl, Alt, Super)
- Layer 3: F1-F12, navigation keys, emoji

All layers now have consistent 4-row layout.

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 11:46:47 -05:00

feat(coding): consistent space position, add / to L1, simplify L3 ... 816db96567

- Space is now 3 keys wide at consistent position on L1 and L2
- Added / key to L1 bottom row
- Removed arrows and space from L3 (available on L2)
- L3 now has more emoji space

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 11:50:27 -05:00

docs+feat: add layer design rules, L3 only has L1 button ... 3c81396bd2

AGENTS.md:
- Document layer design rules for consistent key positions
- L3 only accessible from L2
- L1 accessible from all layers
- Space/Enter/Backspace only on L1/L2

CodingModeHandler:
- Remove backspace and L2 button from L3
- L3 now only has L1 button for easy return to default

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:02:50 -05:00

feat(coding): arrows at hjkl positions, better centered space, bigger layer buttons ... 04cc1aae0d

- Arrows on L2 row 2 now align with hjkl on L1 row 2 (vim-style)
- Space bar shifted one key right for better centering on L1 and L2
- L1/L3 buttons on L2 are now 0.75 weight instead of 0.5 (easier to tap)

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:05:39 -05:00

fix(coding): ensure shared keys at same position across layers ... 088245ec36

- Ctrl now at position 0 on both L1 and L2
- Backspace now 1.5 weight on L2 row 3 (same as L1)
- Space and Enter already consistent

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:20:17 -05:00

feat(coding): add Esc to L1, Alt to L2, fix shared key positions ... 1a58e9bb1a

- Esc now on L1 row 4 (position 1-2)
- Alt now on L2 row 4 (position 1-2)
- Comma on L2 at same position as period on L1 (position 2-3)
- Tab moved to L2 row 2
- All keys >= 1 width (no tiny buttons)
- Shared keys (Ctrl, Space, Enter) at same positions on both layers

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:28:00 -05:00

docs: update AGENTS.md with layer design rules and layouts ... 909812a819

- Add minimum key width rule (no key < 1 unit)
- Document current layer layouts for L1, L2, L3
- Document shared key positions (Ctrl, Space, Enter, Backspace)
- Note arrows at hjkl positions (vim-style)
- Update keyboard layout conventions for 4-row design

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:39:39 -05:00

ci: trigger rebuild with new keystore ... f7d72e363c

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 12:42:37 -05:00

feat(coding): update emoji selection per user preference ... 707a1f1e69

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 13:53:03 -05:00

ci: trigger rebuild with updated keystore ... 2478015247

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 14:39:43 -05:00

ci: trigger rebuild with JKS keystore ... fa6afc6192

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 14:50:21 -05:00

ci: add debug output for keystore ... ffaba538c4

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 16:13:08 -05:00

ci: trigger rebuild after secret fix ... 23b606cd75

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 16:17:17 -05:00

ci: generate debug keystore dynamically (secrets unavailable in fork PRs) ... 65e0c733f4

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 16:26:01 -05:00

Copy link

📦 Build Successful!

Commit: 65e0c73
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `65e0c73` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/461/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-28 16:46:34 -05:00

feat(coding): improve layout per user feedback ... fddc0fb1f3

- Move / to left side of keyboard (L1 row 4)
- Move Tab to beginning of L2 row 3 (1.5 width)
- Move <> to L2 row 2
- Add $ to L2 row 4
- L1 button on L3 now at same position as L2 (pos 8.5-10)
- Layer 3 max 10 keys per row (split F1-F12 across 2 rows)
- Keyboard 25% taller (220dp vs 196dp)

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 16:46:56 -05:00

docs: update AGENTS.md with current layout ... c56fc445a1

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 16:53:43 -05:00

fix(layout): increase keyboard height to 245dp (25% taller) ... a1eabfafc0

The modeContainer in keyboard_view.xml was clipping the keyboard.
Increased it from 220dp to 269dp (245dp keyboard + 24dp status bar).

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 16:58:48 -05:00

Copy link

📦 Build Successful!

Commit: fddc0fb
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `fddc0fb` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/462/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 16:58:55 -05:00

Copy link

📦 Build Successful!

Commit: c56fc44
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `c56fc44` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/463/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-28 17:02:02 -05:00

fix(coding): move / to position after Esc on L1 row 4 ... 4d9f707e09

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 17:02:56 -05:00

Copy link

📦 Build Successful!

Commit: a1eabfa
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `a1eabfa` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/464/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 17:10:32 -05:00

Copy link

📦 Build Successful!

Commit: 4d9f707
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `4d9f707` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/465/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-28 17:22:01 -05:00

fix(coding): update L1 and L2 bottom row layouts ... ba1abcb043

L1: Ctrl Esc . / [Space] Enter L2
L2: Ctrl Alt Super $ [Space] L3 L1
Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 17:23:46 -05:00

fix(coding): align nav keys with arrows, reduce Super width ... 613f4bd1a4

- Home/PgDn/PgUp/End on L3 now at same positions as ←↓↑→ on L2
- Super key reduced from 1.5 to 1 width
- L3/L1 buttons increased to 1.5 width each

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 17:26:27 -05:00

fix(coding): backslash at same pos as slash, shift shows L2 values ... 583d9f7dd7

- Backslash on L2 row 4 at position 3 (same as / on L1)
- L1 row 4 shift labels now show L2 equivalents (Alt, Super, $)
- Added semicolon to L2 row 3 (replaced backslash)

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 17:29:01 -05:00

fix(coding): correct colors for shifted keys on L1 bottom row ... 03e6c3c593

Alt and Super now show in purple (modifier color) when shift is active

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-28 17:30:40 -05:00

fix(coding): slash+shift=backslash, replace () with |$ on L2 row 3 ... 3ebac4c467

- Shift+/ on L1 now produces \ (was $)
- L2 row 3: replaced duplicate () with | and $

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-28 17:32:48 -05:00

Copy link

📦 Build Successful!

Commit: ba1abcb
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `ba1abcb` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/466/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 17:34:33 -05:00

Copy link

📦 Build Successful!

Commit: 613f4bd
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `613f4bd` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/467/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 17:38:45 -05:00

Copy link

📦 Build Successful!

Commit: 583d9f7
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `583d9f7` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/468/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 17:41:04 -05:00

Copy link

📦 Build Successful!

Commit: 03e6c3c
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `03e6c3c` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/469/artifacts/kwila-keyboard-debug)

forgejo-actions commented 2026-01-28 17:42:04 -05:00

Copy link

📦 Build Successful!

Commit: 3ebac4c
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `3ebac4c` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/470/artifacts/kwila-keyboard-debug)

exe-dev-bot added 1 commit 2026-01-29 06:16:49 -05:00

feat(coding): major layout redesign - L3 as shift for L2 ... c960f23677

Layer 2:
- Row 2: ` - = + ; arrows
- Row 3: L3 ( [ { < : ' ? ⌫ (opening brackets)
- Row 4: Ctrl Alt , \ Space Tab Super L1

Layer 3:
- Row 3: L2 ) ] } > _ " | ⌫ (closing brackets at same positions)
- Row 4: ~ $ @ # 😊 👍 ✅ ❌ L1

Key improvements:
- L3 acts as 'shift' for L2: opening → closing brackets
- ' on L2 maps to " on L3 at same position
- Tab and Super on L2 row 4
- Reduced emoji, added ✅/❌ pair
- L1 button is single width

Co-authored-by: Shelley <shelley@exe.dev>

exe-dev-bot added 1 commit 2026-01-29 06:24:05 -05:00

docs: update AGENTS.md with new layout and design guidelines ... 4a4e34e881

- Updated layer layouts to reflect L3-as-shift design
- Added L2→L3 position mapping table
- Added Design Process section with principles and common mistakes
- Clarified that L3 is the 'shift' for L2

Co-authored-by: Shelley <shelley@exe.dev>

forgejo-actions commented 2026-01-29 06:32:54 -05:00

Copy link

📦 Build Successful!

Commit: 4a4e34e
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `4a4e34e` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/473/artifacts/kwila-keyboard-debug)

exe-dev-bot added 2 commits 2026-01-29 06:44:14 -05:00

Merge remote-tracking branch 'upstream/main' da1d715260

Merge branch 'main' into feat/keyboard-ui-improvements 84f1c99cb6

forgejo-actions commented 2026-01-29 06:52:06 -05:00

Copy link

📦 Build Successful!

Commit: 84f1c99
APK: app-debug.apk
Size: 47M

Download Debug APK

## 📦 Build Successful! **Commit:** `84f1c99` **APK:** app-debug.apk **Size:** 47M [Download Debug APK](https://git.kwila.cloud/kwila/keyboard/actions/runs/474/artifacts/kwila-keyboard-debug)

addison merged commit 97bafd59d3 into main 2026-01-29 07:09:57 -05:00

addison referenced this pull request from a commit 2026-01-29 07:09:59 -05:00

feat(coding): improve keyboard UI with icons, layers, and emoji (#2)

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

2 participants

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

kwila/keyboard!2

No description provided.