다음을 통해 공유

Xamarin.iOS의 선택기 컨트롤

  • 아티클

A 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 클래스 또는 재정의 합니다 GetView 및 GetRowHeight 메서드를 합니다 UIPickerViewModel.

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;

모드

날짜 선택기는 아래에 설명된 4가지 모드를 지원합니다.

UIDatePickerMode.Time

UIDatePickerMode.Time 는 시간 및 분 선택기와 선택적 AM 또는 PM 지정을 사용하여 시간을 표시합니다.

datePickerView.Mode = UIDatePickerMode.Time;

UIDatePickerMode.Time

UIDatePickerMode.Date

UIDatePickerMode.Date 월, 일 및 연도 선택기를 사용하여 날짜를 표시합니다.

datePickerView.Mode = UIDatePickerMode.Date;

UIDatePickerMode.Date

선택기의 순서는 기본적으로 시스템 로캘을 사용하는 날짜 선택기의 로캘에 따라 달라집니다. 위의 이미지는 로캘에 있는 선택기의 레이아웃을 en_US 보여 주지만, 다음은 순서를 Day |로 변경합니다. 월 | 년:

datePickerView.Locale = NSLocale.FromLocaleIdentifier("en_GB");

일 | 월 | 년

UIDatePickerMode.DateAndTime

UIDatePickerMode.DateAndTime 는 날짜, 시간 및 분 단위의 단축된 보기와 선택적 AM 또는 PM 지정을 표시합니다(12시간 또는 24시간 시계 사용 여부에 따라 다름).

datePickerView.Mode = UIDatePickerMode.DateAndTime;

UIDatePickerMode.DateAndTime

마찬가지로 UIDatePickerMode.Date선택기의 순서와 12시간 또는 24시간 클록의 사용은 날짜 선택기의 로캘에 따라 달라집니다.

팁

Date 속성을 사용하여 모드UIDatePickerMode.TimeUIDatePickerMode.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

TimeStyle 속성(NSDateFormatterStyle NSDateFormatter 미리 결정된 스타일에 따라 시간 서식 지정을 지정합니다.

NSDateFormatter timeFormat = new NSDateFormatter();
timeFormat.TimeStyle = NSDateFormatterStyle.Short;

다양한 NSDateFormatterStyle 값은 다음과 같이 시간을 표시합니다.

  • NSDateFormatterStyle.Full: 오후 7:46:00 동부 일광 절약 시간
  • NSDateFormatterStyle.Long: 오후 7:47:00 EDT
  • NSDateFormatterStyle.Medium: 오후 7:47:00
  • NSDateFormatterSytle.Short: 오후 7:47
DateStyle

미리 결정된 스타일에 따라 날짜 서식을 지정하는 속성(aNSDateFormatterStyle)NSDateFormatter입니다DateStyle.

NSDateFormatter dateTimeformat = new NSDateFormatter();
dateTimeformat.DateStyle = NSDateFormatterStyle.Long;

다양한 NSDateFormatterStyle 값은 다음과 같이 날짜를 표시합니다.

  • NSDateFormatterStyle.Full: 2017년 8월 2일 수요일 오후 7:48
  • NSDateFormatterStyle.Long: 2017년 8월 2일 오후 7:49
  • NSDateFormatterStyle.Medium: 8 월 2, 2017, 7:49 오후
  • NSDateFormatterStyle.Short: 8/2/17, 오후 7:50

참고 항목

DateFormat 날짜 및 DateStyle/TimeStyle 시간 서식을 지정하는 다양한 방법을 제공합니다. 가장 최근에 설정된 속성은 날짜 포맷터의 출력을 결정합니다.