[Flutter] GetX navigation route

남예지·2024년 3월 27일
0

Flutter

목록 보기
3/6

GetMaterialApp 사용하면 준비 끝

1. 단순 이동

onPressed:(){Get.to(page이름());}

2. 이동 후 이전페이지의 전 페이지로 이동(두번 뒤로)

onPressed:(){Get.off(page이름());}

3. 지금까지 이동했던 전 페이지 다 지우기(뒤로가기 안됨)

onPressed:(){Get.offAll(page이름());}

4. : 하위 → 상위 페이지로 argument 전달

 		// 상위 페이지(이전페이지)
        Text('리턴값 : $returnVal',),
        RaisedButton(
        	onPressed:() async { final resp = await Get.to(page이름()); // result를 받아옴
        		setState(() {
        			returnVal = resp;
        		});
        	} 
        )
        ...
        ////////////////////////
        // 하위 페이지
        Radio(
        	groupValue: radioVal,
        	value: 0,
        	onChanged: (value) {
        		setState(() {
        			radioVal = value;
        		});
        	},
        ),
        ...
        RaisedButton(
        	onPressed: () {
        		Get.back(result: radioVal); // 뒤로가기를 누르면 radioVal 값을 result argument에 담아 1페이지로 보냄
        	},
        	child: Text(
        		'뒤로가기',
        	)
        )

5. 상위→ 하위 페이지로 argument 보내기

        // 상위 페이지
        RaisedButton(
        	onPressed: () {
        		Get.to(page이름(), arguments: '아규먼트 보내요~'); // arguments 전달
        	},
        	child: Text(
        		'아규먼트 보내기',
        	)
        )

        // 하위 페이지
        ...
        Text(
        	Get.arguments, // arguments 받음
        )   

6. Transition

        RaisedButton(
        	onPressed: () {
        		Get.to(page이름(), transition: Transition.leftToRight,); // 다양한 옵션이 있다.
        	},
        	child: Text(
        		'트렌지션 넣기',
        	)
        )

7. 네임드 라우트

        RaisedButton(
        	onPressed: () {
        		Get.toNamed('/page/1234?id=56&name=예지'); // 여기에 다이나믹한 값을 넣어 보내기 가능
        	},
        	child: Text(
        		'네임드 라우트에 param 넣기',
        	),
        ),

        // 구현
        return GetMaterialApp(
        	home: HomeScreen(),
        	getPages: [
        		GetPage(
        			name: '/',
        			page: () => GetNavigationScreen(),
        		),
        		GetPage(
        			name: '/two',
        			page: () => ScreenTwo(),
        		),
        		GetPage(
        			name: '/three',
        			page: () => ScreenThree(),
        		),
        		GetPage(
        			name: '/four',
        			page: () => Screenfour(),
        		),
        		GetPage(
        			name: '/five/:param',  // 다이나믹 라우팅이 가능함
        			page: () => ScreenFive(),
        		),
        	],
        );

        // 페이지에 param을 전달받을 수 있음 
        children: [
        	Text(
        		Get.parameters['param'], // 1234
        	),
        	Text(
        		Get.parameters['id'], // 56
        	),
        	Text(
        		Get.parameters['name'], // 예지
        	),
        ]

https://www.youtube.com/watch?v=wgJItCEL7hk
참고영상

profile
총총

0개의 댓글