1. 환경설정
pubspec.yaml파일에 해당 코드를 추가한다.
get: ^버전
dependencies:
get: ^3.26.02. 설치
커맨드 창에서
$ flutter pub get
명령어를 입력한다.
3. 불러오기
getX를 사용하고 싶은 파일에 해당 명령어를 불러온다.
import 'package:get/get.dart';4. 사용 셋팅
기존의 root위젯인 MaterialApp을 GetMaterialApp으로 바꾸어준다.
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
);
}
}-> 아래와 같이 변경
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
);
}
}5. 사용하기
1) 기본 이동
가장 간단하게 페이지를 이동하려면
Get.to(() => NextPage());위와 같이 사용하면 된다.
여기서 NextPage는 이동하고자 하는
StatelessWidget/StatefulWidget의 클래스 명으로 바꿔주면 된다.
2) argument와 함께 이동
만약 arguments 값과 함께 페이지를 이동하고 싶다면
Get.to(() => NextPage(), arguments: value);처럼 사용하면 된다.
여기서 value는 자신이 원하는 값을 넣어주면 된다.
넘겨진 argument를 받고 싶으면
var value = Get.arguments;처럼 사용하면 될 것이다.
반대로 이동한 페이지에서 값을 받아오고 싶다면
- 원래 페이지에서
var value = await Get.to(NextPage());- NextPage에서
Get.back(result: value);다음과 같이 하면 된다.
3) 이전 페이지(1개만) 삭제 후 이동
만약 페이지를 이동한 후 이전 페이지로 다시 돌아가지 않아도 된다면
Get.off(() => NextPage());이런 식으로 사용하면 된다.
4) 이전 페이지 모두 삭제 후 이동
만약 기존에 있는 페이지를 모두 삭제하고 페이지를 이동하고 싶다면
Get.offAll(() => NextPage());위와 같이 사용한다.
5) Named(이름)으로 이동하기
이름(경로)로 페이지를 이동하고 싶다면
Get.toNamed('/a/b/c1');과 같이 이름을 붙여서 사용할 수 있다.
페이지의 경로를 지정해주기 위해서
GetMaterialApp에 getPages속성을 추가해 준다.
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
getPages: [
GetPage(
name: '/',
page: () => FirstPage(),
),
GetPage(
name: '/two',
page: () => SecondPage(),
),
GetPage(
name: '/three',
page: () => ThirdPage(),
),
GetPage(
name: '/a/b/c1',
page: () => ABCOnePage(),
),
],
);
}
}- 만약 param과 함께 페이지를 이동하고 싶다면
GetPage(
name: '/papa/:param',
page: () => ParamPage(),
),과 같이 사용이 가능하다.
- 사용법
Get.toNamed('/papa/value');value 값이 param 값으로 전달된다.
ex)
Get.toNamed('/papa/1234');1234가 param 값으로 전달
- param값을 받으려면
Get.parameters['param']과 같이 사용할 수 있다.
마찬가지로 쿼리도 다음과 같은 방식으로 사용할 수 있다.
Get.toNamed('/papa/value?id=123&name=침착맨');받는 방법은
Get.parameters['param'] => value 값
Get.parameters['id'] => id 값, 즉 123
Get.parameters['name'] => name 값, 즉 침착맨
이다.
6. 마침
위의 내용은 유튜브 채널: '코드팩토리'님의 영상을 참고하였습니다.
해당 링크: https://www.youtube.com/watch?v=wgJItCEL7hk&t=429s
더 자세한 내용은 getX GitHub (https://github.com/jonataslaw/getx/blob/master/README.ko-kr.md) 에서 확인하실 수 있습니다.
