플러터의 TimePicker 위젯은 사용자로부터 시간을 선택할 수 있는 기능을 제공합니다. 하지만 때때로 특정 시간 범위 이외의 시간을 선택하지 못하도록 제한해야 할 때가 있을 수 있습니다. 이 글에서는 플러터 TimePicker에서 특정 시간 범위 이외의 시간을 선택하지 못하도록 하는 방법을 알아보겠습니다.

1. 시간 범위 제한하기

TimePicker 위젯에는 선택 가능한 시간 범위를 지정하는 기능이 내장되어 있지 않습니다. 따라서, 이 기능을 구현하려면 커스텀 다이얼로그나 특정 라이브러리를 이용해야 할 수도 있습니다. 하지만, 간단한 방법으로 선택 가능한 시간 범위를 제한하는 방법을 소개하겠습니다.

TimeOfDay selectedTime;

Future<void> _selectTime(BuildContext context) async {
  final TimeOfDay picked = await showTimePicker(
    context: context,
    initialTime: selectedTime,
    
    // 시간 범위 설정
    builder: (BuildContext context, Widget child) {
      return MediaQuery(
        data: MediaQuery.of(context).copyWith(alwaysUse24HourFormat: true),
        child: child,
      );
    },
  );

  if (picked != null && picked != selectedTime) {
    setState(() {
      selectedTime = picked;
    });
  }
}

위 코드에서는 _selectTime 메소드를 통해 TimePicker를 호출합니다. showTimePicker 함수의 builder 파라미터를 이용하여 시간 범위를 설정합니다. 위 코드에서는 alwaysUse24HourFormat를 true로 설정하여 24시간 형식을 사용하도록 했습니다. 이를 통해 사용자가 올바른 시간 범위 내에서 시간을 선택하도록 제한할 수 있습니다.

2. 추가적인 제한 사항

만약 위 방법으로 시간 범위를 제한하는 것 외에 추가적인 제한 사항이 필요하다면, 커스텀 다이얼로그를 만들거나 특정 라이브러리를 사용할 수 있습니다. 다음은 몇 가지 유용한 라이브러리입니다:

• flutter_time_picker_spinner: 다양한 시간 선택 기능을 제공하는 라이브러리입니다.
• flutter_cupertino_date_picker: iOS 스타일의 날짜 및 시간 선택 기능을 제공하는 라이브러리입니다.

이외에도 다양한 라이브러리가 있으니 상황에 맞게 선택하여 사용하시면 됩니다.

3. 결론

플러터의 TimePicker에서 시간 범위를 제한하는 방법을 알아보았습니다. 선택 가능한 시간 범위를 제한함으로써 원하는 기능을 구현할 수 있습니다. 추가적인 제한 사항이 필요하다면 커스텀 다이얼로그나 라이브러리를 이용하여 구현할 수도 있습니다.