Widgets implemented (13 total): - Label: Static text with alignment - Button: With importance levels (primary/normal/danger) - TextInput: Single-line text entry with cursor - Checkbox: Boolean toggle - Select: Dropdown selection - List: Scrollable selectable list - Focus: Focus manager with tab navigation - Table: Editable table with dirty tracking, keyboard nav - Split: HSplit/VSplit draggable panels - Panel: Container with title bar, collapsible - Modal: Dialogs (alert, confirm, inputDialog) - AutoComplete: ComboBox with prefix/contains/fuzzy matching Core improvements: - InputState now tracks keyboard state (keys_down, key_events) - Full keyboard navigation for Table widget Research documentation: - WIDGET_COMPARISON.md: zcatgui vs DVUI vs Gio vs zcatui - SIMIFACTU_ADVANCEDTABLE.md: Analysis of 10K LOC table component - LEGO_PANELS_SYSTEM.md: Modular panel composition architecture Examples: - widgets_demo.zig: All basic widgets showcase - table_demo.zig: Table, Split, Panel demonstration All tests passing. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
316 lines
10 KiB
Markdown
316 lines
10 KiB
Markdown
# Comparativa de Widgets: zcatgui vs DVUI vs Gio vs zcatui
|
|
|
|
> Investigacion realizada: 2025-12-09
|
|
> Proposito: Identificar widgets faltantes en zcatgui comparando con otras librerias
|
|
|
|
---
|
|
|
|
## Resumen Ejecutivo
|
|
|
|
| Libreria | Lenguaje | Widgets | Notas |
|
|
|----------|----------|---------|-------|
|
|
| **zcatgui** | Zig | 11 | Nuestro proyecto - EN DESARROLLO |
|
|
| **DVUI** | Zig | ~20 | Unica referencia GUI Zig nativa |
|
|
| **Gio** | Go | ~25 | Immediate mode moderno, Material Design |
|
|
| **zcatui** | Zig | 35 | Nuestro proyecto hermano TUI |
|
|
|
|
---
|
|
|
|
## 1. zcatgui - Estado Actual (v0.4.0)
|
|
|
|
### Widgets Implementados (11)
|
|
|
|
| Widget | Archivo | Estado | Descripcion |
|
|
|--------|---------|--------|-------------|
|
|
| Label | `label.zig` | OK | Texto estatico con alineacion |
|
|
| Button | `button.zig` | OK | Con importancia (primary/normal/danger) |
|
|
| TextInput | `text_input.zig` | OK | Entry de texto con cursor |
|
|
| Checkbox | `checkbox.zig` | OK | Toggle booleano |
|
|
| Select | `select.zig` | OK | Dropdown selection |
|
|
| List | `list.zig` | OK | Lista seleccionable |
|
|
| Table | `table.zig` | OK | Edicion in-situ, dirty tracking |
|
|
| Panel | `panel.zig` | OK | Container con titulo y bordes |
|
|
| Split | `split.zig` | OK | HSplit/VSplit draggable |
|
|
| Modal | `modal.zig` | OK | Dialogos modales (alert, confirm, input) |
|
|
| Focus | `focus.zig` | OK | Focus manager, tab navigation |
|
|
|
|
---
|
|
|
|
## 2. DVUI - Widgets Disponibles
|
|
|
|
Fuente: [DVUI GitHub](https://github.com/david-vanderson/dvui)
|
|
|
|
### Widgets en DVUI
|
|
|
|
| Widget | En zcatgui | Prioridad | Notas |
|
|
|--------|------------|-----------|-------|
|
|
| Button | OK | - | Ya implementado |
|
|
| Checkbox | OK | - | Ya implementado |
|
|
| Radio Buttons | NO | MEDIA | Falta implementar |
|
|
| Text Entry (single) | OK | - | Ya implementado |
|
|
| Text Entry (multi) | NO | ALTA | TextArea falta |
|
|
| Number Entry | NO | ALTA | Input numerico validado |
|
|
| Text Layout | NO | MEDIA | Texto con partes clickables |
|
|
| Floating Window | NO | MEDIA | Ventanas draggables |
|
|
| Menu | NO | ALTA | Menus dropdown |
|
|
| Popup/Context | OK | - | Modal implementado |
|
|
| Scroll Area | NO | ALTA | Contenido scrollable |
|
|
| Slider | NO | ALTA | Rango numerico |
|
|
| SliderEntry | NO | MEDIA | Slider + text entry combo |
|
|
| Toast | NO | BAJA | Notificaciones temporales |
|
|
| Panes (draggable) | OK | - | Split implementado |
|
|
| Dropdown | OK | - | Select implementado |
|
|
| Combo Box | NO | ALTA | Dropdown + text entry |
|
|
| Reorderable Lists | NO | MEDIA | Drag to reorder |
|
|
| Data Grid | OK | - | Table implementado |
|
|
| Tooltips | NO | MEDIA | Hover info |
|
|
|
|
### Widgets DVUI Faltantes en zcatgui (Prioritarios)
|
|
|
|
1. **Menu** - Critico para apps
|
|
2. **Scroll Area** - Necesario para contenido largo
|
|
3. **Slider** - Control numerico comun
|
|
4. **TextArea** - Input multilinea
|
|
5. **Number Entry** - Input con validacion numerica
|
|
6. **Combo Box** - AutoComplete (requerido por Simifactu)
|
|
7. **Radio Buttons** - Seleccion exclusiva
|
|
|
|
---
|
|
|
|
## 3. Gio (Go) - Widgets Disponibles
|
|
|
|
Fuente: [docs/research/GIO_UI_ANALYSIS.md](./GIO_UI_ANALYSIS.md)
|
|
|
|
### Widget State (`gioui.org/widget`)
|
|
|
|
| Widget | En zcatgui | Prioridad | Notas |
|
|
|--------|------------|-----------|-------|
|
|
| Clickable | OK | - | Button usa esto |
|
|
| Editor | OK | - | TextInput implementado |
|
|
| Selectable | NO | BAJA | Texto seleccionable |
|
|
| Float | NO | ALTA | Para sliders |
|
|
| Bool | OK | - | Checkbox |
|
|
| Enum | NO | MEDIA | Radio buttons |
|
|
| List | OK | - | List implementado |
|
|
| Scrollbar | NO | ALTA | Falta |
|
|
| Draggable | NO | MEDIA | Drag & drop |
|
|
| Decorations | NO | BAJA | Decoraciones ventana |
|
|
| Icon | NO | BAJA | Iconos vectoriales |
|
|
|
|
### Material Widgets (`gioui.org/widget/material`)
|
|
|
|
| Widget | En zcatgui | Prioridad | Notas |
|
|
|--------|------------|-----------|-------|
|
|
| Label, H1-H6 | PARCIAL | MEDIA | Solo Label basico |
|
|
| Button, IconButton | OK | - | Button implementado |
|
|
| Editor | OK | - | TextInput |
|
|
| CheckBox | OK | - | Checkbox |
|
|
| RadioButton | NO | MEDIA | Falta |
|
|
| Switch | NO | BAJA | Toggle estilo movil |
|
|
| Slider | NO | ALTA | Falta |
|
|
| List, Scrollbar | PARCIAL | ALTA | List OK, Scrollbar falta |
|
|
| ProgressBar | NO | MEDIA | Indicador progreso |
|
|
| ProgressCircle | NO | BAJA | Spinner circular |
|
|
| Loader | NO | BAJA | Spinner |
|
|
|
|
### Extended Components (`gioui.org/x/component`)
|
|
|
|
| Widget | En zcatgui | Prioridad | Notas |
|
|
|--------|------------|-----------|-------|
|
|
| AppBar | NO | MEDIA | Barra aplicacion |
|
|
| NavDrawer | NO | MEDIA | Panel navegacion |
|
|
| Menu, MenuItem | NO | ALTA | Menus |
|
|
| ContextArea | NO | MEDIA | Menu contextual |
|
|
| Grid, Table | OK | - | Table implementado |
|
|
| Sheet, Surface | NO | BAJA | Contenedores |
|
|
| TextField | OK | - | TextInput con label |
|
|
| Tooltip | NO | MEDIA | Hover info |
|
|
| Discloser | NO | MEDIA | Expandible/collapsible |
|
|
| Divider | NO | BAJA | Separador visual |
|
|
| ModalLayer, Scrim | OK | - | Modal implementado |
|
|
|
|
### Widgets Gio Faltantes en zcatgui (Prioritarios)
|
|
|
|
1. **Menu, MenuItem** - Navegacion aplicacion
|
|
2. **Scrollbar** - Contenido largo
|
|
3. **Slider** - Control numerico
|
|
4. **RadioButton** - Seleccion exclusiva
|
|
5. **ProgressBar** - Indicadores
|
|
6. **Tooltip** - Informacion contextual
|
|
7. **NavDrawer** - Navegacion lateral
|
|
|
|
---
|
|
|
|
## 4. zcatui (TUI) - Widgets Disponibles
|
|
|
|
Proyecto hermano: `/mnt/cello2/arno/re/recode/zig/zcatui/`
|
|
|
|
### Todos los Widgets en zcatui (35)
|
|
|
|
| Widget | En zcatgui | Prioridad | Descripcion |
|
|
|--------|------------|-----------|-------------|
|
|
| `paragraph.zig` | NO | BAJA | Texto con wrapping |
|
|
| `list.zig` | OK | - | Lista seleccionable |
|
|
| `gauge.zig` | NO | MEDIA | Indicador tipo gauge |
|
|
| `tabs.zig` | NO | ALTA | Tab navigation |
|
|
| `sparkline.zig` | NO | BAJA | Mini grafico linea |
|
|
| `scrollbar.zig` | NO | ALTA | Scrollbar |
|
|
| `barchart.zig` | NO | BAJA | Grafico barras |
|
|
| `canvas.zig` | NO | BAJA | Dibujo libre |
|
|
| `chart.zig` | NO | BAJA | Graficos genericos |
|
|
| `clear.zig` | NO | - | Utilidad limpieza |
|
|
| `calendar.zig` | NO | MEDIA | Selector fecha |
|
|
| `table.zig` | OK | - | Tabla |
|
|
| `input.zig` | OK | - | TextInput |
|
|
| `popup.zig` | OK | - | Modal |
|
|
| `menu.zig` | NO | ALTA | Menu |
|
|
| `tooltip.zig` | NO | MEDIA | Tooltip |
|
|
| `tree.zig` | NO | ALTA | TreeView |
|
|
| `filepicker.zig` | NO | MEDIA | Selector archivos |
|
|
| `scroll.zig` | NO | ALTA | ScrollArea |
|
|
| `textarea.zig` | NO | ALTA | Input multilinea |
|
|
| `select.zig` | OK | - | Dropdown |
|
|
| `slider.zig` | NO | ALTA | Slider |
|
|
| `panel.zig` | OK | - | Container |
|
|
| `checkbox.zig` | OK | - | Checkbox |
|
|
| `statusbar.zig` | NO | MEDIA | Barra estado |
|
|
| `block.zig` | NO | BAJA | Container basico |
|
|
| `spinner.zig` | NO | MEDIA | Indicador carga |
|
|
| `help.zig` | NO | BAJA | Panel ayuda |
|
|
| `progress.zig` | NO | MEDIA | Barra progreso |
|
|
| `markdown.zig` | NO | BAJA | Render markdown |
|
|
| `syntax.zig` | NO | BAJA | Syntax highlighting |
|
|
| `viewport.zig` | NO | MEDIA | Area scrollable |
|
|
| `logo.zig` | NO | BAJA | Logo ASCII art |
|
|
| `dirtree.zig` | NO | MEDIA | Arbol directorios |
|
|
|
|
### Widgets zcatui Faltantes en zcatgui (Prioritarios)
|
|
|
|
1. **Tabs** - Navegacion por pestanas
|
|
2. **Menu** - Menus dropdown
|
|
3. **Tree** - Vista arbol
|
|
4. **ScrollArea** - Contenido scrollable
|
|
5. **TextArea** - Input multilinea
|
|
6. **Slider** - Control numerico
|
|
7. **Scrollbar** - Indicador scroll
|
|
8. **Calendar** - Selector fecha
|
|
9. **ProgressBar** - Indicador progreso
|
|
10. **Spinner** - Indicador carga
|
|
|
|
---
|
|
|
|
## 5. Analisis Consolidado: Widgets Faltantes
|
|
|
|
### Prioridad CRITICA (Necesarios para MVP Simifactu)
|
|
|
|
| Widget | DVUI | Gio | zcatui | Descripcion |
|
|
|--------|------|-----|--------|-------------|
|
|
| **Menu** | SI | SI | SI | Menus aplicacion |
|
|
| **ScrollArea** | SI | SI | SI | Contenido scrollable |
|
|
| **ComboBox/AutoComplete** | SI | NO | NO | Dropdown + typing |
|
|
| **Tabs** | NO | SI | SI | Tab navigation |
|
|
|
|
### Prioridad ALTA
|
|
|
|
| Widget | DVUI | Gio | zcatui | Descripcion |
|
|
|--------|------|-----|--------|-------------|
|
|
| **Slider** | SI | SI | SI | Control numerico |
|
|
| **TextArea** | SI | SI | SI | Input multilinea |
|
|
| **Tree** | NO | NO | SI | Vista jerarquica |
|
|
| **RadioButton** | SI | SI | NO | Seleccion exclusiva |
|
|
| **Scrollbar** | SI | SI | SI | Indicador scroll |
|
|
| **NumberEntry** | SI | NO | NO | Input numerico validado |
|
|
|
|
### Prioridad MEDIA
|
|
|
|
| Widget | DVUI | Gio | zcatui | Descripcion |
|
|
|--------|------|-----|--------|-------------|
|
|
| **Tooltip** | SI | SI | SI | Hover info |
|
|
| **ProgressBar** | NO | SI | SI | Indicador progreso |
|
|
| **Spinner** | NO | SI | SI | Indicador carga |
|
|
| **Calendar** | NO | NO | SI | Selector fecha |
|
|
| **StatusBar** | NO | NO | SI | Barra estado |
|
|
| **NavDrawer** | NO | SI | NO | Panel navegacion |
|
|
|
|
### Prioridad BAJA
|
|
|
|
| Widget | Razon |
|
|
|--------|-------|
|
|
| Gauge | Especifico TUI |
|
|
| Sparkline | Grafico especializado |
|
|
| BarChart | Grafico especializado |
|
|
| Canvas | Dibujo libre |
|
|
| Markdown | Render especializado |
|
|
| Syntax | Highlighting especializado |
|
|
| Logo | ASCII art |
|
|
|
|
---
|
|
|
|
## 6. Roadmap de Implementacion
|
|
|
|
### Fase Inmediata (v0.5.0)
|
|
|
|
1. **AutoComplete/ComboBox** - Requerido por Simifactu
|
|
2. **Slider** - Control basico muy usado
|
|
3. **Scrollbar** + **ScrollArea** - Contenido largo
|
|
|
|
### Fase Siguiente (v0.6.0)
|
|
|
|
4. **Menu** - Navegacion aplicacion
|
|
5. **Tabs** - Navegacion por pestanas
|
|
6. **RadioButton** - Seleccion exclusiva
|
|
|
|
### Fase Posterior (v0.7.0)
|
|
|
|
7. **TextArea** - Input multilinea
|
|
8. **Tree** - Vista jerarquica
|
|
9. **NumberEntry** - Input numerico validado
|
|
10. **ProgressBar** + **Spinner** - Indicadores
|
|
|
|
### Fase Final (v0.8.0)
|
|
|
|
11. **Tooltip** - Hover info
|
|
12. **Calendar** - Selector fecha
|
|
13. **StatusBar** - Barra estado
|
|
14. **FilePicker** - Selector archivos
|
|
|
|
---
|
|
|
|
## 7. Conclusiones
|
|
|
|
### Widgets Unicos que Tenemos
|
|
|
|
- **Macro System** - Ninguna otra libreria tiene grabacion/reproduccion de macros integrada
|
|
|
|
### Gaps Criticos
|
|
|
|
1. **AutoComplete/ComboBox** - DVUI lo tiene, Simifactu lo necesita
|
|
2. **Menu** - Todas las librerias maduras lo tienen
|
|
3. **ScrollArea** - Fundamental para cualquier app seria
|
|
4. **Tabs** - Navegacion standard
|
|
|
|
### Fortalezas Actuales
|
|
|
|
- Table con edicion y dirty tracking (mejor que DVUI)
|
|
- Modal completo (alert, confirm, input)
|
|
- Split panels funcionales
|
|
- Sistema de macros (unico)
|
|
|
|
### Estimacion Esfuerzo
|
|
|
|
| Fase | Widgets | Estimacion |
|
|
|------|---------|------------|
|
|
| v0.5.0 | AutoComplete, Slider, ScrollArea | 1 semana |
|
|
| v0.6.0 | Menu, Tabs, RadioButton | 1 semana |
|
|
| v0.7.0 | TextArea, Tree, NumberEntry, Progress | 1.5 semanas |
|
|
| v0.8.0 | Tooltip, Calendar, StatusBar, FilePicker | 1 semana |
|
|
| **Total** | **16 widgets** | **~4.5 semanas** |
|
|
|
|
---
|
|
|
|
## Referencias
|
|
|
|
- [DVUI GitHub](https://github.com/david-vanderson/dvui)
|
|
- [Gio UI](https://gioui.org/)
|
|
- [zcatui](../../../zcatui/)
|
|
- [Simifactu Analysis](./SIMIFACTU_FYNE_ANALYSIS.md)
|