🙂 İNSANLARIN EN HAYIRLISI INSANLARA FAYDALI OLANDIR 🙂

Ramazan HABER / FLUTTER / Text change listener refresh yenileme animation animated text kit kullanımı

1-) FLUTTER - Text change listener refresh yenileme animation animated text kit kullanımı

 

kaynak : https://pub.dev/packages/animated_text_kit

 

flutter pub add animated_text_kit

 

1-) ColorizeAnimatedText

 

 

Widget satisContent(TumBankaModel model) {
  
return  AnimatedTextKit(
    key:
ValueKey(saatGetx.saat.value), // buradaki değer değiştiği için refresh yapıyormuş gibi oluyor
    
animatedTexts: [
      
ColorizeAnimatedText(
        model.
satis!.toString(),
        textStyle:
const TextStyle(
          fontWeight:
FontWeight.bold,
          fontSize:
18,
          color:
Colors.black,

        ),
        textAlign:
TextAlign.center, colors: [
        
Colors.purple,
        
Colors.blue,
        
Colors.yellow,
        
Colors.red,
      ],
      ),
    ],
    isRepeatingAnimation:
true,
    totalRepeatCount:
1,
  );
}

 

 

 

 

 

 

 

 

 

 

 

 

2-) GETX ile kullanımı TypewriterAnimatedText

 

 

 

Widget saatContent() {
  
return Obx(
    () =>
Padding(
      padding:
EdgeInsets.only(left: 10),
      child:
AnimatedTextKit(
        key:
ValueKey(saatGetx.saat.value),
        animatedTexts: [
          
TypewriterAnimatedText(
            
"${saatGetx.saat.value}",
            textStyle:
const TextStyle(
              fontWeight:
FontWeight.bold,
              fontSize:
18,
              color:
Colors.white,
            ),
            speed:
const Duration(milliseconds: 50),
          ),
        ],
        isRepeatingAnimation:
true,
        totalRepeatCount:
1,

      ),
    ),
  );
}

 

 

 

 

 

 

 2022 Kasım 06 Pazar
 301