[Flutter&Dart] flutter_animate Package를 이용해서 Click Animation 만들기 - Easy Flutter Package #1

 

1. 토글 만들기

위젯 상단에 토글을 선언해준다.

bool _toggle = false;

 

2. TapDown, TapUp 함수 넣기

onTapDow, onTapUp에 setState함수와, 토글을 넣고 빼는 함수를 넣어준다.

 

          onTapDown: (details) {
            setState(() {
              _toggle = true;
            });
          },
          onTapUp: (details) {
            setState(() {
              _toggle = false;
            });
          },

토글 함수

 

3. 애니메이션 함수 붙여주기

Card의 뒷부분 괄호에 .animate().scaleXY()를 붙여 애니메이션을 만들어준다.

Card(child:...).animate(target: _toggle ? 0.5 : 0).scaleXY(end: 0.9),

 

Easy Flutter Package Series

[Flutter&Dart] flutter_animate Package를 이용해서 Click Animation 만들기 - Easy Flutter Package #1

[Flutter&Dart] flutter_animate Package를 이용해서 Click Animation 만들기

[Flutter&Dart] shared_preferences Package 사용하기 - Easy Flutter Package #2

[Flutter&Dart] shared_preferences Package 사용하기

[Flutter&Dart] pull_to_refresh Package 사용하기  - Easy Flutter Package #3

[Flutter&Dart] pull_to_refresh Package 사용하기 - Easy Flutter Package #3

[Flutter&Dart] url_launcher Package 사용하기 - Easy Flutter Package #4

[Flutter&Dart] url_launcher Package 사용하기 - Easy Flutter Package #4