개발아빠/Flutter

플러터(Flutter)로 화폐 단위 표현하기 / Currency Format

육아개발아빠 2020. 10. 20. 13:28
반응형

안녕하세요.

개발아빠입니다. 

 

오늘은 제가 계속적으로 공부하면서 만드는 PWA / 안드로이드앱 - 아이가 자란다 에서 

가격을 보여주는 기능을 개발을 하다가,

가격을 표시해주기 위해서 처리했던 내용을 공유해드릴까 합니다.

 

오늘은 간단하니 잠시만 봐주세요~

 

상품상세 페이지를 만들고 있는데, 아래와 같이 금액표시가 일반적이지 않게 되고 있네요~

이걸 간단하게 처리해보겠습니다~

 

먼저 pubspec.yaml 에 추가해줍니다. 

intl: ^0.16.1

위에 라이브러리는 날짜나 단위들을 포맷팅하는데 자주 사용되는 거의 필수적인 라이브러리 입니다.


Intl 

This package provides internationalization and localization facilities, including message translation, plurals and genders, date/number formatting and parsing, and bidirectional text.

 


이것만 추가하면 거의 절반은 다 온듯합니다~

 

intl 에 있는 NumberFormat 클래스에서 simpleCurrency 메소드를 째려봅니다~

currency 메소드도 있지만 simpleCurrency 만으로도 기능을 충분히 사용할 수 있습니다. 

factory NumberFormat.simpleCurrency(
      {String locale, String name, int decimalDigits}) {
    return NumberFormat._forPattern(locale, (x) => x.CURRENCY_PATTERN,
        name: name,
        computeCurrencySymbol: (format) =>
            _simpleCurrencySymbols[format.currencyName] ?? format.currencyName,
        decimalDigits: decimalDigits,
        isForCurrency: true);
  }

locale , name, decimalDigits 3가지 값들로 이제 데이터를 버무려 보겠습니다.

해당값들이 필수는 아니기에 

final formatCurrency = new NumberFormat.simpleCurrency();

선언해주고,

formatCurrency.format(17740)

자 끝!

17,740원 짜리가 17,7440 달러 만원짜리가 천만원짜리가 되었습니다.

 

locale이 미국으로 되어있나보네요~

한국은 ko_KR이니 locale을 수정해볼께요~

final formatCurrency = new NumberFormat.simpleCurrency(locale: "ko_KR");

꽤 원하는 쪽으로 접근했습니다. 

이대로도 문제없는듯하지만, 너무 글로벌 냄새가 나네요 앞에 화폐단위를 빼보겠습니다.

여기 name값과 decimalDigits 을 함께 조정해주면 됩니다.

name의 역할과 decimalDigits을 잠깐보시면 

 

아래와 같이 바꿔보면 금방 이해가 되실겁니다.

final formatCurrency = new NumberFormat.simpleCurrency(locale: "ko_KR", name: "BIT", decimalDigits: 5);

결과는요~

또 부자가 되었습니다. 비트코인이 이만큼이 되었습니다. 

 

이와 같이 name은 화폐단위를 조정하는 값이고, decimalDigits은 소수점 이하자리수를 얼마나 표시할지에 대한 값입니다.

저는 name값은 필요없고, 소수점 이하값도 필요가 없어서 

이렇게 마무리 해주면요 

final formatCurrency = new NumberFormat.simpleCurrency(locale: "ko_KR", name: "", decimalDigits: 0);

formatCurrency.format(17740)

아래와 같이 잘 나옵니다~ 

 

이걸 공통 함수로 하나 빼서 만들어서 사용하시면 필요하실때마다 편하게 쓰실 수 있습니다.

  static String currencyFormat(int price) {
    final formatCurrency = new NumberFormat.simpleCurrency(locale: "ko_KR", name: "", decimalDigits: 0);

    return formatCurrency.format(price);
  }

 

오늘은 아주 간단하게 화폐 단위를 포맷팅하는 방법에 대해서 배워봤습니다.

아마 화폐나 날짜 관련해서 intl에 각종 답들이 있을테니,

관련해서 작업하실 경우에는 해당 라이브러리를 찾아보세요~

 

오늘도 

즐코하세요.

반응형