GestureDetector
- 유저가 위젯을 어떻게 만지는지 감지할 수 있다
- onTap: (){ 한 번 누를시 실행할 코드 }
- onDoubleTap: (){ 더블탭시 실행할 코드 }
- onLongPress: (){ 길게누를시 실행할 코드 }
- onScaleStart: (){ 줌인시 실행할 코드 }
- onHorizontalDragStart: (){ 수평으로 드래그시 실행할 코드 }
- 등등
Navigator.push(context,
PageRouteBuilder(
pageBuilder: (c, a1, a2) => Upload(),
transitionsBuilder: (c, a1, a2, child) => FadeTransition(opacity: a1, child: child),
transitionDuration: Duration(milliseconds : 500),
),
)
- pageBuilder: 에는 보여줄 페이지를 return하면 되고
- transitionsBuilder: 는 파라미터 4개를 입력하고 애니메이션을 return 하면 된다
- 첫째는 context (쓸데없음)
- 둘째는 0에서 1로 증가하는 애니메이션 숫자 (새로운 페이지에 씀)
- 셋째는 0에서 1로 증가하는 애니메이션 숫자 (기존에 보이던 페이지에 씀)
- 넷째는 현재 보여주는 위젯
FadeTransition()
- opacity: 애니메이션 숫자
- child: 보여줄 위젯
- 이렇게 작성하면 특정 위젯을 서서히 opacity를 0에서 1로 보여줄 수 있다.
- transitionDuration : Duration(milliseconds : 500) 이걸로 몇초간 동작할지 설정가능.
- PageRouteBuilder() 에 넣을 수 있다.
SlideTransition()
SlideTransition(
position: Tween(
begin: Offset(-1.0, 0.0),
end: Offset(0.0, 0.0),
).animate(a1),
child: child,
)
더불어
위젯 위치 변경하려면 PositionedTransition()
위젯 사이즈를 변경하려면 ScaleTransition()
위젯을 가렸다가 보여주려면 SizeTransition()
위젯을 회전시키려면 RotationTransition()
출처 : 코딩애플
'Front-End > Flutter' 카테고리의 다른 글
[Flutter] Provider (1) | 2023.10.28 |
---|---|
[Flutter] Shared preferences (0) | 2023.10.28 |
[Flutter] 내장 Image file (0) | 2023.10.28 |
[Flutter] Navigator (0) | 2023.10.28 |
[Flutter] DIO 사용 방법 (0) | 2023.10.28 |