Feature Request: Addition of Tristate Module to NiceGUI Widgets
Summary
Addition of a new class named Tristate to the NiceGUI widgets project. This class provides a tri-state toggle input component that leverages predefined Unicode icon sets for visual representation, handling state changes entirely within Python without relying on JavaScript logic for state management.
Details
The Tristate component allows users to cycle through three states, each represented by a distinct Unicode icon. It's designed to integrate seamlessly with the existing NiceGUI application structure, offering a reactive UI component that updates its display based on user interactions.
Here are the key features of the Tristate module:
Tri-state functionality: unchecked, checked, and indeterminate.
Unicode icons for visual state representation.
Python-managed state cycling with no dependence on JavaScript for logic.
Reactivity handled within Python to update the Vue component's props.
Custom event emission on state changes with support for user-defined callback functions.
Example Icon Sets for Tristate Module
Arrows: arrows - Left Arrow (←), Up-Down Arrow (↕️), Right Arrow (→)
Ballot: ballot - Ballot Box (☐), Ballot Box with Check (☑️), Ballot Box with X (☒️)
Check: check - Checkbox (☐), Question Mark (❔), Checkmark (✔️)
Circles: circles - Circle (⭘), Bullseye (🎯), Fisheye (🔘)
WolfgangFahl
commented
6 months ago
Feature Request: Addition of Tristate Module to NiceGUI Widgets
Summary
Addition of a new class named
Tristateto the NiceGUI widgets project. This class provides a tri-state toggle input component that leverages predefined Unicode icon sets for visual representation, handling state changes entirely within Python without relying on JavaScript logic for state management.Details
The
Tristatecomponent allows users to cycle through three states, each represented by a distinct Unicode icon. It's designed to integrate seamlessly with the existing NiceGUI application structure, offering a reactive UI component that updates its display based on user interactions.Here are the key features of the
Tristatemodule:Example Icon Sets for Tristate Module
arrows- Left Arrow (←), Up-Down Arrow (↕️), Right Arrow (→)ballot- Ballot Box (☐), Ballot Box with Check (☑️), Ballot Box with X (☒️)check- Checkbox (☐), Question Mark (❔), Checkmark (✔️)circles- Circle (⭘), Bullseye (🎯), Fisheye (🔘)electrical- Plug (🔌), Battery Half (🔋), Lightning (⚡)faces- Sad Face (☹️), Neutral Face (😐), Happy Face (☺️)hands- Thumbs Down (👎), Hand (✋), Thumbs Up (👍)hearts- Empty Heart (♡), Half Heart (❤️), Full Heart (❤️)locks- Unlocked (🔓), Locked with Pen (🔏), Locked (🔒)marks- Question Mark (❓), Check Mark (✅), Cross Mark (❌)moons- New Moon (🌑), Half Moon (🌓), Full Moon (🌕)musical_notes- Single Note (♪), Double Note (♫), Multiple Notes (🎶)stars- Empty Star (☆), Half Star (★), Full Star (★)traffic_lights- Red (🔴), Yellow (🟡), Green (🟢)weather- Cloud (☁️), Sun (☀️), Thunderstorm (⛈️)Implementation Details
The
Tristateclass should be developed adhering to the following criteria:blackandisort.References
The
Tristatemodule is inspired by the following resources: