2.0 2

Flutter에서 Drawer 메뉴 만들기

Flutter에서 Drawer 메뉴 만들기 이번 시간에는 AppBar의 햄버거(☰) 버튼을 클릭했을 때 열리는 Drawer 메뉴를 만들어보자.아래 이미지를 보면, AppBar 왼쪽의 아이콘을 누르면 사이드 패널이 열리는 UI를 말한다. Drawer를 사용할 때 주의할 점Drawer는 내부적으로 AppBar의 왼쪽 영역(leading 부분)을 자동으로 제어하기 때문에 수동으로 지정하면 충돌이 발생.// ❌ 아래처럼 leading에 IconButton을 추가하면 Drawer가 작동하지 않는다!leading: IconButton( icon: Icon(Icons.menu), onPressed: () { print("menu button clicked"); },), Drawer 샘플 스크린샷 1..

Flutter/2.0 2021.08.10

Flutter에서 AppBar 메뉴 아이콘 추가하기

Flutter에서 AppBar 메뉴 아이콘 추가하기 플러터에서 AppBar(Swift에서 UINavigationBar) 구성하는 방법 정리. 시작하기 전에.이번에는 print문을 통해 콘솔에 로그를 찍어 보면서 확인하는 작업이 많았음.콘솔창이 안보인다면, 아래 이미지에 벌레 모양 아이콘을 클릭하면 디버그 콘솔이 활성화 되고 로그를 확인할 수 있음. 코드 샘플AppBar에 대한 간단 정리leadingAppBar의 왼쪽 영역에 위치한 위젯을 의미. 주로 메뉴 버튼(☰)을 배치함.actionsAppBar의 오른쪽 영역에 여러 개의 아이콘 버튼을 배치할 때 사용.IconButton클릭 가능한 아이콘 버튼 위젯. icon:으로 표시할 아이콘을 지정하고, onPressed: 안에 클릭 시 실행할 코드를 작성.e..

Flutter/2.0 2021.08.10