(Flutter) 페이지 이동하기, 페이지 간 값 보내기

Flutter로 페이지 간 이동을 구현할 수 있다.

페이지간 이동에는 Navigtor과 buidContext를 사용한다.

그런데, 페이지간 값을 주고 받고 싶으면, Navigator의 push, pop 함수를 호출할 때 값을 전달하면 된다.

push는 다음 페이지를 호출하는 명령이고,

pop은 이전 페이지로 돌아가는 명령이다.

push 즉, 다음 페이지에 값을 전달할 때는 그냥 매개변수를 네임드 변수로 지정해서 보내면 된다.

하지만, pop일 경우에는 조금 다르다. ( 이부분을 잊지 않기 위해 적어놓는다)

Imparative Routing

 

(1) 변수를 넘겨주는 방식

-> home 페이지 : 값을 받을 때, 비동기로 처리해주어야 한다.

-> nest 페이지 (여기서 뒤로 돌아가기 버튼, pop 버튼을 눌렀다)

 

(2) arguments를 이용하는 방식

 -> push 하는 측 : settings 프러퍼티에 아무것이나 넣을 수 있다. (object 형이다)

  -> pop 하는 측 (받는 측) : build 함수 내에서 ModalRoute.of(context).settings.arguments를 받아야 한다. 암기가 필요함

 

// 라우팅에 대해 진짜 중요한 부분은 지금부터 이다.

Declarative Routing

웹 개발하는 방식하고 비슷한데, map으로 routing 경로들을 main에서 한번에 정의하는 방식이다.

(1) 먼저 main.dart 파일에 아래와 같이 정의하고 싶은 route(페이지)들을 정의한다.

     이때 중요한 것은 '/' 을 반드시 설정해주어야 한다. '/' 로 정의된 Route가 null인 경우 작동하지 않는다.

 

  (2) push 할 때 아래와 같이 pushNamed를 사용한다. 코드가 간결해지고, 코드 중앙화가 되어 보기 편하다.

      이 때도 값(argument)를 아래와 같이 보낼 수 있다.

   (3) 받는 측에서 이렇게 받으면 된다. 위에서 언급한 ModalRoute.of(context)를 사용한다.

기타 기능들...

1. pushReplacement

- pushReplacement, pushReplacementNamed 라는 기능이 있는 데, pop할 때 이전 페이지가 아닌 이전전 페이지로 이동하게 된다. route stack 을 교체했다고 생각하면 된다. 사용법은 push, pushNamed와 동일하다.

2. pushNamedAndRemoveUntil

 조건에 따라서 어떤 특정 Route로 갈 수 있도록 하는 기능이다. push할 때는 지정된 route로 가는데, pop이 될 때, 조건을 지정하여 특정 route로 이동될 수 있다. 

위와 같이 하면, 완전 일반 pushNamed와 동일하다.

위와 같이 하면, 이름이 '/'로 지정된 route면 true로 반환되고, 나머지 route들을 모두 false를 반환한다. 따라서, 무조건 '/' route로 이동하게 된다.

3. maybePop 

pop은 무조건 pop 한다. 그런데, 첫 페이지에서 pop을 해버리면,....강제 종료해야하는 상황이 발생한다.

mayPop은 안전한 pop 으로써, pop이되는 지 확인해서 pop한다. 

헷갈릴 땐, mayPop 하는 게 좋을 것 같고, 확실할 땐, pop하는 게 좋다.

3. canPop (반환 값이 있다.)

canPop은 말 그대로 Pop이 가능한 지 여부를 boolean 값으로 알려주는 기능이다.

PopScope

뒤로 가기 버튼을 꼭 만들지 않아도, 즉 pop 기능이 없어도 안드로이드나 IOS에서 제공하는 기본 시스템 pop 기능이 있다.

하지만, 실수로 앱이 꺼지는 걸 방지하기 위해, 기능상 시스템 pop 기능을 꺼버려야 할 때가 종종 있다.

그럴 때, PopScope를 사용하고, canPop 을 false로 지정하도록 한다.