본문 바로가기
new

Flutter에서 SingleTickerProviderMixin 사용 이유

by ftbd 2024. 3. 11.

SingleTickerProviderMixin은 Flutter에서 애니메이션을 위한 Ticker를 제공하는 데 사용되는 Mixin입니다. Ticker는 애니메이션 진행 상황을 추적하는 객체입니다.

사용 이유

SingleTickerProviderMixin을 사용하는 이유는 다음과 같습니다.

  • 애니메이션 성능 향상: SingleTickerProviderMixin은 앱 전체에서 단일 Ticker를 사용하여 애니메이션 성능을 향상시킵니다.
  • 메모리 사용량 감소: SingleTickerProviderMixin은 앱 전체에서 여러 Ticker를 사용하는 것보다 메모리 사용량을 줄입니다.
  • 코드 간결화: SingleTickerProviderMixin은 애니메이션 코드를 간결하게 만들 수 있습니다.

 

사용 방법

SingleTickerProviderMixin을 사용하려면 다음 단계를 수행해야 합니다.

  1. SingleTickerProviderMixin을 위젯에 Mixin합니다.
  2. vsync 속성을 사용하여 Ticker를 생성합니다.
  3. Ticker를 사용하여 애니메이션을 구현합니다.

 

예시 구현 코드

다음은 간단한 예시입니다.

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderMixin {
  AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: Duration(seconds: 1),
    );
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _controller,
      builder: (context, child) {
        return Transform.rotate(
          angle: _controller.value * 2 * pi,
          child: child,
        );
      },
      child: Container(
        color: Colors.red,
        width: 100,
        height: 100,
      ),
    );
  }
}