loading_text_sample.dart

import 'package:flutter/material.dart';
import 'dart:math' as math;

class LoadingText extends StatefulWidget {
  const LoadingText({Key? key, required this.text}) : super(key: key);

  final String text;

  @override
  _LoadingTextState createState() => _LoadingTextState();
}

class _LoadingTextState extends State<LoadingText>
    with SingleTickerProviderStateMixin {
  AnimationController? controller;

  @override
  void initState() {
    controller = AnimationController(
        vsync: this, duration: Duration(milliseconds: 1800));
    controller?.repeat();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        AnimatedBuilder(
          animation: controller!,
          builder: (context, _) => ShaderMask(
            shaderCallback: (bounds) => SweepGradient(
              colors: [
                Colors.white,
                Colors.blue,
                Colors.blue,
                Colors.white,
              ],
              stops: [0.0, 0.0, 0.3, 0.3],
              transform: GradientRotation(controller!.value * 2.0 * math.pi),
            ).createShader(bounds),
            child: Container(
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(60),
              ),
              height: 36,
              width: double.maxFinite,
            ),
          ),
        ),
        Positioned(
          top: 2,
          bottom: 2,
          left: 2,
          right: 2,
          child: Container(
            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(60),
            ),
            child: Center(
              child: Text(
                widget.text,
                style: TextStyle(
                  fontSize: 14,
                  fontWeight: FontWeight.bold,
                ),
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          ),
        ),
      ],
    );
  }

  @override
  void dispose() {
    controller?.dispose();
    super.dispose();
  }
}

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(title: Text('Loading Animation Sample')),
        body: Center(
          child: LoadingText(text: 'Loading...'),
        ),
      ),
    );
  }
}