[Flutter] 코딩이 편해지는 안드로이드 스튜디오 편의 기능

이 글은 [Must Have] 코드팩토리의 플러터 프로그래밍 2판에서 발췌했습니다.
골든래빗 출판사
코드팩토리(최지호) 지음

안드로이드 스튜디오는 안드로이드 및 안드로이드 전용 앱 제작을 위한 공식 통합 개발 환경입니다. 안드로이드 스튜디오의 편의 기능은 코딩 과정을 더 효율적으로 만들어 줍니다. 코드 자동 정리, 스테이트리스/스테이트풀 위젯 자동 생성, Show Context Action 등 코딩이 편해지는 안드로이드 스튜디오 편의 기능 정리했습니다.

 

[Flutter] 코딩이 편해지는 안드로이드 스튜디오 편의 기능

 

1. 코드 자동 정리

코드를 작성하다 보면 코드 간의 간격, 줄바꿈 등 포매팅(Formatting)이 정리가 잘 안될 때가 있습니다. 이때 코드 자동 정리 기능을 사용하면 손쉽게 보기좋은 형태로 포매팅을 할 수 있습니다. 코드 자동 정리를 실행할 파일에 마우스 커서를 올려놓은 뒤 맥에서는 Command + Option + L 을, 윈도우에서는 Control + Alt + L 을 실행하면 됩니다.

코드 자동 정리를 진행할 때 주의할 부분은 콤마의 위치입니다. 플러터는 줄바꿈을 할 때 콤마를 기반으로 줄바꿈을 진행하고 코드 정리를 합니다. 리스트의 끝과 마지막 매개변수를 입력 후에 ,기호를 끝에 추가해주면 해당 위치를 기반으로 줄바꿈됩니다.

 

▼ 코드 자동 정리 전

 

▼ 코드 자동 정리 후

 

2. 스테이트리스 위젯과 스테이트풀 위젯 자동 생성하기

플러터 개발을 하면 가장 많이 하는 작업이 스테이트리스 위젯과 스테이트풀 위젯을 생성하는 작업입니다. 너무 반복적이고 템플릿(Template) 코드가 많습니다. 안드로이드 스튜디오에서 플러터 플러그인을 설치하고 stless를 입력한 다음에 탭을 누르면 스테이트리스 위젯을 생성할 수 있고 stful을 입력한 다음에 탭을 누르면 스테이트풀 위젯을 생성할 수 있습니다.

 

▼ 스테이트리스 위젯 생성하기

1. 스테이트리스 위젯을 생성하고 싶은 위치에 stless를 입력한 후 탭을 누릅니다.

 

2. 커서가 자동으로 클래스 이름 위치로 이동됩니다. 위젯의 이름을 입력한 후 엔터를 누릅니다.

 

3. 이름을 입력한 후 엔터를 누르면 클래스 이름과 생성자 이름이 동일하게 완성됩니다.

 

▼ 스테이트풀 위젯 생성하기

1. 스테이트풀 위젯을 생성하고 싶은 위치에 stful을 입력한 후 탭을 누릅니다.

 

2. 커서가 자동으로 클래스 이름 위치로 이동됩니다. 위젯의 이름을 입력한 후 엔터를 누릅니다.

 

3. 모든 클래스 명칭과 생성자에 위젯의 명칭이 자동으로 입력됩니다.

 

3. Show Context Action

안드로이드 스튜디오에 플러터 플러그인을 설치하면 유용한 자동화 기능이 추가됩니다. 사용 방법은 Show Context Action을 실행하고 싶은 코드 위에 커서를 올려놓은 뒤 맥에서는 Option + Enter 를, 윈도우에서는 Alt + Enter 를 실행하면 됩니다.

Show Context Action으로 실행할 수 있는 기능은 다양합니다. 자주 사용하는 ‘위젯 감싸기’, ‘위젯 삭제하기’, ‘스테이트리스 위젯을 스테이트풀 위젯으로 변경하기’, ‘함수를 비동기로 변경하기 기능’, ‘import 추가하기’를 알아보겠습니다.

 

3.1 위젯 감싸기

플러터는 위젯들이 트리 구조를 띄고 있기 때문에 이미 작성된 위젯을 새로운 위젯으로 감싸야 하는 상황이 많이 생깁니다. 이럴 때 Show Context Action을 이용해서 원하는 위젯을 새로운 위젯으로 쉽게 감쌀 수 있습니다.

 

1. 새로운 위젯으로 감싸고 싶은 위젯에 커서를 올린 후 [Show Context Action]을 실행해주세요.

 

2. 원하는 옵션을 선택하면 커서를 올려둔 위젯이 선택한 위젯으로 감싸집니다.

 

▼ 위젯 감싸기 옵션 정리

 

3.2 위젯 삭제하기

새로운 위젯으로 감싸기의 반대 역할을 하는 기능입니다. 선택한 위젯을 위젯 트리에서 삭제하고 싶을 때 목표 위젯에 마우스 커서를 올려놓은 뒤 Show Context Action을 실행하고 Remove this widget 옵션을 선택하면 됩니다. 가장 하위에 있는 위젯에는 사용하지 못하며 children 매개변수에 여러 개의 위젯이 입력될 때도 사용이 불가능합니다.

 

1. 삭제하고 싶은 위젯에 커서를 올려놓은 뒤 [Show Context Action]을 실행하고 [Remove this widget] 옵션을 선택합니다.

 

2. 선택한 위젯이 삭제됩니다.

 

3.3 스테이트리스 위젯 스테이트풀 위젯으로 변경하기

스테이트리스 위젯을 사용하다가 setState(   ) 함수와 상태 관리가 필요해서 스테이트풀 위젯으로 전환하는 일이 흔히 발생합니다. 전환하고 싶은 스테이트리스 위젯에 마우스 커서를 올려놓은 뒤 [Show Context Action]을 실행하면 [Convert to StatefulWidget] 옵션을 볼 수 있습니다. 옵션을 선택하면 스테이트리스 위젯을 스테이트풀 위젯으로 변경할 수 있습니다.

1. 스테이트풀 위젯으로 변경하고 싶은 스테이트리스 위젯에 커서를 올린 후 [Show Context Action]을 실행해주세요. 그리고 [Convert to StatefulWidget]을 눌러주세요.

 

2. 스테이트리스 위젯이 스테이트풀 위젯으로 변경됩니다.

 

3.4 동기 함수 비동기 함수로 전환하기

동기 함수를 비동기 함수로 전환하는 일도 흔히 있습니다. 비동기 함수로 변경하고 싶은 동기 함수에 [Show Context Action]을 실행하면 [Convert to async function body] 옵션을 볼 수 있습니다. 해당 옵션을 선택하면 반환 타입이 Future로 감싸지고 함수에 async 키워드가 추가됩니다.

1. 비동기 함수로 변경하고 싶은 동기 함수에 [Show Context Action]을 실행해주세요. 그리고 [Convert to async function body] 옵션을 선택해주세요.

 

2. 동기 함수가 비동기 함수로 변경됩니다. 반환 타입이 Future로 감싸지고 async 키워드가 추가됩니다.

 

3.5 import 추가하기

매번 직접 import문을 작성하는 건 여간 귀찮은 일이 아닙니다. 만약에 임포트할 함수나 클래스 또는 변수 명칭을 정확히 알고 있다면 해당 명칭을 먼저 작성한 후 [Show Context Action]을 실행해주세요. 그럼 해당 값을 임포트할 수 있는 경로들이 옵션으로 제시됩니다. 원하는 경로를 선택하면 import문이 추가됩니다.

1. 임포트하고 싶은 값에 마우스 커서를 올린 다음 [Show Context Action]을 실행해주세요. 그다음 불러오고 싶은 경로를 선택해주세요.

 

2. import문이 자동으로 파일의 상단에 추가됩니다.

 

지금까지 안드로이드 스튜디오의 3가지 편의 기능을 알아봤습니다.

최지호(코드팩토리) 
임페리얼 칼리지 런던을 졸업하고 계리 컨설팅 회사 밀리만(Milliman) 한국 지사에서 소프트웨어 엔지니어로 일했습니다. 현재 주식회사 코드팩토리를 창업하여 개발을 하면서 초보자뿐만 아니라 현직 개발자에게도 유용한 개발 강의를 제작합니다. 밀리의서재 플러터 전환 차세대 프로젝트를 리드했습니다.

Leave a Reply

©2020 GoldenRabbit. All rights reserved.
상호명 : 골든래빗 주식회사
(04051) 서울특별시 마포구 양화로 186, 5층 512호, 514호 (동교동, LC타워)
TEL : 0505-398-0505 / FAX : 0505-537-0505
대표이사 : 최현우
사업자등록번호 : 475-87-01581
통신판매업신고 : 2023-서울마포-2391호
master@goldenrabbit.co.kr
개인정보처리방침
배송/반품/환불/교환 안내