Design: Remplacement du point rouge par une mire vert fluo interne dans le viseur

This commit is contained in:
qguillaume
2026-05-25 02:59:46 +02:00
parent f149fe092b
commit a9ff826246
2 changed files with 104 additions and 93 deletions

View File

@@ -82,81 +82,83 @@ class _CropScreenState extends State<CropScreen> {
body: _isLoading body: _isLoading
? const Center(child: CircularProgressIndicator(color: Color(0xFF1A73E8))) ? const Center(child: CircularProgressIndicator(color: Color(0xFF1A73E8)))
: Column( : Column(
children: [
// Zone interactive de crop
Expanded(
child: Container(
margin: const EdgeInsets.all(20),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.white10),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: _imageLoaded ? _buildInteractiveCrop() : const Center(child: CircularProgressIndicator()),
),
),
),
// Bouton d'aide / Modifier
Padding(
padding: const EdgeInsets.symmetric(vertical: 20),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// CORRECTION : Icône passée en vert fluo (0xFF00FF00)
const Icon(Icons.center_focus_strong, color: Color(0xFF00FF00), size: 20),
const SizedBox(width: 8),
Text(
'Alignez le centre de la cible sur la croix',
style: TextStyle(color: Colors.white.withOpacity(0.8), fontSize: 14, fontWeight: FontWeight.w500),
),
],
),
const SizedBox(height: 4),
Text(
'Zoomez pour plus de précision',
style: TextStyle(color: Colors.white.withOpacity(0.5), fontSize: 12),
),
],
),
),
// Boutons du bas
Padding(
padding: const EdgeInsets.fromLTRB(20, 0, 20, 30),
child: Row(
children: [ children: [
// Zone interactive de crop
Expanded( Expanded(
child: Container( child: OutlinedButton(
margin: const EdgeInsets.all(20), onPressed: () => Navigator.pop(context),
decoration: BoxDecoration( style: OutlinedButton.styleFrom(
borderRadius: BorderRadius.circular(12), side: const BorderSide(color: Colors.white24),
border: Border.all(color: Colors.white10), padding: const EdgeInsets.symmetric(vertical: 15),
), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: _imageLoaded ? _buildInteractiveCrop() : const Center(child: CircularProgressIndicator()),
), ),
child: const Text('Retour', style: TextStyle(color: Colors.white)),
), ),
), ),
const SizedBox(width: 16),
// Bouton d'aide / Modifier Expanded(
Padding( child: ElevatedButton(
padding: const EdgeInsets.symmetric(vertical: 20), onPressed: _onCropConfirm,
child: Column( style: ElevatedButton.styleFrom(
children: [ backgroundColor: const Color(0xFF1A73E8),
Row( foregroundColor: Colors.white,
mainAxisAlignment: MainAxisAlignment.center, padding: const EdgeInsets.symmetric(vertical: 15),
children: [ shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
const Icon(Icons.center_focus_strong, color: Colors.redAccent, size: 20), ),
const SizedBox(width: 8), // CORRECTION : Texte modifié pour correspondre au nouveau flux
Text( child: const Text('Suivant', style: TextStyle(fontWeight: FontWeight.bold)),
'Alignez le centre de la cible sur la croix',
style: TextStyle(color: Colors.white.withOpacity(0.8), fontSize: 14, fontWeight: FontWeight.w500),
),
],
),
const SizedBox(height: 4),
Text(
'Zoomez pour plus de précision',
style: TextStyle(color: Colors.white.withOpacity(0.5), fontSize: 12),
),
],
),
),
// Boutons du bas
Padding(
padding: const EdgeInsets.fromLTRB(20, 0, 20, 30),
child: Row(
children: [
Expanded(
child: OutlinedButton(
onPressed: () => Navigator.pop(context),
style: OutlinedButton.styleFrom(
side: const BorderSide(color: Colors.white24),
padding: const EdgeInsets.symmetric(vertical: 15),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('Retour', style: TextStyle(color: Colors.white)),
),
),
const SizedBox(width: 16),
Expanded(
child: ElevatedButton(
onPressed: _onCropConfirm,
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF1A73E8),
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(vertical: 15),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
),
child: const Text('Analyser', style: TextStyle(fontWeight: FontWeight.bold)),
),
),
],
), ),
), ),
], ],
), ),
),
],
),
); );
} }
@@ -253,6 +255,10 @@ class _CropScreenState extends State<CropScreen> {
final targetCenterY = cropRect.y + cropRect.height / 2; final targetCenterY = cropRect.y + cropRect.height / 2;
if (!mounted) return; if (!mounted) return;
// Note : On laisse temporairement AnalysisScreen ici.
// Dès qu'on s'attaque au fichier de calibration, on modifiera cette ligne
// pour basculer directement sur le bon écran !
Navigator.pushReplacement( Navigator.pushReplacement(
context, context,
MaterialPageRoute( MaterialPageRoute(

View File

@@ -68,7 +68,7 @@ class _CropOverlayPainter extends CustomPainter {
_drawGrid(canvas, cropRect); _drawGrid(canvas, cropRect);
} }
// Dessiner le point central (croix) // Dessiner le point central (croix interne vert fluo)
_drawCenterPoint(canvas, cropRect); _drawCenterPoint(canvas, cropRect);
} }
@@ -165,35 +165,40 @@ class _CropOverlayPainter extends CustomPainter {
} }
void _drawCenterPoint(Canvas canvas, Rect rect) { void _drawCenterPoint(Canvas canvas, Rect rect) {
// Peinture de la croix interne (Vert Fluo)
final centerPaint = Paint() final centerPaint = Paint()
..color = Colors.white.withValues(alpha: 0.8) ..color = const Color(0xFF00FF00)
..style = PaintingStyle.stroke ..style = PaintingStyle.stroke
..strokeWidth = 2; ..strokeWidth = 2.0;
const size = 10.0; // Cercle extérieur (Vert Fluo fin)
final circlePaint = Paint()
..color = const Color(0xFF00FF00).withValues(alpha: 0.9)
..style = PaintingStyle.stroke
..strokeWidth = 1.2;
const circleRadius = 10.0; // Augmenté légèrement à 10 pour que la croix respire
final centerX = rect.center.dx; final centerX = rect.center.dx;
final centerY = rect.center.dy; final centerY = rect.center.dy;
// Ligne horizontale // 1. Dessiner le cercle de contour
canvas.drawCircle(rect.center, circleRadius, circlePaint);
// 2. Dessiner la croix UNIQUEMENT à l'intérieur du cercle
// Ligne horizontale (de gauche à droite, reste à l'intérieur)
canvas.drawLine( canvas.drawLine(
Offset(centerX - size, centerY), Offset(centerX - circleRadius, centerY),
Offset(centerX + size, centerY), Offset(centerX + circleRadius, centerY),
centerPaint, centerPaint,
); );
// Ligne verticale // Ligne verticale (de haut en bas, reste à l'intérieur)
canvas.drawLine( canvas.drawLine(
Offset(centerX, centerY - size), Offset(centerX, centerY - circleRadius),
Offset(centerX, centerY + size), Offset(centerX, centerY + circleRadius),
centerPaint, centerPaint,
); );
// Petit cercle central pour précision (optionnel, mais aide à viser)
canvas.drawCircle(
rect.center,
2,
Paint()..color = Colors.red.withValues(alpha: 0.6),
);
} }
@override @override