Flutter - Y/X -Achse -Linie wird im Dialogfeld Colorpicker angezeigt ⇐ Android

[Anonymous]

y/x -Achsenlinie
Hallo, ich möchte Hilfe in diesen Problemen erhalten. Ich habe das Plugin, das flutter_colorpicker ist: ^1.1.0 in Flattern. Aber nicht sicher, warum der Dialog die Y/X -Achsenlinie hat.
// ignore_for_file: use_build_context_synchronously

import 'package:flutter/material.dart';
import 'package:flutter_colorpicker/flutter_colorpicker.dart';

class ColorPickerField extends StatefulWidget {
final TextEditingController controller;
final String label;
final String defaultColor;
final Function(String) onColorChanged;

const ColorPickerField({
super.key,
required this.controller,
required this.label,
required this.defaultColor,
required this.onColorChanged,
});

@override
State createState() => _ColorPickerFieldState();
}

class _ColorPickerFieldState extends State {
Color _currentColor = Colors.black;

@override
void initState() {
super.initState();
_currentColor = _parseColor(widget.controller.text);
widget.controller.addListener(_updateColorFromController);
}

@override
void dispose() {
widget.controller.removeListener(_updateColorFromController);
super.dispose();
}

void _updateColorFromController() {
final newColor = _parseColor(widget.controller.text);
if (_currentColor != newColor) {
setState(() {
_currentColor = newColor;
});
}
}

void _showColorPicker(BuildContext context) {
Color pickerColor = _currentColor;

showDialog(
context: context,
builder: (BuildContext dialogContext) {
return AlertDialog(
title: Text('Pick ${widget.label}'),
content: SingleChildScrollView(
child: ColorPicker(
pickerColor: pickerColor,
onColorChanged: (Color color) {
pickerColor = color;
},
pickerAreaHeightPercent: 0.8,
enableAlpha: false,
displayThumbColor: true,
hexInputBar: true,
labelTypes: const [ColorLabelType.hex],
),
),
actions: [
TextButton(
child: const Text('Cancel'),
onPressed: () {
Navigator.of(dialogContext).pop();
},
),
ElevatedButton(
child: const Text('Select'),
onPressed: () {
Navigator.of(dialogContext).pop();

// Convert color to hex format
final colorString =
'#${pickerColor.value.toRadixString(16).substring(2, 8).toUpperCase()}';

// Update controller text and trigger controller listener
widget.controller.text = colorString;

// Update local state for immediate UI refresh
setState(() {
_currentColor = pickerColor;
});

// Call the onColorChanged callback to update parent
widget.onColorChanged(colorString);
},
),
],
);
},
);
}

Color _parseColor(String colorString) {
try {
if (colorString.startsWith('#')) {
return Color(int.parse('FF${colorString.substring(1)}', radix: 16));
}
return Color(
int.parse('FF${widget.defaultColor.replaceAll("#", "")}', radix: 16),
);
} catch (e) {
return const Color(0xFF000000);
}
}

@override
Widget build(BuildContext context) {
return TextField(
controller: widget.controller,
readOnly: true,
onTap: () {
_showColorPicker(context);
},
decoration: InputDecoration(
labelText: widget.label,
border: const OutlineInputBorder(),
filled: true,
fillColor: Colors.white,
prefixIcon: Icon(
Icons.color_lens,
color: _currentColor,
),
suffixIcon: Container(
margin: const EdgeInsets.all(8),
width: 24,
height: 24,
decoration: BoxDecoration(
color: _currentColor,
border: Border.all(color: Colors.grey),
borderRadius: BorderRadius.circular(4),
),
),
),
);
}
}

< /code>
Ich habe viele Möglichkeiten ausprobiert, aber es funktioniert nicht. Ich schalte die Entwickleroptionen nie ein>