Calendar
位于带边框卡片中的月视图,带有月份与年份选择器。
示例可交互
Live demo unavailable
<Calendar SelectedDate="2025-03-14" DisplayDate="2025-03-14" HorizontalAlignment="Left" />用法
主题覆盖 Calendar 及其 CalendarItem、CalendarDayButton 与 CalendarButton:带 12px 内边距的带边框卡片,包含上一月与下一月按钮、两者之间是月份与年份的表头,弱化的星期标题,以及日期。SelectedDate 与 DisplayDate 是 Avalonia 的属性;FirstDayOfWeek 让一周从另一天开始,SelectionMode 允许选择范围。今天始终用强调色标记;请保持 IsTodayHighlighted 开启。
日期状态:本月之外的日期弱化,今天是强调色,悬停的日期为 UIKit.SecondaryHover,选中的日期为主色,blackout 日期以一半强度弱化且没有悬停效果。DisplayMode="Year" 以三列完整月份名显示月份网格,选中的月份为主色;Avalonia 的表头表现为一个按钮。
| 样式类 | 单元格 | 宽度 |
|---|---|---|
small | 28px | 220px |
| (medium) | 32px | 248px |
large | 40px | 304px |
若需要并排的多个月份、范围、禁用的星期或年份网格,请使用 uikit:CalendarView。
示例
small 与 large 尺寸的日历。
Live demo unavailable
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Calendar Classes="small" SelectedDate="2025-03-14" DisplayDate="2025-03-14" VerticalAlignment="Top" />
<Calendar Classes="large" SelectedDate="2025-03-14" DisplayDate="2025-03-14" VerticalAlignment="Top" />
</WrapPanel>DisplayMode="Year" 所显示的月份网格。
Live demo unavailable
<Calendar DisplayMode="Year" SelectedDate="2025-03-14" DisplayDate="2025-03-14" HorizontalAlignment="Left" />FirstDayOfWeek="Monday" 会重排星期标题与网格。
Live demo unavailable
<Calendar FirstDayOfWeek="Monday" SelectedDate="2025-03-14" DisplayDate="2025-03-14" HorizontalAlignment="Left" />