Xamarin.iOS 中的选取器控件
使用 UIPickerView
,可以通过滚动轮式界面的各个组件来从列表中选取值。
选取器通常用于选择日期和时间;Apple 提供了 UIDatePicker
类来实现此目的。
本文介绍了如何实现和使用 UIPickerView
和 UIDatePicker
控件。
UIPickerView
实现选取器
通过实例化新 UIPickerView
来实现选取器:
UIPickerView pickerView = new UIPickerView(
new CGRect(
UIScreen.MainScreen.Bounds.X - UIScreen.MainScreen.Bounds.Width,
UIScreen.MainScreen.Bounds.Height - 230,
UIScreen.MainScreen.Bounds.Width,
180
)
);
选取器和情节提要
若要在“iOS 设计器”中创建选取器,请从“工具箱”中将“选取器视图”拖到设计界面。
使用选取器控件
选取器使用一个模型与数据进行交互:
public override void ViewDidLoad()
{
base.ViewDidLoad();
var pickerModel = new PeopleModel(personLabel);
personPicker.Model = pickerModel;
}
UIPickerViewModel
基类实现了两个接口:IUIPickerDataSource
和 IUIPickerViewDelegate
,它们声明了各种方法,用于指定选取器的数据及其处理交互的方式:
public class PeopleModel : UIPickerViewModel
{
public string[] names = new string[] {
"Amy Burns",
"Kevin Mullins",
"Craig Dunn",
"Joel Martinez",
"Charles Petzold",
"David Britch",
"Mark McLemore",
"Tom Opegenorth",
"Joseph Hill",
"Miguel De Icaza"
};
private UILabel personLabel;
public PeopleModel(UILabel personLabel)
{
this.personLabel = personLabel;
}
public override nint GetComponentCount(UIPickerView pickerView)
{
return 2;
}
public override nint GetRowsInComponent(UIPickerView pickerView, nint component)
{
return names.Length;
}
public override string GetTitle(UIPickerView pickerView, nint row, nint component)
{
if (component == 0)
return names[row];
else
return row.ToString();
}
public override void Selected(UIPickerView pickerView, nint row, nint component)
{
personLabel.Text = $"This person is: {names[pickerView.SelectedRowInComponent(0)]},\n they are number {pickerView.SelectedRowInComponent(1)}";
}
public override nfloat GetComponentWidth(UIPickerView picker, nint component)
{
if (component == 0)
return 240f;
else
return 40f;
}
public override nfloat GetRowHeight(UIPickerView picker, nint component)
{
return 40f;
}
选取器可以包含多个列或组件。 各个组件将选取器分割为多个部分,以便更轻松地进行更具体的数据选择:
若要指定选取器中的组件数,请使用 GetComponentCount
方法。
自定义选取器的外观
若要自定义选取器的外观,请使用 UIPickerView.UIPickerViewAppearance
类或替代 UIPickerViewModel
中的 GetView
和 GetRowHeight
方法。
UIDatePicker
实现日期选取器
通过实例化 UIDatePicker
来实现选取器:
UIPickerView pickerView = new UIPickerView(
new CGRect(
UIScreen.MainScreen.Bounds.X - UIScreen.MainScreen.Bounds.Width,
UIScreen.MainScreen.Bounds.Height - 230,
UIScreen.MainScreen.Bounds.Width,
180
)
);
日期选取器和情节提要
若要在“iOS 设计器”中创建日期选取器,请从“工具箱”中将“日期选取器”拖到设计界面。
日期选取器属性
最小和最大日期
MinimumDate
和 MaximumDate
限制日期选取器中可用的日期范围。 例如,以下代码将日期选择器限制为直至当前时刻的过去 60 年:
var calendar = new NSCalendar(NSCalendarType.Gregorian);
var currentDate = NSDate.Now;
var components = new NSDateComponents();
components.Year = -60;
NSDate minDate = calendar.DateByAddingComponents(components, currentDate, NSCalendarOptions.None);
datePickerView.MinimumDate = minDate;
datePickerView.MaximumDate = currentDate;
提示
可以将 DateTime
显式转换为 NSDate
:
DatePicker.MinimumDate = (NSDate)DateTime.Today.AddDays (-7);
DatePicker.MaximumDate = (NSDate)DateTime.Today.AddDays (7);
分钟间隔
MinuteInterval
属性设置选取器将用于显示分钟数的间隔:
datePickerView.MinuteInterval = 10;
模型
日期选取器支持四种模式,如下所述:
UIDatePickerMode.Time
UIDatePickerMode.Time
显示时间与小时和分钟选择器以及可选的 AM 或 PM 指定:
datePickerView.Mode = UIDatePickerMode.Time;
UIDatePickerMode.Date
UIDatePickerMode.Date
显示日期以及月份、日和年份选择器:
datePickerView.Mode = UIDatePickerMode.Date;
选择器的顺序取决于日期选取器的区域设置,默认情况下使用系统区域设置。 上图显示了 en_US
区域设置中选择器的布局,但以下设置将顺序更改为“日 | 月 | 年”。
datePickerView.Locale = NSLocale.FromLocaleIdentifier("en_GB");
UIDatePickerMode.DateAndTime
UIDatePickerMode.DateAndTime
显示日期的缩短视图、以小时和分钟显示的时间,以及可选的 AM 或 PM 指定(具体取决于使用的是 12 小时制还是 24 小时制):
datePickerView.Mode = UIDatePickerMode.DateAndTime;
与使用 UIDatePickerMode.Date
时一样,选择器的顺序以及 12 或 24 小时制的使用取决于日期选取器的区域设置。
提示
请使用 Date
属性捕获 UIDatePickerMode.Time
、UIDatePickerMode.Date
或 UIDatePickerMode.DateAndTime
模式下日期选取器的值。 此值存储为 NSDate
。
UIDatePickerMode.CountDownTimer
UIDatePickerMode.CountDownTimer
显示小时和分钟值:
datePickerView.Mode = UIDatePickerMode.CountDownTimer;
CountDownDuration
属性捕获 UIDatePickerMode.CountDownTimer
模式下日期选取器的值。 例如,若要将倒计时值加到当前日期:
var currentTime = NSDate.Now;
var countDownTimerTime = datePickerView.CountDownDuration;
var finishCountdown = currentTime.AddSeconds(countDownTimerTime);
dateLabel.Text = "Alarm set for:" + coundownTimeformat.ToString(finishCountdown);
NSDateFormatter
若要设置 NSDate
的格式,请使用 NSDateFormatter
。
若要使用 NSDateFormatter
,请调用其 ToString
方法。 例如:
var date = NSDate.Now;
var formatter = new NSDateFormatter();
formatter.DateStyle = NSDateFormatterStyle.Full;
formatter.TimeStyle = NSDateFormatterStyle.Full;
var formattedDate = formatter.ToString(d);
// Tuesday, August 14, 2018 at 11:20:42 PM Mountain Daylight Time
DateFormat
NSDateFormatter
的 DateFormat
属性(一个字符串)允许使用可自定义的日期格式规范:
NSDateFormatter dateFormat = new NSDateFormatter();
dateFormat.DateFormat = "yyyy-MM-dd";
TimeStyle
NSDateFormatter
的 TimeStyle
属性(一种 NSDateFormatterStyle
)基于预先确定的样式指定时间格式设置:
NSDateFormatter timeFormat = new NSDateFormatter();
timeFormat.TimeStyle = NSDateFormatterStyle.Short;
各种 NSDateFormatterStyle
值如下所示显示时间:
NSDateFormatterStyle.Full
:7:46:00 PM 东部夏令时NSDateFormatterStyle.Long
:7:47:00 PM 东部夏令时NSDateFormatterStyle.Medium
:7:47:00 PMNSDateFormatterSytle.Short
:7:47 PM
DateStyle
NSDateFormatter
的 DateStyle
属性(一种 NSDateFormatterStyle
)基于预先确定的样式指定日期格式设置:
NSDateFormatter dateTimeformat = new NSDateFormatter();
dateTimeformat.DateStyle = NSDateFormatterStyle.Long;
各种 NSDateFormatterStyle
值如下所示显示日期:
NSDateFormatterStyle.Full
:Wednesday, August 2, 2017 at 7:48 PMNSDateFormatterStyle.Long
:August 2, 2017 at 7:49 PMNSDateFormatterStyle.Medium
:Aug 2, 2017, 7:49 PMNSDateFormatterStyle.Short
:8/2/17, 7:50 PM
注意
DateFormat
和 DateStyle
/TimeStyle
提供了用于指定日期和时间格式设置的各种方式。 最新设置的属性决定了日期格式化程序的输出。