Flutter-Benutzereingabe

// Das einfachste TextField
TextField()

// TextField mit Dekoration
TextField(
  decoration: const InputDecoration(
    labelText: Benutzername,  // Beschriftung
    hintText: 'Bitte Benutzernamen eingeben',  // Hinweistext
    prefixIcon: Icon(Icons.person),  // Präfix-Symbol
  ),
)

// TextField mit Rahmen
TextField(
  decoration: InputDecoration(
    border: OutlineInputBorder(  // Äußerer Rahmen
      borderRadius: BorderRadius.circular(8),
    ),
    labelText: Passwort,
  ),
  obscureText: true,  // Eingabeinhalt ausblenden (Passwortszenario)
)

// Mehrzeilige Texteingabe
TextField(
  maxLines: 3,  // Maximale Zeilen
  decoration: const InputDecoration(
    hintText: 'Bitte mehrzeiligen Text eingeben',
  ),
)

class TextFieldExample extends StatefulWidget {
  const TextFieldExample({super.key});

  @override
  State<TextFieldExample> createState() => _TextFieldExampleState();
}

class _TextFieldExampleState extends State<TextFieldExample> {
  // Controller erstellen
  final TextEditingController _controller = TextEditingController();
  String _displayText = '';

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

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TextField(
          controller: _controller,  // Controller binden
          decoration: const InputDecoration(
            labelText: 'Text eingeben',
          ),
          onChanged: (text) {
            // Auf Textänderungen lauschen
            print('Aktuelle Eingabe: $text');
          },
        ),
        const SizedBox(height: 20),
        // Eingabetext anzeigen
        Text('Sie haben eingegeben: $_displayText'),
        const SizedBox(height: 20),
        ElevatedButton(
          onPressed: () {
            // Text lesen
            setState(() {
              _displayText = _controller.text;
            });
          },
          child: const Text('Eingabe anzeigen'),
        ),
        ElevatedButton(
          onPressed: () {
            // Text löschen
            _controller.clear();
          },
          child: const Text('Leeren'),
        ),
        ElevatedButton(
          onPressed: () {
            // Text setzen
            _controller.text = 'Vorgegebener Text';
          },
          child: const Text('Set text'),
        ),
      ],
    );
  }
}

class FocusExample extends StatefulWidget {
  const FocusExample({super.key});

  @override
  State<FocusExample> createState() => _FocusExampleState();
}

class _FocusExampleState extends State<FocusExample> {
  final FocusNode _focusNode1 = FocusNode();
  final FocusNode _focusNode2 = FocusNode();

  @override
  void dispose() {
    _focusNode1.dispose();
    _focusNode2.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TextField(
          focusNode: _focusNode1,
          decoration: const InputDecoration(labelText: 'Eingabefeld 1'),
        ),
        const SizedBox(height: 10),
        TextField(
          focusNode: _focusNode2,
          decoration: const InputDecoration(labelText: 'Eingabefeld 2'),
        ),
        const SizedBox(height: 20),
        ElevatedButton(
          onPressed: () {
            // Eingabefeld 1 fokussieren
            _focusNode1.requestFocus();
          },
          child: const Text('Eingabefeld 1 fokussieren'),
        ),
        ElevatedButton(
          onPressed: () {
            // Eingabefeld 2 fokussieren
            _focusNode2.requestFocus();
          },
          child: const Text('Eingabefeld 2 fokussieren'),
        ),
        ElevatedButton(
          onPressed: () {
            // Fokus entfernen
            _focusNode1.unfocus();
            _focusNode2.unfocus();
          },
          child: const Text('Fokus entfernen'),
        ),
      ],
    );
  }
}

// TextButton - Textschaltfläche
TextButton(
  onPressed: () => print('Textschaltfläche angeklickt'),
  child: const Text('Textschaltfläche'),
)

// ElevatedButton - erhöhte Schaltfläche
ElevatedButton(
  onPressed: () => print('Erhöhte Schaltfläche angeklickt'),
  child: const Text('Absenden'),
)

// OutlinedButton - Umriss-Schaltfläche
OutlinedButton(
  onPressed: () => print('Umriss-Schaltfläche angeklickt'),
  child: const Text('Abbrechen'),
)

// IconButton - Symbolschaltfläche
IconButton(
  icon: const Icon(Icons.favorite),
  onPressed: () => print('Symbolschaltfläche angeklickt'),
)

// Schaltfläche mit Symbol
ElevatedButton.icon(
  onPressed: () => print('Schaltfläche mit Symbol angeklickt'),
  icon: const Icon(Icons.save),
  label: const Text('Speichern'),
)

// CupertinoButton - Button im iOS-Stil
CupertinoButton(
  child: const Text('iOS-Button'),
  onPressed: () {},
)

class SwitchCheckboxExample extends StatefulWidget {
  const SwitchCheckboxExample({super.key});

  @override
  State<SwitchCheckboxExample> createState() => _SwitchCheckboxExampleState();
}

class _SwitchCheckboxExampleState extends State<SwitchCheckboxExample> {
  bool _switchValue = false;
  bool _checkboxValue = false;
  String _radioValue = 'A';

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Switch - umschalten
        Switch(
          value: _switchValue,
          onChanged: (value) {
            setState(() {
              _switchValue = value;
            });
          },
        ),
        Text('Switch-Wert: $_switchValue'),

        // Checkbox - Kontrollkästchen
        Kontrollkästchen(
          value: _checkboxValue,
          onChanged: (value) {
            setState(() {
              _checkboxValue = value ?? false;
            });
          },
        ),
        Text('Checkbox-Wert: $_checkboxValue'),

        // Radio - Radiobutton
        Row(
          children: [
            Radio<String>(
              value: 'A',
              groupValue: _radioValue,
              onChanged: (value) {
                setState(() {
                  _radioValue = Wert!;
                });
              },
            ),
            const Text('Option A'),
            Radio<String>(
              value: 'B',
              groupValue: _radioValue,
              onChanged: (value) {
                setState(() {
                  _radioValue = Wert!;
                });
              },
            ),
            const Text('Option B'),
          ],
        ),
        Text('Radio-Wert: $_radioValue'),
      ],
    );
  }
}

class SliderExample extends StatefulWidget {
  const SliderExample({super.key});

  @override
  State<SliderExample> createState() => _SliderExampleState();
}

class _SliderExampleState extends State<SliderExample> {
  double _sliderValue = 0.5;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Slider(
          value: _sliderValue,  // Aktueller Wert (0.0-1.0)
          min: 0.0,
          max: 1.0,
          divisions: 10,  // In 10 Teilstriche unterteilen
          label: '${(_sliderValue * 100).round()}%',
          onChanged: (value) {
            setState(() {
              _sliderValue = value;
            });
          },
        ),
        Text('Aktueller Wert: ${(_sliderValue * 100).round()}%'),

        // Bereichs-Slider
        RangeSlider(
          values: const RangeValues(0.3, 0.7),
          min: 0.0,
          max: 1.0,
          onChanged: (values) {
            print('Bereich: ${values.start} - ${values.end}');
          },
        ),
      ],
    );
  }
}