Checkbox
二态或不确定状态的选择控件,指示器可独立设置样式。
正在加载交互演示…
func CheckboxExample() *ui.Element {
checked, setChecked := ui.CreateSignal(false)
checkbox := ui.NewCheckbox(ui.CheckboxProps{Checked: func() ui.CheckedState {
return checked()
}, OnCheckedChange: func(next bool, _ *native.Event) {
setChecked(next)
}})
return checkbox.Root().Children(
checkbox.Indicator().
Width(16).Height(16).
BorderWidth(1).BorderRadius(4).BorderColor("#2563eb").
Display("flex").AlignItems("center").JustifyContent("center").
Child(ui.Show(checked, func() *ui.Element {
return ui.SVG().Value(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path d="M3 6l2 2 4-4" fill="none" stroke="#2563eb" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>`).Width(12).Height(12)
})),
ui.Text("Remember me"),
)
}#导入
从 github.com/egoist/quickgui/go/ui 导入 ui。
import (
"github.com/egoist/quickgui/go/native"
"github.com/egoist/quickgui/go/ui"
)#用法
func CheckboxExample() *ui.Element {
checked, setChecked := ui.CreateSignal(false)
checkbox := ui.NewCheckbox(ui.CheckboxProps{Checked: func() ui.CheckedState {
return checked()
}, OnCheckedChange: func(next bool, _ *native.Event) {
setChecked(next)
}})
return checkbox.Root().Children(
checkbox.Indicator().
Width(16).Height(16).
BorderWidth(1).BorderRadius(4).BorderColor("#2563eb").
Display("flex").AlignItems("center").JustifyContent("center").
Child(ui.Show(checked, func() *ui.Element {
return ui.SVG().Value(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path d="M3 6l2 2 4-4" fill="none" stroke="#2563eb" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>`).Width(12).Height(12)
})),
ui.Text("Remember me"),
)
}指示器不附带样式。此示例保留外框,仅在选中时显示 SVG。设置 ReadOnly: true 后,控件仍可获得焦点,但指针或键盘操作不会改变其值。
#结构
checkbox.Rootcheckbox.Indicator
#API 参考
展开条目查看说明和完整签名。短横线表示声明中未记录默认值。
NewCheckbox
查看源码ui.NewCheckbox(props ...CheckboxProps) *CheckboxComponentNewCheckbox declares a Checkbox instance. Optional props provide initial settings.
Reffunc(*native.Node)—
Receives the retained native node after construction. Keep imperative work in event or lifecycle callbacks.
func(*native.Node)查看源码Styleany—
Reusable layout, typography, color, and interaction-state styles. Build with ui.Style() and compose with Merge.
any查看源码ChildrenPartChildren—
Content mounted inside the component. Compound child callbacks run after the parent context exists.
PartChildren查看源码Disabledany—
Prevents activation and exposes the disabled state to accessibility. Compound parts inherit a disabled root.
any查看源码Rolestring—
FocusOnPointerany—
Groupany—
AriaLabelany—
TabIndex*float64—
Controls sequential keyboard focus order. Omit to retain the component’s default focus behavior.
*float64查看源码OnClickfunc(*native.Event)—
Called after QuickGUI resolves an activation, including supported keyboard activation.
func(*native.Event)查看源码OnDoubleClickfunc(*native.Event)—
OnContextMenufunc(*native.Event)—
OnPointerfunc(*native.Event)—
OnMouseEnterfunc(*native.Event)—
OnMouseLeavefunc(*native.Event)—
OnMouseDownfunc(*native.Event)—
OnMouseUpfunc(*native.Event)—
OnKeyDownfunc(*native.Event)—
OnKeyUpfunc(*native.Event)—
OnFocusfunc(*native.Event)—
OnBlurfunc(*native.Event)—
Valuestring—
The current controlled value. Update application state from the change callback to accept a new value.
string查看源码Parentbool—
ChildrenCheckedfunc() []bool—
Reads the checked states used to derive a parent checkbox’s on, off, or mixed state.
func() []bool查看源码ReadOnlybool—
Checkedfunc() CheckedState—
Controlled selection state. A checkbox also accepts the indeterminate state where supported.
func() CheckedState查看源码DefaultCheckedCheckedState—
OnCheckedChangefunc(bool, *native.Event)—
Checkbox.Disabled
查看源码checkbox.Disabled(value any) *CheckboxComponentPrevents activation and exposes the disabled state to accessibility. Compound parts inherit a disabled root.
Checkbox.Value
查看源码checkbox.Value(value string) *CheckboxComponentThe current controlled value. Update application state from the change callback to accept a new value.
Checkbox.Parent
查看源码checkbox.Parent(value bool) *CheckboxComponentMarks a checkbox as a parent whose state is derived from its children.
Checkbox.ChildrenChecked
查看源码checkbox.ChildrenChecked(value any) *CheckboxComponentReads the checked states used to derive a parent checkbox’s on, off, or mixed state.
Checkbox.ReadOnly
查看源码checkbox.ReadOnly(value bool) *CheckboxComponentPreserves the current value while keeping the control available for focus and inspection.
Checkbox.Checked
查看源码checkbox.Checked(value any) *CheckboxComponentControlled selection state. A checkbox also accepts the indeterminate state where supported.
Checkbox.DefaultChecked
查看源码checkbox.DefaultChecked(value CheckedState) *CheckboxComponentInitial checked state when no controlled Checked accessor is supplied.
Checkbox.OnCheckedChange
查看源码checkbox.OnCheckedChange(value func(bool, *native.Event)) *CheckboxComponentReports the next checked state after user interaction.
Checkbox.Root
查看源码checkbox.Root() *ElementConfigures root for this part. The declared type and source define the accepted value.
Checkbox.Indicator
查看源码checkbox.Indicator(options ...PartProps) *ElementConfigures indicator for this part. The declared type and source define the accepted value.
Reffunc(*native.Node)—
Receives the retained native node after construction. Keep imperative work in event or lifecycle callbacks.
func(*native.Node)查看源码Styleany—
Reusable layout, typography, color, and interaction-state styles. Build with ui.Style() and compose with Merge.
any查看源码ChildrenPartChildren—
Content mounted inside the component. Compound child callbacks run after the parent context exists.
PartChildren查看源码Disabledany—
Prevents activation and exposes the disabled state to accessibility. Compound parts inherit a disabled root.
any查看源码Rolestring—
FocusOnPointerany—
Groupany—
AriaLabelany—
TabIndex*float64—
Controls sequential keyboard focus order. Omit to retain the component’s default focus behavior.
*float64查看源码OnClickfunc(*native.Event)—
Called after QuickGUI resolves an activation, including supported keyboard activation.
func(*native.Event)查看源码OnDoubleClickfunc(*native.Event)—
OnContextMenufunc(*native.Event)—
OnPointerfunc(*native.Event)—
OnMouseEnterfunc(*native.Event)—
OnMouseLeavefunc(*native.Event)—
OnMouseDownfunc(*native.Event)—
OnMouseUpfunc(*native.Event)—
OnKeyDownfunc(*native.Event)—
OnKeyUpfunc(*native.Event)—
OnFocusfunc(*native.Event)—
OnBlurfunc(*native.Event)—
Element
查看源码part.Child(content).Style(style)Every part returns a fluent element. Strings, numbers, elements, and deferred child factories compose directly.
ChildChild(child any) *Element—
Child appends content and returns this element. Content can be an element, native node, scalar, accessor, or node-returning construction callback.
Child(child any) *Element查看源码ChildrenChildren(children ...any) *Element—
Children appends multiple children in order without replacing existing content. It also accepts []any, []*Element, and []*native.Node slices as arguments. Read the retained child nodes through element.Node.Children.
Children(children ...any) *Element查看源码StyleStyle(style StyleBuilder) *Element—
Style merges a reusable style. Scalar accessors retain independent native bindings.
Style(style StyleBuilder) *Element查看源码OnClickOnClick(handler func()) *Element—
RefRef(handler func(*native.Node)) *Element—
Ref exposes the native handle once at this point in the declaration chain.
Ref(handler func(*native.Node)) *Element查看源码