Flutter에서 보통 위젯이라하면, Flutter 프레임워크로 만든 UI 컴포넌트를 말한다.
하지만 여기서 말하는 위젯은 홈 화면 위젯이다. 우리는 스마트폰으로 이미 많은 위젯을 쓰고있다.
위에서 보이는 카카오페이, 네이버 파파고, 토스 관련 기능들 모두가 홈 화면 위젯이다. 홈 화면 위젯을 통해서, 앱을 실행하지 않고도 다양한 기능을 실행할 수 있다.
이와 같이 홈 화면 위젯을 Flutter로 만들어보자. dart코드만으로 구현하는 건 불가능하고, 반드시 Native 코드를 거쳐야 한다.
여기서는 안드로이드 홈 위젯을 다뤄볼 것이다. (vscode 사용 기준)
일단 홈 위젯을 만들어보자
일단 홈 위젯이 잘 만들어지는 것부터 확인해보자.
-
vscode에서 flutter프로젝트의 android 디렉토리를 우클릭하여 Android Studio로 연다.
-
Android Studio에서 app 디렉토리를 우클릭, New -> Widget -> App Widget
-
Class Name, Minimum Width, Minimum Height를 정하고 finish를 눌러 파일 생성을 마친다. 앱 아이콘(1*1)크기를 단위로 삼는다.
- 홈 위젯 파일이 생성된 것을 확인하고, vscode에서 프로젝트를 다시 빌드해보자. 설치된 앱 아이콘을 길게 홀드해서 홈 화면에 위젯을 생성할 수 있다.
기존에는 없었던 위젯 메뉴가 생긴 것을 볼 수 있다.
Android Studio에서 설정한 대로(4 * 2) 위젯을 홈에 추가할 수 있다.
