[flutter] #1-2 Getx - Named Route management

이 프로젝트는 Youtube '개발하는남자'의 'GetX 주요 기능 3가지 중 그 첫번째 Route 관리 #2' 강의를 참고했습니다.

Named Page Routing

일반적인 Page Routing 보다는 Named Page Routing을 쓰는게 대부분이죠!

Named page Routing을 쓰려면 먼저 Route setting을 해줘야 해요.

Route Setting

main.dart

Getx를 사용하기 전에 먼저 일반적인 방법을 볼게요.

return GetMaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => Home(),
        '/first': (context) => FirstNamedPage(),
        '/second': (context) => SecondNamedPage(),
      },
    );

일반적인 방법은 'routes' 를써요.

이번엔 Getx를 사용해볼게요.

   return GetMaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: '/',
      getPages: [
        GetPage(name: '/', page: () => Home()),
        GetPage(name: '/first', page: () => FirstNamedPage()),
        GetPage(name: '/second', page: () => SecondNamedPage()),
      ],
    );

어떻게 보면 일반적인 방법이 더 간결해보여요.
하지만 Getx을 사용해서 설정하면 후에 많은 기능들을 사용할 수 있어요!

Using Named Routing

라우트 설정을 마쳤으니
이제 사용해볼게요.

위쪽 코드는 일반적인 Named Routing, 아래쪽은 Getx를 이용한 Named Routing 이에요.

            RaisedButton(
              child: Text("일반적인 Named 라우트"),
              onPressed: () {
                Navigator.of(context).pushNamed('/first');
              },
            ),
            RaisedButton(
              child: Text("Getx Named 라우트"),
              onPressed: () {
                Get.toNamed('/first');
              },
            ),

이번엔 코드 길이 차이가 별로 없는것 같아요.

추가로 이전의 page를 스택에서 지우고 이동하는 offNamed() method가 있어요.

   Get.offNamed('/first');

마지막으로 page stack history를 다 지우면서 page 이동을 하는 offAllNamed() 입니다.

 Get.offAllNamed('/');

조아요.
다음 포스팅은 argument전달은 Getx를 통해 어떻게 하는지 !
알아볼게요 :)