Custom Route 정의하기
앱 화면 전환(이동) 위한 Custom Route를 정의합니다.
routes.dart 작성
아래와 같이 route를 작성하고 관리합니다.
routes.dart
import 'package:flutter/material.dart';
import '페이지 경우';
const String #페이지#Route = "login";
class CustomRouter {
static Route<dynamic> generatedRoute(RouteSettings settings) {
switch (settings.name) {
case #페이지#Route:
return MaterialPageRoute(builder: (_) => #페이지#Page());
# 페이지 이동 시 파라미터를 넘길 경우
case #페이지#Route:
return MaterialPageRoute(
builder: (_) => #페이지#Page(
pageType: settings.arguments,
));
}
}
}
lib Root 경로에 routes.dart파일을 생성하고 관리합니다.
routes.dart 예:
routes.dart
import 'package:flutter/material.dart';
import 'screens/login/login.dart';
import 'screens/home/home.dart';
class CustomRouter {
static const String loginRoute = "login";
static const String homeRoute = "home";
static Route<dynamic> generatedRoute(RouteSettings settings) {
switch (settings.name) {
case loginRoute:
return MaterialPageRoute(builder: (_) => LoginPage());
case homeRoute:
return MaterialPageRoute(builder: (_) => HomePage());
case ReaderRoute:
return MaterialPageRoute(
builder: (_) => ReaderPage(
screenArguments: settings.arguments,
));
}
}
}
MyApp MaterialApp Route 추가
lib/main.dart
import 'routes.dart';
@override
Widget build(BuildContext context) {
if (checkLogin) {
initialRoute = homeRoute;
} else {
initialRoute = loginRoute;
}
return MaterialApp(
.....
.....
onGenerateRoute: CustomRouter.generatedRoute,
initialRoute: initialRoute, // loginRoute or homeRoute,
);
}
사용방법
Flutter 스크 전환하기 :
// 위젯의 콜백
onPressed: () {
// Named route를 사용하여 화면으로 전환합니다.
Navigator.popAndPushNamed(context, homeRoute);
}
Flutter 이전 스크으로 돌아가기 :
onPressed: () {
// 현재 route를 스택에서 제거함으로써 이 스크린으로 되돌아 갑니다.
Navigator.pop(context);
}
Last updated
Was this helpful?