Flutter progress

import 'package:flutter/material.dart';

class LivenessCheckProgress extends StatefulWidget {
  @override
  _LivenessCheckProgressState createState() => _LivenessCheckProgressState();
}

class _LivenessCheckProgressState extends State<LivenessCheckProgress>
    with SingleTickerProviderStateMixin {
  int _currentStep = 0;
  late AnimationController _controller;
  List<String> messages = [
    "Starting liveness check...",
    "Capturing your biometric data...",
    "Processing identity verification...",
    "Finalising verification...",
    "You have successfully completed the liveness",
  ];

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

  void _startProgress() async {
    // Simulate the liveness process
    for (int i = 0; i < 5; i++) {
      await Future.delayed(Duration(seconds: 2), () {
        setState(() {
          _currentStep = i;
        });
        _controller.forward(from: 0.0); // Animate each step
      });
    }
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  Widget _buildProgressBar() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        SizedBox(
          width: double.infinity, // Set constraints on the Stack
          height: 100, // Set a fixed height
          child: Stack(
            alignment: Alignment.center,
            children: [
              // Dots behind the progress bar
              Positioned.fill(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: List.generate(5, (index) {
                    return Container(
                      height: 70,  // Larger point size
                      width: 70,   // Larger point size
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        color: index <= _currentStep
                            ? Colors.blue
                            : Colors.white, // Unfilled points are white
                        border: Border.all(
                          color: Colors.blue, // Border remains blue
                          width: 5,  // Thick border for good visibility
                        ),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.black26,
                            blurRadius: 10,
                            offset: Offset(0, 5),
                          ),
                        ], // Shadow for emphasis
                      ),
                    );
                  }),
                ),
              ),
              // The thinner linear progress bar on top
              Positioned(
                top: 40, // Adjust position to be inside the circle points
                left: 0,
                right: 0,
                child: Container(
                  height: 6, // Thinner progress bar for more visible points
                  child: LinearProgressIndicator(
                    value: (_currentStep + 1) / 5.0,
                    backgroundColor: Colors.grey.shade300,
                    color: Colors.blue,
                  ),
                ),
              ),
            ],
          ),
        ),
        SizedBox(height: 30),
        Text(
          messages[_currentStep],
          style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
          textAlign: TextAlign.center,
        ),
      ],
    );
  }

  Widget _buildSuccessMessage() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Icon(Icons.check_circle_outline, size: 80, color: Colors.green),
        SizedBox(height: 20),
        Text(
          "You have successfully completed the liveness",
          style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold, color: Colors.green),
          textAlign: TextAlign.center,
        ),
        SizedBox(height: 30),
        ElevatedButton(
          onPressed: () {
            // Navigate to the next step or screen
          },
          style: ElevatedButton.styleFrom(
            padding: EdgeInsets.symmetric(horizontal: 50, vertical: 15),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20),
            ),
          ),
          child: Text(
            'Next',
            style: TextStyle(fontSize: 18),
          ),
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Liveness Check"),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(20.0),
          child: _currentStep < 4 ? _buildProgressBar() : _buildSuccessMessage(),
        ),
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: LivenessCheckProgress(),
  ));
}