Socialmedia_Julien/lib/presentation/widgets/creation_flow_layout.dart

// lib/presentation/widgets/creation_flow_layout.dart

import 'package:flutter/material.dart';

class CreationProgressIndicator extends StatelessWidget {

  const CreationProgressIndicator({    required this.currentStep, super.key,
    this.totalSteps = 3,
  });
  final int currentStep;
  final int totalSteps;

  @override
  Widget build(BuildContext context) => Padding(
      padding: const EdgeInsets.symmetric(vertical: 16),
      // --- MODIFICATION 1 : On centre la Row principale ---
      child: Center(
        child: Row(
          // On s'assure que la Row ne prend que la place nécessaire
          mainAxisSize: MainAxisSize.min,
          children: List.generate(totalSteps, (index) {
            final isActive = index == currentStep;
            final isCompleted = index < currentStep;
            final isLast = index == totalSteps - 1;

            // --- MODIFICATION 2 : Chaque segment a maintenant une largeur fixe ---
            return Row(
              children: [
                // Le cercle de l'étape
                Container(
                  height: 24,
                  width: 24,
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    color: isActive || isCompleted
                        ? Theme.of(context).primaryColor
                        : Theme.of(context).colorScheme.surfaceContainerHighest,
                  ),
                  child: Center(
                    child: isCompleted
                        ? const Icon(Icons.check, color: Colors.white, size: 16)
                        : Text(
                      '${index + 1}',
                      style: TextStyle(
                        color: isActive
                            ? Colors.white
                            : Theme.of(context).colorScheme.onSurfaceVariant,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ),
                // La ligne de connexion (sauf pour la dernière)
                if (!isLast)
                  Container(
                    // On donne une largeur fixe à la ligne de connexion
                    width: 60,
                    height: 2,
                    margin: const EdgeInsets.symmetric(horizontal: 8),
                    color: isCompleted
                        ? Theme.of(context).primaryColor
                        : Theme.of(context).colorScheme.surfaceContainerHighest,
                  ),
              ],
            );
          }),
        ),
      ),
    );
}


// Le reste du fichier CreationFlowLayout reste inchangé
class CreationFlowLayout extends StatelessWidget {

  const CreationFlowLayout({
    required this.currentStep, required this.title, required this.child, super.key,
  });
  final int currentStep;
  final String title;
  final Widget child;

  @override
  Widget build(BuildContext context) => Scaffold(
      appBar: AppBar(
        title: Text(title),
        elevation: 0,
        centerTitle: true,
      ),
      body: Column(
        children: [
          CreationProgressIndicator(currentStep: currentStep),
          const Divider(height: 1),
          Expanded(
            child: child,
          ),
        ],
      ),
    );
}