[源码下载]

背水一战 Windows 10 (44) - 控件(日期类): CalendarView, DatePicker, TimePicker

作者:webabcd

介绍
背水一战 Windows 10 之 控件(日期类)

  • CalendarView
  • DatePicker
  • TimePicker

示例
1、CalendarView 的示例
Controls/DateControl/CalendarViewDemo.xaml

<Page
x:Class="Windows10.Controls.DateControl.CalendarViewDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.DateControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" xmlns:common="using:Windows10.Common"> <Page.Resources>
<common:NullableBooleanToBooleanConverter x:Key="NullableBooleanToBooleanConverter" />
</Page.Resources> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <CheckBox Name="chkIsOutOfScopeEnabled" Margin="5" Content="IsOutOfScopeEnabled" IsChecked="True" />
<CheckBox Name="chkIsGroupLabelVisible" Margin="5" Content="IsGroupLabelVisible" IsChecked="True" />
<CheckBox Name="chkIsTodayHighlighted" Margin="5" Content="IsTodayHighlighted" IsChecked="True" />
<ComboBox x:Name="cmbSelectionMode" Margin="5" PlaceholderText="SelectionMode" SelectionChanged="cmbSelectionMode_SelectionChanged">
<ComboBoxItem>None</ComboBoxItem>
<ComboBoxItem>Single</ComboBoxItem>
<ComboBoxItem>Multiple</ComboBoxItem>
</ComboBox>
<ComboBox x:Name="cmbDisplayMode" Margin="5" PlaceholderText="DisplayMode" SelectionChanged="cmbDisplayMode_SelectionChanged">
<ComboBoxItem>Month</ComboBoxItem>
<ComboBoxItem>Year</ComboBoxItem>
<ComboBoxItem>Decade</ComboBoxItem>
</ComboBox>
<ComboBox x:Name="cmbFirstDayOfWeek" Margin="5" PlaceholderText="FirstDayOfWeek" SelectionChanged="cmbFirstDayOfWeek_SelectionChanged">
<ComboBoxItem>Sunday</ComboBoxItem>
<ComboBoxItem>Monday</ComboBoxItem>
<ComboBoxItem>Tuesday</ComboBoxItem>
<ComboBoxItem>Wednesday</ComboBoxItem>
<ComboBoxItem>Thursday</ComboBoxItem>
<ComboBoxItem>Friday</ComboBoxItem>
<ComboBoxItem>Saturday</ComboBoxItem>
</ComboBox> <!--
CalendarView - 日历控件
IsOutOfScopeEnabled - 是否以不同的颜色显示范围外的日历项
IsGroupLabelVisible - 是否在月的第一天或年的第一月的日历项中显示月份或年份
IsTodayHighlighted - 是否高亮显示当天日历项
FirstDayOfWeek - 指定每周的第一天是周几
SelectionMode - 日历的选择模式(None - 禁止选择, Single - 单选, Multiple - 多选)
DisplayMode - 日历的显示模式(Month - 月, Year - 年, Decade - 十年)
Language - 日历上的显示语言
CalendarIdentifier - 控件使用的日历系统,一个字符串值,在 CalendarIdentifiers 类中有封装
SelectedDatesChanged - 选中的日期发生变化时触发的事件
CalendarViewDayItemChanging - 加载日历项时触发的事件 其他大部分属性都是用于配置显示样式的了,具体说明详见文档
另外,在 CalendarView 控件中没有属性可以直接设置当天日历项的背景色(在本例的 code-behind 中给出了解决办法)
-->
<CalendarView Name="calendarView" Margin="5"
IsOutOfScopeEnabled="{x:Bind chkIsOutOfScopeEnabled.IsChecked, Mode=TwoWay, Converter={StaticResource NullableBooleanToBooleanConverter}}"
IsGroupLabelVisible="{x:Bind chkIsGroupLabelVisible.IsChecked, Mode=TwoWay, Converter={StaticResource NullableBooleanToBooleanConverter}}"
IsTodayHighlighted="{x:Bind chkIsTodayHighlighted.IsChecked, Mode=TwoWay, Converter={StaticResource NullableBooleanToBooleanConverter}}"
FirstDayOfWeek="Sunday"
SelectionMode="Single"
DisplayMode="Month"
Language="zh-cn"
CalendarIdentifier="GregorianCalendar"
SelectedDatesChanged="calendarView_SelectedDatesChanged"
CalendarViewDayItemChanging="calendarView_CalendarViewDayItemChanging" /> </StackPanel>
</Grid>
</Page>

Controls/DateControl/CalendarViewDemo.xaml.cs

/*
* CalendarView - 日历控件(继承自 Control, 请参见 /Controls/BaseControl/ControlDemo/)
*
* CalendarViewDayItem - 日历项控件(继承自 Control, 请参见 /Controls/BaseControl/ControlDemo/)
* Date - 获取此日历项的日期(只读)
* IsBlackout - 此日历项是否不可用(通过 CalendarView 的 BlackoutForeground 属性可配置不可用日历项的前景色)
*/ using System;
using Windows.UI;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media; namespace Windows10.Controls.DateControl
{
public sealed partial class CalendarViewDemo : Page
{
public CalendarViewDemo()
{
this.InitializeComponent();
} private void cmbSelectionMode_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
calendarView.SelectionMode = (CalendarViewSelectionMode)Enum.Parse(typeof(CalendarViewSelectionMode), (e.AddedItems[] as ComboBoxItem).Content.ToString());
} private void cmbDisplayMode_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
calendarView.DisplayMode = (CalendarViewDisplayMode)Enum.Parse(typeof(CalendarViewDisplayMode), (e.AddedItems[] as ComboBoxItem).Content.ToString());
} private void cmbFirstDayOfWeek_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
calendarView.FirstDayOfWeek = (Windows.Globalization.DayOfWeek)Enum.Parse(typeof(Windows.Globalization.DayOfWeek), (e.AddedItems[] as ComboBoxItem).Content.ToString());
} // 加载日历项时触发的事件
private void calendarView_CalendarViewDayItemChanging(CalendarView sender, CalendarViewDayItemChangingEventArgs args)
{
// 如果当前加载的日历项时当天的话
if (args.Item.Date.Date.Equals(DateTime.Now.Date))
{
// 修改日历项的背景色(在 CalendarView 控件中没有属性可以直接设置当天日历项的背景色)
// 另外,还有一些日历项的样式无法通过 CalendarView 直接设置,那么都可以考虑像这样做
args.Item.Background = new SolidColorBrush(Colors.Orange);
}
} // 选中的日期发生变化时触发的事件
private void calendarView_SelectedDatesChanged(CalendarView sender, CalendarViewSelectedDatesChangedEventArgs args)
{
// args.RemovedDates - 之前被选中的日期集合
// args.AddedDates - 当前被选中的日期集合 // calendarView.SelectedDates - 当前被选中的日期集合
}
}
}

2、DatePicker 的示例
Controls/DateControl/DatePickerDemo.xaml

<Page
x:Class="Windows10.Controls.DateControl.DatePickerDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.DateControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <TextBlock Name="lblMsg" /> <!--
DatePicker - 日期选择控件
Header - 可以设置一个纯文本,不能命中测试,空 Header 的话不会占用任何空间
HeaderTemplate - 可以将 Header 设置为任何 xaml,且支持命中测试
DateChanged - 选中的日期发生变化时触发的事件
Orientation - 经测试,无效
YearFormat, MonthFormat, DayFormat - 格式化年, 月, 日数据(支持 format templates 和 format patterns) 注:关于 format templates 和 format patterns 请参见
http://msdn.microsoft.com/en-us/library/windows/apps/windows.globalization.datetimeformatting.datetimeformatter.aspx
--> <DatePicker x:Name="datePicker" Header="Date" DateChanged="datePicker_DateChanged" Margin="5" Orientation="Vertical" /> <!--
通过格式模板(format templates)设置 DatePicker 的显示格式
-->
<DatePicker DayFormat="day" MonthFormat="month.numeric" YearFormat="year.abbreviated" Margin="5" /> <!--
通过格式模式(format patterns)设置 DatePicker 的显示格式
-->
<DatePicker DayFormat="{}{day.integer}({dayofweek.abbreviated})" MonthFormat="{}{month.integer(2)}" YearFormat="{}{year.full}" Margin="5" />
<DatePicker DayFormat="{}{day.integer}日 ({dayofweek.abbreviated})" MonthFormat="{}{month.integer(2)}月" YearFormat="{}{year.full}年" Margin="5" /> </StackPanel>
</Grid>
</Page>

Controls/DateControl/DatePickerDemo.xaml.cs

/*
* DatePicker - 日期选择控件(继承自 Control, 请参见 /Controls/BaseControl/ControlDemo/)
* YearVisible, MonthVisible, DayVisible, MinYear, MaxYear, Date, CalendarIdentifier - 详见下面示例代码中的注释
*/ using System;
using Windows.Globalization;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls; namespace Windows10.Controls.DateControl
{
public sealed partial class DatePickerDemo : Page
{
public DatePickerDemo()
{
this.InitializeComponent(); this.Loaded += DatePickerDemo_Loaded;
} void DatePickerDemo_Loaded(object sender, RoutedEventArgs e)
{
// Date - DatePicker 控件当前显示的日期
datePicker.Date = DateTimeOffset.Now.AddMonths(); // MinYear - DatePicker 控件所允许选择的最小的年份
datePicker.MinYear = DateTimeOffset.Now.AddYears(-);
// MaxYear - DatePicker 控件所允许选择的最大的年份
datePicker.MaxYear = DateTimeOffset.Now.AddYears(); // YearVisible - 是否显示 year 选择框
datePicker.YearVisible = true;
// MonthVisible - 是否显示 month 选择框
datePicker.MonthVisible = true;
// DayVisible - 是否显示 day 选择框
datePicker.DayVisible = true; // CalendarIdentifier - DatePicker 控件使用的日历系统,一个字符串值,在 CalendarIdentifiers 类中有封装
datePicker.CalendarIdentifier = CalendarIdentifiers.Gregorian;
} // DatePicker 控件选中的日期发生变化时触发的事件
private void datePicker_DateChanged(object sender, DatePickerValueChangedEventArgs e)
{
// e.OldDate - 原日期
// e.NewDate - 新日期
lblMsg.Text = $"OldDate - {e.OldDate.ToString("yyyy-MM-dd hh:mm:ss")}, NewDate - {e.NewDate.ToString("yyyy-MM-dd hh:mm:ss")}";
}
}
}

3、TimePicker 的示例
Controls/DateControl/TimePickerDemo.xaml

<Page
x:Class="Windows10.Controls.DateControl.TimePickerDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.DateControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <TextBlock Name="lblMsg" Margin="5" /> <!--
TimePicker - 时间选择控件
Header - 可以设置一个纯文本,不能命中测试,空 Header 的话不会占用任何空间
HeaderTemplate - 可以将 Header 设置为任何 xaml,且支持命中测试
TimeChanged - 选中的时间发生变化时触发的事件
-->
<TimePicker Name="timePicker1" Header="Time" TimeChanged="timePicker1_TimeChanged" Margin="5" /> <TimePicker Name="timePicker2" Header="Time" Margin="5" /> </StackPanel>
</Grid>
</Page>

Controls/DateControl/TimePickerDemo.xaml.cs

/*
* TimePicker - 时间选择控件(继承自 Control, 请参见 /Controls/BaseControl/ControlDemo/)
* Time, MinuteIncrement, ClockIdentifier - 详见下面示例代码中的注释
*/ using System;
using Windows.Globalization;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls; namespace Windows10.Controls.DateControl
{
public sealed partial class TimePickerDemo : Page
{
public TimePickerDemo()
{
this.InitializeComponent(); this.Loaded += TimePickerDemo_Loaded;
} void TimePickerDemo_Loaded(object sender, RoutedEventArgs e)
{
// Time - TimePicker 控件当前显示的时间
timePicker1.Time = new TimeSpan(, , ); // MinuteIncrement - 分钟选择框的分钟增量(0, 15, 30, 45)
timePicker1.MinuteIncrement = ; // ClockIdentifier - 小时制式,ClockIdentifiers.TwelveHour(12HourClock),12 小时制
timePicker1.ClockIdentifier = ClockIdentifiers.TwelveHour; // ClockIdentifier - 小时制式,ClockIdentifiers.TwentyFourHour(24HourClock),24 小时制
timePicker2.ClockIdentifier = ClockIdentifiers.TwentyFourHour;
} // TimePicker 控件选中的时间发生变化时触发的事件
private void timePicker1_TimeChanged(object sender, TimePickerValueChangedEventArgs e)
{
// e.OldTime - 原时间
// e.NewTime - 新时间
lblMsg.Text = $"OldTime - {e.OldTime.ToString("c")}, NewTime - {e.NewTime.ToString("c")}";
}
}
}

OK
[源码下载]

背水一战 Windows 10 (44) - 控件(日期类): CalendarView, DatePicker, TimePicker的更多相关文章

  1. 背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog

    [源码下载] 背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog 作者:webabcd 介绍背水一战 Windows 10 之 控 ...

  2. 背水一战 Windows 10 (36) - 控件(弹出类): ToolTip, Popup, PopupMenu

    [源码下载] 背水一战 Windows 10 (36) - 控件(弹出类): ToolTip, Popup, PopupMenu 作者:webabcd 介绍背水一战 Windows 10 之 控件(弹 ...

  3. 背水一战 Windows 10 (35) - 控件(弹出类): FlyoutBase, Flyout, MenuFlyout

    [源码下载] 背水一战 Windows 10 (35) - 控件(弹出类): FlyoutBase, Flyout, MenuFlyout 作者:webabcd 介绍背水一战 Windows 10 之 ...

  4. 背水一战 Windows 10 (34) - 控件(进度类): RangeBase, Slider, ProgressBar, ProgressRing

    [源码下载] 背水一战 Windows 10 (34) - 控件(进度类): RangeBase, Slider, ProgressBar, ProgressRing 作者:webabcd 介绍背水一 ...

  5. 背水一战 Windows 10 (33) - 控件(选择类): ListBox, RadioButton, CheckBox, ToggleSwitch

    [源码下载] 背水一战 Windows 10 (33) - 控件(选择类): ListBox, RadioButton, CheckBox, ToggleSwitch 作者:webabcd 介绍背水一 ...

  6. 背水一战 Windows 10 (32) - 控件(选择类): Selector, ComboBox

    [源码下载] 背水一战 Windows 10 (32) - 控件(选择类): Selector, ComboBox 作者:webabcd 介绍背水一战 Windows 10 之 控件(选择类) Sel ...

  7. 背水一战 Windows 10 (31) - 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButton, AppBarButton, AppBarToggleButton

    [源码下载] 背水一战 Windows 10 (31) - 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButt ...

  8. 背水一战 Windows 10 (30) - 控件(文本类): AutoSuggestBox

    [源码下载] 背水一战 Windows 10 (30) - 控件(文本类): AutoSuggestBox 作者:webabcd 介绍背水一战 Windows 10 之 控件(文本类) AutoSug ...

  9. 背水一战 Windows 10 (29) - 控件(文本类): RichTextBlock, RichTextBlockOverflow, RichEditBox

    [源码下载] 背水一战 Windows 10 (29) - 控件(文本类): RichTextBlock, RichTextBlockOverflow, RichEditBox 作者:webabcd ...

随机推荐

  1. android windows的一些item属性

    <item name="android:windowFrame">@null</item> :Dialog的windowFrame框为无 <item ...

  2. oracle导出expdp导入impdp

    conn sys/password as sysdba;创建用户test1CREATE USER test1 IDENTIFIED BY "pass1";GRANT CONNECT ...

  3. Android Camera后台拍照

    http://item.congci.com/item/android-camera-houtai-paizhao 有许多人希望在不让用户知道的情况下,使用Android后台Service调用摄像头拍 ...

  4. ManageEngine的EventLog Analyzer许可信息

  5. 单片机一种简便的printf调试方案。

    此处引用csdn博客.链接如下. http://blog.csdn.net/cp1300/article/details/7773239 http://blog.csdn.net/aobai219/a ...

  6. ubuntu安装vmare tools

    在vm中安装vm tools, 点击安装 vmware tools cp  VMwareTools-10.0.10-4301679.tar.gz  /home/YOURNAME/    //因为cd ...

  7. 2019.01.23 ural1519 Formula 1(轮廓线dp)

    传送门 轮廓线dpdpdp模板题. 题意简述:给一个放有障碍的网格图,问有多少种方法能使所有非障碍格子都在同一条哈密顿回路上面. 考虑用括号序列的写法来状压这个轮廓线. 用000表示没有插头,111表 ...

  8. Opencv基本数据类型

    1.OpenCV中数据类型和常用数据类型对应 Mat<uchar>                            CV_8U Mat<char>            ...

  9. HDU 5656 CA Loves GCD (容斥)

    题意:给定一个数组,每次他会从中选出若干个(至少一个数),求出所有数的GCD然后放回去,为了使自己不会无聊,会把每种不同的选法都选一遍,想知道他得到的所有GCD的和是多少. 析:枚举gcd,然后求每个 ...

  10. 20145232 《Java程序设计》课程总结

    学期总结 实验报告链接汇总 实验一 Java开发环境的熟悉 实验二 Java面向对象程序设计 实验三 敏捷开发与XP实践 实验四 Andoid开发基础 实验五 Java网络编程 代码托管链接 :Jav ...