Skip to content
This repository has been archived by the owner on Jun 25, 2023. It is now read-only.

Latest commit

 

History

History
70 lines (56 loc) · 1.82 KB

ListBox.md

File metadata and controls

70 lines (56 loc) · 1.82 KB
layout name group
control
ListBox
controls

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

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

The list box is a multi-line control box for allowing a user to choose value.

Usage

Create a list box

ListBox.create [
    ListBox.dataItems [ "Linux"; "Mac"; "Windows" ]
]

Multiple Item Selection Mode

You can choose different ListBox Selection Modes. The default is to only select a single element.

ListBox.create [
    ListBox.dataItems [ "Linux"; "Mac"; "Windows" ]
    ListBox.selectionMode Selection.Multiple
]

Using Discriminated Unions

type OperatingSystem =
    | Linux
    | Mac
    | Windows

ListBox.create [
    ListBox.dataItems [ Linux; Mac; Windows ]
]

Controlling Selected Item

To override the controls default behavior you need to add both selectedItem and onSelectedItemChanged

ListBox.create [
    ListBox.dataItems [ "Linux"; "Mac"; "Windows" ]
    ListBox.selectedItem state.os
    ListBox.onSelectedItemChanged (fun os -> dispatch ChangeOs)
]

Controlling Selected Item by Index

To override the controls default behavior you need to add both selectedItem and onSelectedItemChanged

ListBox.create [
    ListBox.dataItems [ "Linux"; "Mac"; "Windows" ]
    ListBox.selectedIndex state.osIndex
    ListBox.onSelectedIndexChanged (fun os -> dispatch ChangeOsIndex)
]