ac0b03a50c
- Added OLED functionality in keymap.c with custom rendering for layers and modifiers. - Created a Python script to generate simple icons for OLED displays. - Introduced a new rules.mk file to enable OLED features for the keymap. - Developed an OLED font helper script for visualizing and designing custom graphics. - Redesigned OLED layout to fit 128x32 displays, optimizing space for logos and layer indicators. - Implemented flow tap functionality in flow_tap.c for enhanced key responsiveness.
139 lines
4.8 KiB
Markdown
139 lines
4.8 KiB
Markdown
# OLED Display Fix for 128x32 Screens
|
||
|
||
## Problem
|
||
Your OLED code was designed for larger displays (128x64) with 8 rows. Your 128x32 display only has **4 rows × 21 characters**, so the 3-row tall graphics take up most of the screen, leaving no room for useful information.
|
||
|
||
## Solution Overview
|
||
1. **Simplify graphics**: Use 1-row tall icons (single character height) instead of 3-row tall graphics
|
||
2. **Optimize layout**: Better use of the 4 available rows
|
||
3. **Update font file**: Replace oversized graphics with compact, readable icons
|
||
|
||
## New Layout for 128x32 (4 rows)
|
||
```
|
||
Row 1: [Logo] LAYER NAME
|
||
Row 2: [Icon] W-C-S (modifiers)
|
||
Row 3: WPM:045
|
||
Row 4: CAPS SCRL
|
||
```
|
||
|
||
## Files Modified
|
||
|
||
### 1. OLED Code (keymap.c)
|
||
Replace your current OLED functions with the compact version in:
|
||
- `oled_redesign_128x32.c` (reference implementation)
|
||
|
||
Key changes:
|
||
- **Logo**: 2 characters instead of 15 (3×5 grid)
|
||
- **Layer indicators**: 2 characters instead of 15 (3×5 grid)
|
||
- **Modifiers**: 4 single characters (W-A-C-S) instead of multi-char graphics
|
||
- **Text-based layer names**: More readable than icons
|
||
- **Efficient spacing**: Uses all 4 rows effectively
|
||
|
||
### 2. Font File (glcdfont.c)
|
||
Update these character positions with simple icons:
|
||
|
||
```c
|
||
// 0x80-0x81: Logo (2 chars)
|
||
0x3E, 0x41, 0x55, 0x55, 0x41, 0x3E, // 0x80: Keyboard icon
|
||
0x3E, 0x41, 0x55, 0x55, 0x41, 0x3E, // 0x81: Keyboard icon
|
||
|
||
// 0x92-0x93: Default layer (2 chars)
|
||
0x08, 0x1C, 0x3E, 0x7F, 0x2A, 0x2A, // 0x92: Home icon
|
||
0x10, 0x38, 0x7C, 0xFE, 0x54, 0x54, // 0x93: Home icon
|
||
|
||
// 0x94-0x95: Symbol layer (2 chars)
|
||
0x24, 0x7F, 0x24, 0x7F, 0x24, 0x00, // 0x94: # symbol
|
||
0x24, 0x2A, 0x7F, 0x2A, 0x12, 0x00, // 0x95: $ symbol
|
||
|
||
// 0x96-0x97: Navigation layer (2 chars)
|
||
0x08, 0x1C, 0x2A, 0x08, 0x08, 0x08, // 0x96: Up arrow
|
||
0x08, 0x08, 0x08, 0x2A, 0x1C, 0x08, // 0x97: Down arrow
|
||
|
||
// 0x98-0x9B: Modifier keys (1 char each)
|
||
0x66, 0x66, 0x00, 0x7E, 0x66, 0x66, // 0x98: GUI/Windows
|
||
0x7E, 0x09, 0x09, 0x09, 0x7E, 0x00, // 0x99: ALT
|
||
0x3E, 0x41, 0x41, 0x41, 0x22, 0x00, // 0x9A: CTRL
|
||
0x08, 0x1C, 0x2A, 0x08, 0x08, 0x08, // 0x9B: SHIFT (arrow)
|
||
```
|
||
|
||
## Implementation Steps
|
||
|
||
### Step 1: Update keymap.c OLED functions
|
||
Copy the redesigned functions from `oled_redesign_128x32.c` to your `keymap.c`, replacing these functions:
|
||
- `render_logo()` → `render_logo_compact()`
|
||
- `render_logo2()` → (merged into main function)
|
||
- `render_layer_state()` → `render_layer_name()` + `render_layer_icon()`
|
||
- `render_mod_status_gui_alt()` → `render_modifiers_compact()`
|
||
- `render_mod_status_ctrl_shift()` → (merged into modifiers_compact)
|
||
- `render_status_main()` → `render_status_compact()`
|
||
- `render_status_secondary()` → (use same compact function)
|
||
- `oled_task_user()` → Updated version
|
||
|
||
### Step 2: Update glcdfont.c
|
||
1. Find line ~136 where character 0x80 starts
|
||
2. Replace the hex values for characters 0x80, 0x81, 0x92-0x9B
|
||
3. Keep all other characters (0x00-0x7F for ASCII text)
|
||
|
||
### Step 3: Compile and Test
|
||
```bash
|
||
cd qmk_userspace
|
||
bash build_all.sh
|
||
```
|
||
|
||
### Step 4: Flash to Keyboard
|
||
Flash the `.uf2` files to both halves of your split keyboard.
|
||
|
||
## Customization
|
||
|
||
### Design Your Own Icons
|
||
1. Visit: https://helixfonteditor.netlify.com/
|
||
2. Each character is **6 pixels wide × 8 pixels tall**
|
||
3. Export as hex array (6 bytes per character)
|
||
4. Copy hex values to glcdfont.c
|
||
|
||
### Character Format
|
||
Each character = 6 bytes (one per column):
|
||
```
|
||
Byte format (binary): 0bDCBA9876
|
||
where 0 = top pixel, 7 = bottom pixel
|
||
|
||
Example (arrow up):
|
||
▄ ▄▄▄ ▄ █ ▄ ▄ ▄ ▄
|
||
█ ███ █ █ █ █ █ █
|
||
= [0x08, 0x1C, 0x2A, 0x08, 0x08, 0x08]
|
||
```
|
||
|
||
### Alternative: Use Text Instead of Icons
|
||
If you prefer text-only (no custom graphics):
|
||
```c
|
||
// In render_modifiers_compact():
|
||
if(modifiers & MOD_MASK_GUI) oled_write_P(PSTR("W"), false);
|
||
if(modifiers & MOD_MASK_ALT) oled_write_P(PSTR("A"), false);
|
||
if(modifiers & MOD_MASK_CTRL) oled_write_P(PSTR("C"), false);
|
||
if(modifiers & MOD_MASK_SHIFT) oled_write_P(PSTR("S"), false);
|
||
```
|
||
|
||
## Benefits of This Design
|
||
|
||
✅ **Readable**: Text layer names are clearer than multi-row icons
|
||
✅ **Efficient**: Uses all 4 rows with no wasted space
|
||
✅ **Informative**: Shows layer, modifiers, WPM, and caps/scroll lock
|
||
✅ **Compact**: Small icons fit in single row (1 char tall)
|
||
✅ **Consistent**: Same layout on both keyboard halves
|
||
✅ **Maintainable**: Simpler code, easier to modify
|
||
|
||
## Tools Provided
|
||
|
||
1. **oled_font_helper.py**: Visualize current font graphics
|
||
2. **generate_simple_icons.py**: Generate simple icon hex values
|
||
3. **oled_redesign_128x32.c**: Complete redesigned OLED code
|
||
|
||
## Next Steps
|
||
|
||
Would you like me to:
|
||
1. Apply these changes directly to your keymap.c and glcdfont.c?
|
||
2. Create a different layout design?
|
||
3. Design custom icons for specific purposes?
|
||
4. Keep some of your original graphics but optimize them?
|
||
|
||
Let me know how you'd like to proceed!
|