오늘은 바텀 네비게이션 바 만들고
페이지 하나 만들어 볼려고 한다.
우선 https://api.flutter.dev/index.html
Flutter - Dart API docs
Welcome to the Flutter API reference documentation! Flutter is Google's SDK for crafting beautiful, fast user experiences for mobile, web, and desktop from a single codebase. Flutter works with existing code, is used by developers and organizations around
api.flutter.dev
이거보고 따라하면서 빠르게 만들고
생각보다 쉬웠다.
우선 main.dart 페이지 초기 빌드되는 state class에 변수 생성
인트형태의 변수.
리스트<위젯> 형의 보여줄 페이지 리스트.
만들어주고
빌드 부분으로 넘어가면
body에 child 부분을 고쳐주면된다.
처음 보여줄 페이지
이렇게 고쳐주면 되는데 보니
엘리먼트엣?
보통 리스트의 주소형태값을 참조하여 반환하는데 안의 요소를 직접 불러들이는건가...?
닥트를 조금 더 많이 공부해야겠다.
body는 이제 끝났고
밑에 bottomnavigationbar를 추가해주자.
type : 선택되었을때 확대하는것을 막는 옵션
currentIndex : 선택되어있는 인덱스 설정
onTap : 함수로 받으며 아이탬을 선택했을때 실행하는 함수인듯...
더 많은 옵션들이 있으니 https://api.flutter.dev/flutter/material/BottomNavigationBar-class.html 여기를 참고하는게 좋을듯 싶네요
나중에 백엔트 붙일때 두렵습니다...
'flutter project' 카테고리의 다른 글
| Flutter Firebase Analytics으로 무엇을 활용할 수 있을까? (0) | 2024.01.12 |
|---|---|
| 11월 02일 flutter IOS전용 권한변경 엡 종료 해결방법 (0) | 2023.11.02 |
| 회사 1인 개발자 풀스텍 엡 flutter(android, IOS) 도전기 (1) (0) | 2022.10.31 |