Flutter Navigator v1

Navigator?

• Flutter에서 기본적으로 제공하는 화면 이동을 위한 클래스
• 기본적으로 사용하는 것들
  • push -> 화면 이동
  • pop -> 화면 나가기
  • pushAndRemoveUntil -> 화면 이동 후 이전 화면 삭제, 보통 로그인 이후 이전 화면의 스택을 지워버림.
  • pushNamed -> 화면 이동, routeName을 지정해서 사용
  • pushNamedAndRemoveUntil -> 화면 이동 후 이전 화면 삭제, routeName을 지정해서 사용

Navigator v1 버전

//화면 이동
Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => const NextPage()),
);

//화면 나가기
Navigator.pop(context);

// 화면 이동 후 이전 화면 삭제
Navigator.pushAndRemoveUntil(
  context,
  MaterialPageRoute(builder: (context) => const NextPage()
  ),
  (route) => false,
);

• pop 시 데이터 전달 가능
• 아래처럼 사용가능

Navigator.pop(context, "hello");

// 이전 화면에서 데이터 받기
final result = await Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => const NextPage()),
);
print(result);
-> hello

pushNamed 사용

• main.dart 기본수정
• 1번 직접사용하는 경우도 있지만, 2번 보통의 경우 이동하려는 화면에 routeName을 지정해서 사용

// 1번
title: 'Flutter Demo',
initialRoute: "/",
routes: {
  "/": (context) => const MyHomePage(),
  "/next": (context) => const NextPage(),
}

// 2번
title: 'Flutter Demo',
initialRoute: MyHomePage.routeName,
routes: {
  MyHomePage.routeName: (_) => const MyHomePage(),
  NextPage.routeName: (_) => const NextPage(),
},

• 위처럼 정의 후에 아래처럼 사용가능

// 1번
Navigator.pushNamed(context, "/next");

// 2번 -> routeName을 지정해서 사용
class MyHomePage extends StatefulWidget {
  static const routeName = '/';
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

Navigator.pushNamed(context, MyHomePage.routeName);