binding-mewui-data

Binds MewUI controls to data sources using ObservableValue and ValueBinding for reactive UI updates.

Updated Nov 22, 2023
One-click install
npx skills add https://github.com/parksanghoon-sys/TestCode --skill binding-mewui-data-parksanghoon-sys
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: binding-mewui-data
Source: https://github.com/parksanghoon-sys/TestCode/tree/main/src/Modbus/.agents/skills/binding-mewui-data
Command: npx skills add https://github.com/parksanghoon-sys/TestCode --skill binding-mewui-data-parksanghoon-sys

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building reactive UIs in MewUI requires manually synchronizing control state with underlying data, which leads to stale displays, duplicated update logic, and infinite binding loops. This Skill provides the patterns for connecting MewUI controls to data sources so UI updates happen automatically when values change. ## Core Features & Use Cases - ObservableValue<T>: Create reactive value containers with change notifications and optional coercion constraints (e.g., clamping a percentage to 0-100). - Fluent Binding Extensions: Wire controls to data with one-way and two-way bindings like BindText, BindIsChecked, BindValue, and BindIsEnabled, including value converters. - ViewModel Patterns: Implement computed properties, form validation, and manual list management (MewUI has no ObservableCollection or ItemsSource). - Loop Prevention: Apply suppression flags to avoid infinite update cycles between controls and bindings. - Use Case: Build a settings form where a TextBox two-way binds to a username, a Slider binds to a volume value, and a submit Button enables only when validation passes. ## Quick Start Ask the AI to create a MewUI ViewModel with ObservableValue properties and bind a TextBox and Button to them using the fluent binding extensions.

Frequently Asked Questions about binding-mewui-data

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I bind a MewUI TextBox to a ViewModel property?▼

Create an ObservableValue<string> property on your ViewModel and call BindText on the TextBox, passing the ObservableValue. This creates a two-way binding so typing in the TextBox updates the source and source changes update the control.

How do I create computed properties in a MewUI ViewModel?▼

Subscribe to the Changed event of each source ObservableValue and update the computed value in the handler. For example, subscribe to Price and Quantity changes to recalculate Subtotal, then chain Subtotal changes to update Tax and Total.

Does MewUI support ObservableCollection or ItemsSource for lists?▼

No, MewUI does not have ObservableCollection or ItemsSource. Manage lists manually with a standard List<T>, populate a ListBox using the Items method, and for dynamic updates call ClearItems followed by AddItem for each entry.

Why does my MewUI binding cause an infinite update loop?▼

Loops occur when a control property setter writes back to the binding while the binding is updating the control. Add a boolean suppression flag, set it before applying source-driven changes, and skip the binding Set call while the flag is active.

How do I constrain an ObservableValue to a valid range?▼

Pass a coerce function to the ObservableValue constructor, such as v => Math.Clamp(v, 0, 100) for a percentage. Every assignment to Value is then automatically constrained before the Changed event fires.