seong

Flutter - FadeTransition 페이지 이동 투명도 위젯 본문

Flutter/Flutter

Flutter - FadeTransition 페이지 이동 투명도 위젯

hyeonseong 2023. 8. 20. 00:26

PageRouteBuilder에 FadeTransition위젯을 사용해주면 페이지 이동시에 이전 화면에 투명도를 줘서 부드럽게 이동하게 해준다.

transitionDuration : 화면 이동 까지 걸리는 시간 

reverseTransitionDuration : 이전 화면 이동 까지 걸리는 시간 

FadeTransition : 이전 화면 투명도 주기 

 Navigator.push(
                context,
                PageRouteBuilder(
                  transitionDuration:
                      Duration(milliseconds: 500),
                  reverseTransitionDuration:
                      Duration(milliseconds: 500),
                  pageBuilder: ((context, animation,
                          secondaryAnimation) =>
                      FadeTransition(
                        opacity: animation,
                        child: DetailsScreen(
                            product: demo_products[index]),
                      )),
                ),
              );