FuncUI
GitHub Repository
  • Getting Started
  • View Basics
    • Creating views
    • Lifetime
    • Attributes
    • How to create bindings
  • Components
    • Component basics
    • Component lifetime
    • Hooks
  • Common Questions
  • Controls
    • Button
    • Border
    • Calendar
    • CalendarDatePicker
    • CheckBox
    • DatePicker
    • DockPanel
    • Expander
    • ListBox
    • Menu
    • NativeMenu
    • NumericUpDown
    • ProgressBar
    • RadioButton
    • RepeatButton
    • Slider
    • StackPanel
    • Tabs
    • TextBlock
    • TextBox
    • TimePicker
    • ToggleButton
    • ToggleSwitch
Powered by GitBook
On this page
  1. Controls

ToggleSwitch

Note: You can check the Avalonia docs for the ToggleSwitch API if you need more information.

For Avalonia.FuncUI's DSL properties you can check ToggleSwitch.fs

A ToggleSwitch is a switch that toggles between on (checked) and off (unchecked) states. This control functions similarly to a CheckBox but displays the content with an on/off slider instead.

Usage

Create a ToggleSwitch

ToggleSwitch.create [
    ToggleSwitch.content "Title"
]

Register State Change

ToggleSwitch.create [
    ToggleSwitch.isChecked state.toggleSwitch
    ToggleSwitch.onIsPressedChanged (fun value -> SwitchToggled value |> dispatch)
]

Handle state changes Separately

ToggleSwitch.create [
    ToggleSwitch.content "Fullscreen"
    ToggleSwitch.onChecked (fun _ -> dispatch Fullscreen)
    ToggleSwitch.onUnchecked (fun _ -> dispatch Windowed)
]

Tristate Toggling

ToggleSwitch.isChecked can take values that are bool, Nullable<bool>, or bool option. When using tristate options however, you must use either Nullable<bool> or bool option. You can also handle each event state like above using onChecked, onUncheked, and onIndeterminate.

ToggleSwitch.create [
    // can be either true or false
    ToggleSwitch.isThreeState state.indeterminate
    // this value is required to be either a nullable boolean
    // or a boolean option
    ToggleSwitch.isChecked state.checked
    // Returns a Nullable<bool> value
    ToggleSwitch.onIsCheckedChanged (fun nullabelVal -> OnChecked val |> dispatch)
]

Last updated 3 years ago