brunch

You can make anything
by writing

C.S.Lewis

[Flutter] #4 다트 언어에 대해 알아보자

들어가는 글: 글도 자꾸쓰니 들어가는 품이 적어지는 것 같습니다. 플러터를 얼마 만들어보지는 않았지만 오늘은 다트 언어의 기초 부분을 알아보도록 하겠습니다. 


1. 다트 언어? 


지난 1화 (플러터를 소개합니다) 에서 타트 언어의 속성에 대해서 몇가지 언급을 했습니다. 

그런 식으로 특징을 간단히 언급을 해보면 

1) 다트 언어는 구글에서 만들었습니다. 

2) 다트 언어의 공식 홈페이지는 https://dart.dev/ 입니다. 

3) 다트 언어의 최신 버전은 2.3 입니다. 

4) 다트 언어의 기본은 여기에 잘 정리되어 있습니다 (영어) 

https://dart.dev/guides/language/language-tour 


2. 다트 언어로의 여행 


위의 문서에 있는 내용중 플러터로 프로그래밍할 때 필요한 부분 위주로 정리하도록 하겠습니다. 


1) print() 문 


플러터로 UI를 작성한 뒤에 가장 먼저 다뤄보는 로직은 onPressed와 같은 UI 이벤트입니다. 앞서 3화에서 계산기 UI를 만들때도 이것을 가장 먼저 사용했습니다. 

  void addNumbers(String key) {

    print('calc key >>' + key);

  }

기억 나시죠? 버튼을 누르면 print문을 출력합니다. 

우리가 예상한데로 7번 버튼을 누르면 'calc key>>7' 이 출력됩니다. 


2) 데이터 타입 


가장 먼저 알아두어야 할 것은 문자형과 숫자형 타입입니다. 

- String 

- int 

- double 

- num 


문자형은 java 언어와 같이 큰따옴표(")로 감싸도 되고 , 작은따옴표(')로 감싸도 됩니다. 저도 원래는 큰따옴표가 익숙했었는데 코딩하다보면 작은 따옴표가 더 편하긴 하더라구요. 


(hello_flutter) 예제 

https://github.com/yudong80/flutter-dev/blob/master/hello_flutter/lib/main.dart

-  title: 'Hello Flutter'//app name

appBar: AppBar(title: Text('Hello Flutter!!')), //title bar

body: Center(child: Text('Let\'s get it Flutter')) //content


(calculator) 예제 

https://github.com/yudong80/flutter-dev/blob/master/calculator/lib/calc_v1.dart 

RaisedButton(child: Text('7'), onPressed: () { addNumbers('7'); },),


플러터에서는 굳이 변수로 넣는 것보다 간단한 UI를 만들때는 직접 넣어주는 것이 편리할 것 같아요. 하지만 앱의 규모가 커지면 그러한 매직 넘버(magic number)보다는 모두 상수로 처리해줘야 합니다. 


다음은 숫자형입니다. 

아직은 재대로 언급하지 않았지만 calc_v2.dart 에서는 (계산기 ver.2 로 보이시죠? ㅎ) 

간단한 변수와 계산을 하고 있습니다. 

https://github.com/yudong80/flutter-dev/blob/master/calculator/lib/calc_v2.dart

혹시 어떤 내용인지 파악이 되시나요? 

(자세한 내용은 계산기 ver.2 설명하면서 말씀드리겠지만) 


간단하게 요약하면 

OPERATORS는 연산자의 종류이고 , 

op1은 첫번째 수 (double형)

op2는 두번째 수 (double형)

operator는 선택한 연산자 (String 형) 입니다. 


숫자니까 당연히 실제 계산을 할 수 있지요? 

https://github.com/yudong80/flutter-dev/blob/master/calculator/lib/calc_v2.dart

그렇다면 num 형은 무엇일까요? 

num형은 int와 double의 super type입니다. 즉 앞선 double을 모두 num으로 바꿔도 잘 동작합니다. 

(한번 해보세요) 


하지만 제 개인적인 생각은 int와 double은 엄연히 다른 타입이니 구별해서 쓰는 것이 좋겠습니다. 


3) 간단한 로직 


다트도 기존의 C, Java, Python과 마찬가지로 기본적인 조건문, 분기문, 할당문 등을 제공합니다. 

- if 와 else

- for 

- while 와 do~ while 

- break 와 continue

- switch / case 문 


>> 팁 << 


플러터를 개발하고 있는데 간단한 로직을 테스트해보고 싶다. 

예를 들면 변수 a 와 변수 b를 더하는 함수를 만드는데 매번 (에뮬레이터)나 (내 스마트 폰)으로 시험해볼 수는 없자나요? 


저는 안드로이드를 스튜디오를 기준으로 하고 있으므로 말씀드리면 

(hello_flutter) 예제 

https://github.com/yudong80/flutter-dev/blob/master/hello_flutter/lib/add_func.dart 

이렇게 하시면 됩니다. 

참 쉽죠? 


똑같은 main() 함수인데 어떨 때는 안드로이드(iOS) 앱이 되고, 

어떨 때는 일반 콘솔 프로그램이 됩니다. 


앗.. $res 이거는 뭐죠? 


설명안하고 넘어갔었는데요 , print() 문에서 변수의 값을 넣어줄 때 $(변수이름)을 붙이면 됩니다. 여기에서는 res변수의 값을 표시한 것이구요. 

만약 (res + 1)의 값을 표현하려면 어떻게 하면 될까요? 


ㅎㅎ 요거는 퀴즈입니다. 무언가 res 양옆으로 붙여줘야 합니다. 


다음엔 진짜 계산기 두번째 버전에 대해 알아보겠습니다. 

감사합니다. 


2019.5.15

매거진의 이전글 [Flutter] #3 계산기를 만들자
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari