Overview.
이번에는 화면 이동을 위한 Routes 한마디로 네비게이터 경로 사용법을 알아봅시다.
- 화명 이동을 위한 Routes 이란?
- 명명된 네비게이터 이동 방식
1. 화면 이동을 위한 Routes 이란
모바일 앱은 종종 많은 수의 경로를 관리하며 이때 이름으로 참조하는 것이 가장 쉽습니다. 규칙에 따라 경로이름은 경로와 유사한 구조 (예 : '/a , /b , /c ')를 사용합니다. 이렇게 이름을 만들어서 routing 하는 방식을 명명된 네비게이터 경로 사용법이라고 합니다.
- 명명된 네비게이터 이동 방식
- 단순 객체를 이동하는 방식
- 라이브러리 사용하는 방식
방식이 있습니다.
2. 명명된 네비게이터 경로 방식
import 'package:class_login_app/pages/home_page.dart';
import 'package:class_login_app/pages/login_page.dart';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
// 초기 경로 지정
initialRoute: '/login',
// routes : {} 는 Map 구조이다.
// '/login' : key
// () => {} : 익명함수가 들어가야 한다. (익명함수는 {}와 return 등 생략이 가능하다
routes: {
'/login': (context) => LoginPage(),
'/home': (context) => HomePage(),
},
);
}
}
3. 명명된 네비게이터 사용법
Navigator.pushNamed(context, "/home");
'flutter & dart' 카테고리의 다른 글
flutter & dart - Navigator (0) | 2024.02.27 |
---|---|
flutter & dart - TextFormField 위젯 (1) | 2024.02.26 |
flutter & dart - [Design] 중요한 디자인 구성요소에는 중요한 컬러를 적용 (0) | 2024.02.20 |
flutter & dart - null safety (0) | 2024.02.19 |
flutter & dart - material library 개념 사이트 (0) | 2024.02.15 |