日期和时间选择
需要用户日期或时间的Xamarin.Forms应用程序可以使用DatePicker或TimePicker视图。
它们非常相似:两个视图只在类似于Entry视图的框中显示日期或时间。 点击视图会调用特定于平台的日期或时间选择器。 然后,用户选择(或拨入)新的日期或时间并发出完成信号。
DatePicker
DatePicker有三个DateTime类型的属性:
- MimumDate,初始化为1900年1月1日
- MaximumDate,初始化为2100年12月31日
- 日期,初始化为DateTime.Today
只要MinimumDate在MaximumDate之前,程序就可以将这些属性设置为它想要的任何属性。 Date属性反映了用户的选择。
如果您想在XAML中设置这些属性,可以使用x:DateTime元素。 使用DateTime.Parse方法可接受的格式以及CultureInfo.InvariantCulture的第二个参数。 可能最简单的是短日期格式,即两位数的月份,两位数的日期和四位数的年份,用斜线分隔:
<DatePicker __ >
<DatePicker.MinimumDate>
03/01/2016
</DatePicker.MinimumDate>
<DatePicker.MaximumDate>
10/31/2016
</DatePicker.MaximumDate>
<DatePicker.Date>
04/24/2016
</DatePicker.Date>
</DatePicker>
DatePicker使用常规ToString方法显示所选日期,但您可以将视图的Format属性设置为自定义.NET格式字符串。 初始值为“d” - 短格式。
这是来自名为DaysBetweenDates的程序的XAML文件,它允许您选择两个日期,然后计算它们之间的天数。 它包含两个标记为To和From的DatePicker视图:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DaysBetweenDates.DaysBetweenDatesPage">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness"
iOS="10, 30, 10, 0"
Android="10, 10, 10, 0"
WinPhone="10, 10, 10, 0" />
</ContentPage.Padding>
<StackLayout>
<StackLayout.Resources>
<ResourceDictionary>
<Style TargetType="DatePicker">
<Setter Property="Format" Value="D" />
<Setter Property="VerticalOptions" Value="Center" />
<Setter Property="HorizontalOptions" Value="FillAndExpand" />
</Style>
</ResourceDictionary>
</StackLayout.Resources>
<!-- Underlined text header -->
<StackLayout Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"
VerticalOptions="CenterAndExpand"
HorizontalOptions="Center">
<Label Text="Days between Dates"
FontSize="Large"
FontAttributes="Bold"
TextColor="Accent" />
<BoxView Color="Accent"
HeightRequest="3" />
</StackLayout>
<StackLayout Orientation="Horizontal"
VerticalOptions="CenterAndExpand">
<Label Text="From:"
VerticalOptions="Center" />
<DatePicker x:Name="fromDatePicker"
DateSelected="OnDateSelected" />
</StackLayout>
<StackLayout Orientation="Horizontal"
VerticalOptions="CenterAndExpand">
<Label Text=" To:"
VerticalOptions="Center" />
<DatePicker x:Name="toDatePicker"
DateSelected="OnDateSelected" />
</StackLayout>
<Label x:Name="resultLabel"
FontSize="Medium"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage>
隐式样式将两个DatePicker视图的Format属性设置为“D”,这是longdate格式,包括星期和月份名称的文本日。 XAML文件使用两个水平StackLayout对象并排显示Label和DatePicker。
注意:如果使用长日期格式,则需要避免将DatePicker的HorizontalOptions属性设置为Start,Center或End。 如果将DatePicker放在水平StackLayout中(如在此程序中),请将HorizontalOptions设置为FillAndExpand。 否则,如果用户选择的文本字符串长于原始日期,则结果格式不正确。 DaysBetweenDates程序使用隐式样式为DatePicker提供FillAndExpand的HorizontalOptions值,以便它占据水平StackLayout的整个宽度,除了Label占用的内容。
当您点击其中一个DatePicker字段时,会出现特定于平台的面板。 在iOS上,它只占据屏幕的底部,但在Android和Windows 10 Mobile上,它几乎占据了屏幕:
注意iOS上的Done按钮,Android上的OK按钮和Windows Phone上的复选标记工具栏按钮。 所有这三个按钮都会关闭日期选择面板,并通过触发DateSelected事件返回到程序。 DaysBetweenDates代码隐藏文件中的事件处理程序访问两个DatePicker视图并计算两个日期之间的天数:
public partial class DaysBetweenDatesPage : ContentPage
{
public DaysBetweenDatesPage()
{
InitializeComponent();
// Initialize.
OnDateSelected(null, null);
}
void OnDateSelected(object sender, DateChangedEventArgs args)
{
int days = (toDatePicker.Date - fromDatePicker.Date).Days;
resultLabel.Text = String.Format("{0} day{1} between dates",
days, days == 1 ? "" : "s");
}
}
这是结果: