[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출! 강의을 참고하여 작성하였습니다.
Android Studio 에서 Flutter Source 을 작업하다보면 자동 정렬이 nice 하게 안되는 케이스가 있습니다.
좀 더 편하게 소스 정렬 할 수 있는 방법이 없을까? 고민하다가 좋은 방법을 알게 되어 소개합니다.
추가로 Widget 을 Wrap 로 자동 감싸는 방법 및 감싸져 있는 Wrap 을 제거하는 방법도 공유합니다. 🙂
Keymap 을 활용한 정렬
Reformat Code with ‘dart format’ 을 Android Studio 에서 keymap 으로 제공하고 있습니다.
Android Studio > Preference > Keymap 에서 dart 를 검색합니다.
그럼 Reformat Code with ‘dart format’ 을 확인 할 수 있는데요. 해당 항목을 더블클릭 후 원하는 단축키를 입력합니다.
Wrap 추가 하는 방법
선언된 Widaget 상위에 Widget 선언하고 싶을 때가 있습니다.
Dart 언어 특성상 직접 Widget을 추가하려면 Widget의 처음과 끝을 찾아서 괄호({}) 로 감싸는 작업을 할 때가 있는데요. 수동으로 Wrap 을 해주는 방법이 아는 조금 더 편하게 하는 방법이 있습니다.
감싸고 Widget 에 커서를 두고 option + enter 을 누르게 되면 다음과 같이 나오게 됩니다.
원하는 것을 추가하면됩니다.
필자는 Wrap with Column 을 자주 사용 하고 있습니다.
Widget 제거 하는 방법
추가만 있을까? 제거하는 방법은 없을까?
감사하게도(?) Remove 기능을 제공하고 있습니다.
제거 하기 원하는 Widget에 커서를 이동시킨 후 Remove this widget 을 눌러줍니다.
그럼 Widget 이 제거된 것을 확인 할 수 있습니다.
Android Studio 에서 사용 가능한 유용한 Live Template
프로그래밍을 하다보면 선언하는데 많은 입력해야 할 일이 생깁니다. 이런 불편함을 android studio 에서는 livr template로 제공하고 있습니다.
Dart에서 기본적으로 사용하는 부분을 공유하겠습니다.
import KeyMap : "import"
import 시 im만 입력해도 import가 되는 것을 확인할 수 있습니다.
Stateless Widget KeyMap : "stless"
StlessWidget을 상속받는 class 선언 시 stless를 입력하면 자동으로 StatefulWidget 을 상속받는 코드를 구현할 수 있습니다.
StatefulWidget Widget KeyMap : "stful"
StatefulWidget을 상속받는 class 선언 시 stful를 입력하면 자동으로 StatefulWidget 을 상속받는 코드를 구현할 수 있습니다.
마무리
Flutter를 개발하면서 도움이 될만한 몇 가지를 공유하였습니다.
개발하는데 조금이라도 도움이 되었으면 좋겠네요. 그럼 다음 포스트로 찾아 뵙겠습니다.
참고
