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

CalendarDatePicker

Last updated 2 years ago

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

For Avalonia.FuncUI's DSL properties you can check

The CalendarDatePicker control is a single date picker that displays a calendar, it is also possible to enter a date via the TextBox the control has

Usage

Set Date

CalendarDatePicker.create [
  CalendarDatePicker.selectedDate DateTime.Today
]

Set DateFormat

CalendarDatePicker.create [
  CalendarDatePicker.selectedDateFormat DatePickerFormat.Long
]

CalendarDatePicker.create [
  CalendarDatePicker.selectedDateFormat DatePickerFormat.Short
]

CalendarDatePicker.create [
  CalendarDatePicker.selectedDateFormat DatePickerFormat.Custom
  // It can be any valid DateFormat string
  CalendarDatePicker.customDateFormatString "MMMM dd, yyyy"
]

Set Start Display Date

Sets the first date available to display

let startFromYesterday =
   DateTime.Today.Subtract(TimeSpan.FromDays(1.0))
CalendarDatePicker.create [
  CalendarDatePicker.displayDateStart startFromYesterday
]

Set End Display Date

Sets the last date available to display

let showUpToTomorrow =
  DateTime.Today.Add(TimeSpan.FromDays(1.0))
CalendarDatePicker.create [
  CalendarDatePicker.displayDateStart showUpToTomorrow
]

Set Watermark

Sets the watermark (placeholder) for the TextBox that is included in this control

CalendarDatePicker.create [
  CalendarDatePicker.watermark "Select a date"
]

For more information about the CalendarDatePickerFormat check

You can check Microsoft docs for more information about the format string

CalendarDatePicker API
CalendarDatePicker.fs
DatePickerFormat
Custom date and time format strings