[Flutter] Enum

Tyger·2023년 1월 30일

Enum ON class dart dataclass enumclass enumtype extension flutter type

Enum

이번 글에서는 Dart언어의 Enum 타입에 대해서 알아보자.

Enum은 열거형 타입 이라고 해서 서로 연관된 상수를 모아놓은 집합이라고 한다.
Flutter 개발을 하다보면 Flutter에서 기본적으로 제공해주는 생각보다 많은 기능이 Enum 타입으로 작성되어 있는 것을 고려하면 잘 모르고 있더라도 사용은 해봣을 것이다.

Dart Enum은 Swift, Kotlin의 언어들과 조금 다르다. 네이티브 언어를 접해본 사람이라면 이 부분이 조금 불편하게 느껴질 수도 있었다.

Dart에서 Enum 타입에는 많은 변화가 있었는데, 저는 Enum 타입을 잘 사용하지 않고 있었다가 2.17 버전 부터 Enum 타입을 폭 넓게 사용할 수 있는 수준으로 업그레이드가 되면서 자주 사용할 것 같은 느낌을 받았다.
어떻게 변화하였는지 예시를 통해 알아보자.

2.15 이전

가장 기본적인 Enum에 대해서 코드를 보면 아래 해당 코드가 끝이다. 간단하다.
하지만 사용할 때는 간단하지 않고 단순한 코드가 반복되게 되면서 가독성이 떨어진다는 단점이 있어 사용을 거의 안했었다.

Enum 안에는 아래와 같이 연관된 상수를 넣어 주면 되는데, 문법 구조에서 Enum은 class와 같게 대문자로 시작을 하고 type을 선언할 때는 소문자를 먼저 작성하도록 하여야 한다.

enum Color {red, blue}
enum State {loading, loaded, error}

Enum 타입을 출력하면 어떻게 될까? 바로 아래와 같은 결과가 나온다. Enum 타입을 사용할 떄 "불루"라는 문자열 하나를 얻기 위해서는 결국 조건식을 또 작성하여야 하는 번거로움이 있다.

void main() {
  print(Color.blue);
}
// Color.blue

Enum 타입을 생성하고 선언하는건 간단한데, 사용하는 데에는 다소 불편함이 있는 이유가 다른 언어와는 달리 Enum을 문자열로 변환해주는 기능을 지원하지 못해서 그렇다.

String colorPicker(Color color) {
  String picker = "블랙";
  switch(color){
     case Color.red:
      picker = "레드";
      break;
     case Color.blue:
      picker = "블루";
      break;
     case Color.yellow:
      picker = "옐로우";
      break;
    default:
      picker = picker;
  }
  return picker;

아니면 extension을 사용해서 코드를 작성하기도 했다.

extension ColorExtension on Color {
...
}

2.15

2.15 버전에서 Enum 타입은 약간의 업그레이드를 진행해 줬다. 바로 byName과 name이라는 기능인데, 아래와 같이 byName(${타입})으로 Enum을 사용할 수 있게 해줬다.

 Color red = Color.values.byName("red");
 print(red);

2.17

위에서 살펴본 Enum 타입은 뭔가 부족한 느낌이 들었는데, 2.17부터 기능이 대폭 업그레이드 되면서 강력한 기능으로 돌아왔다. 우선 간단한 예제를 보자 !

예제를 보면 Enum 타입이 데이터를 갖는 클래스 기능을 갖추게 되었다.

기존 Enum 타입은 단순히 상태를 비교하기 위한 수준으로만 사용하였는데, 이제는 Enum 타입을 클래스 처럼 사용할 수 있다는 것이다.

enum NewColor {
  red("레드", "red"),
  blue("블루", "blue"),
  white("화이트", "white"),
  amber("엠버","amber");
  
  final String korean;
  final String english;  
  const NewColor(this.korean, this.english);    
}

  print(NewColor.amber.korean);
  print(NewColor.amber.english);
  // 엠버
  // amber

좀 더 실용적인 예제를 만들어봤다.

차량을 주문했을 때 주문 상태에 따른 UI를 나타낸다고 가정을 해보자.
상태는 생산 대기중 / 생산 중 / 차량 탁송 중 / 배송완료 이렇게 4가지의 상태를 가정하였고, 생산중 / 배송완료 상태일 때는 차량의 생산 정보를 담은 페이지로 이동할 수 있는 라우터를 추가하고, 차량 탁송 중 / 배송완료 일 때는 추적이 가능한 상태로 만들었다.

이렇게 Enum에 클래스 기능까지 합쳐져 있어 데이터 관리가 한결 수월해졌다고 볼 수 있다.

enum CarOrderState {
  wating(title:"대기 중...", state: "wating", buttonColor: "Grey"),
  working(title:"작업 중...", state: "wating", buttonColor: "Black", router: "작업 중인 페이지로 이동"),
  delivery(title:"배송 중...", state: "wating", buttonColor: "Blue", isDelivery : true),
  arrive(title:"도착...", state: "wating", buttonColor: "Grey", router: "차량 주문 내역 페이지로 이동", isDelivery : true);
  
  final String title;
  final String state;
  final String buttonColor;
  final String? router;
  final bool isDelivery;
  const CarOrderState({
    required this.title,
    required this.state,
    required this.buttonColor,
    this.router,
    this.isDelivery = false,
  });
}

void currentState(CarOrderState state){
  print("title : ${state.title}");
  print("state : ${state.state}");
  print("buttonColor : ${state.buttonColor}");
  print("router : ${state.router}");
  print("isDelivery : ${state.isDelivery}");
}

  currentState(CarOrderState.working);

  // title : 작업 중...
  // state : wating
  // buttonColor : Grey
  // router : 작업 중인 페이지로 이동
  // isDelivery : false