PromleeBlog
sitemap
aboutMe

posting thumbnail
목표, 조건 설정 및 초기설정
Goals, Conditions, and Initialization

📅

🚀

들어가기 전에 🔗

이 포스팅은 Flutter 3.24 버전 기준으로 작성되었습니다.
플러터 설치가 완료된 상태로 가정하고 진행합니다.
플러터에서 페이지 간 이동을 하기 위해 제가 주로 사용하는 초기 설정 방법을 알아보도록 하겠습니다.
개발에 앞서 목표와 조건을 설정하고, 필요한 패키지를 설치해보겠습니다.

🚀

목표/조건 설정 🔗

👨‍💻
개발 전, 플러터에서 지원하는 기본적인 페이지 이동 방식에서 추가적으로 다음 조건들을 설정해보고자 합니다.
  1. 로그인 페이지를 만들어 로그인 후에만 다른 페이지로 이동할 수 있도록 설정(
    FlutterSecureStorage
    사용)
    ➡️ 링크: 로그인 페이지 분기(FlutterSecureStorage)
  2. 로그인 페이지에는 네비게이션 바가 없고, 로그인 후에
    모든 페이지
    에서 네비게이션 바가 나타나도록 설정
    ➡️ 링크: 하단 네비게이션 바 설정하기
  3. 네비게이션 바의 각 탭에는 추가적인 또 다른 페이지가 있고, depth 상태에서도 탭을 선택 시
    해당 탭
    으로 이동하되,
    탭이 이미 선택된 상태에서 다시 선택할 경우 해당 탭의
    최상단 페이지
    로 이동하도록 설정
    ➡️ 링크: 네비게이션 바 탭 이벤트 설정하기
  4. 모든 페이지(로그인 제외)에서 바텀 네비게이션 바를 통하지 않더라도
    별도의 버튼
    으로 다른 탭으로 이동할 수 있도록 설정
    ➡️ 링크: 네비게이션 바 탭 이벤트를 위젯에서 사용하기

🚀

Fluter 프로젝트 생성 및 실행 🔗

플러터 프로젝트를 생성합니다.
flutter create navigationbar_example
생성된 프로젝트를 실행합니다.
cd navigationbar_example
flutter run
프로젝트가 정상적으로 실행되는 것을 확인할 수 있습니다.
프로젝트가 정상적으로 실행되는 것을 확인할 수 있습니다.

🚀

FlutterSecureStorage, Get 패키지 설치 🔗

로그인 정보를 저장하기 위해 FlutterSecureStorage 패키지를 설치합니다.
Get 패키지는 상태관리, 라우팅, 다이얼로그 등을 쉽게 사용할 수 있도록 도와줍니다.
flutter pub add flutter_secure_storage get
pubspec.yaml 파일에 패키지가 추가되었는지 확인합니다.
```yaml
dependencies:
	flutter_secure_storage: ^9.2.4
	get: ^4.6.6

🚀

결론 🔗

다음 포스팅에서는 목표/조건에 맞게 FlutterSecureStorage 패키지를 사용하여 로그인 페이지를 만들고, 네비게이션 바를 추가하는 방법을 알아보겠습니다.

참고 🔗