[flutter]플러터 시간/날짜/요일 가져오기 및 시간 자동 갱신 방법(TimerBuilder)

플러터에서 시간, 날짜, 요일을 가져오고 가져온 값을 이용해 화면에 자동으로 갱신하며 보여주는 방법을 알아보겠습니다.

 

 

▣ 시간, 날짜, 요일 가져오는 방법

1. 패키지 설치

플러터에서 시간, 날짜, 요일을 가져오기 위해선 두 가지 패키지를 설치해야 합니다.

timer_builder패키지는 시간, 날짜, 요일을 가져오기 위해 필요하며, intl패키지는 원하는 형태로 시간, 날짜, 요일을 보여주기 위해 필요합니다. 예를 들면 2022년을 2022로 표기할 수도 있고 22로 표기할 수도 있습니다. 

아래 코드를 pubspec.yaml파일에 입력하고 pub get버튼을 눌러 패키지를 설치합니다.

timer_builder: ^2.0.0
intl: ^0.17.0

 

2. import

원하는.dart파일에 아래 코드를 import 합니다.

import 'package:timer_builder/timer_builder.dart';
import 'package:intl/intl.dart';

 

3. 시간, 날짜, 요일 가져오기

아래 코드를 통해 현재 시간, 날짜, 요일을 가져옵니다.

var now = DateTime.now();

 

4. 시간, 날짜, 요일을 원하는 형태로 만들기

아래 코드처럼 DateFormat을 이용해 now변수의 시간, 요일, 날짜를 원하는 형태로 변경해줍니다.\

DateFormat('h:mm s a - EEEE, d MMM yyy').format(now);

• h - 시
• mm - 분
• s - 초
• a - 오전/오후
• EEEE - 요일
• d - 일
• MMM - 월
• yyy - 년

 

 

▣ 시간 자동 갱신하는 방법

초단위로 또는 분단위로 화면에 표시하고 싶을 때 TimerBuilder위젯을 사용하면 됩니다.

 

- TimerBuilder 사용방법

아래는 TimerBuilder.periodic의 인자에 대한 설명입니다.

Duration : 갱신하려고 하는 시간(ex 1초마다 갱신을 하고 싶으면 seconds:1

builder: 함수 형태이고 return값이 있어야 함 return값에 Text위젯을 이용해 현재 시간을 표시해줄 수 있음

TimerBuilder.periodic(Duration(seconds: 1),
    builder: (context) {
     return Text(
        '${DateFormat('h:mm:s a').format(DateTime.now())}',
  );
}),