Slider integrated with Text

This commit is contained in:
Niklas 2023-12-29 21:11:16 +01:00
parent 533b9434ec
commit 151cb9e6db
1 changed files with 37 additions and 40 deletions

View File

@ -1,10 +1,11 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() => runApp(MyApp());
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
//const MyApp({super.key});
// This widget is the root of your application.
@ -32,13 +33,13 @@ class MyApp extends StatelessWidget {
useMaterial3: true,
primaryColor: Colors.lightBlue,
),
home: MyFormPage(title: 'Flutter Formular'),
home: const MyFormPage(title: 'Flutter Formular'),
);
}
}
class MyFormPage extends StatefulWidget {
MyFormPage({Key key = const Key('defaultKey'), required this.title})
const MyFormPage({Key key = const Key('defaultKey'), required this.title})
: super(key: key);
final String title;
@override
@ -52,6 +53,7 @@ class _MyFormPageState extends State<MyFormPage> {
}
final _formKey = GlobalKey<FormState>();
double _currentSliderValue = 20;
@override
Widget build(BuildContext context) {
return Scaffold(
@ -69,8 +71,8 @@ class _MyFormPageState extends State<MyFormPage> {
TextFormField(
keyboardType: TextInputType.text,
autocorrect: false,
decoration: InputDecoration(
labelText: 'Benutzername',
decoration: const InputDecoration(
labelText: 'Wohin solls gehen?',
border: OutlineInputBorder(),
),
validator: (value) {
@ -80,62 +82,57 @@ class _MyFormPageState extends State<MyFormPage> {
return null;
},
),
SizedBox(height: 20),
const SizedBox(height: 20),
TextFormField(
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: 'E-Mail',
decoration: const InputDecoration(
labelText: 'GPS: Hier bin ich',
border: OutlineInputBorder(),
),
),
SizedBox(height: 20),
const SizedBox(height: 20),
TextFormField(
obscureText: true,
decoration: InputDecoration(
labelText: 'Passwort',
decoration: const InputDecoration(
labelText: 'Punkt auf der Karte',
border: OutlineInputBorder(),
),
),
SizedBox(height: 20),
TextFormField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Lieblingszahl',
border: OutlineInputBorder(),
),
validator: zahlValidator,
inputFormatters: <TextInputFormatter>[
FilteringTextInputFormatter.digitsOnly,
],
const SizedBox(height: 20),
Text(
"Umkreis von " +
_currentSliderValue.floor().toString() +
" km",
style: TextStyle(fontSize: 20),
),
SizedBox(height: 20),
TextFormField(
maxLines: 5,
maxLength: 120,
decoration: InputDecoration(
hintText: 'Freitext',
border: OutlineInputBorder(),
),
),
SizedBox(height: 40),
Slider(
value: _currentSliderValue,
max: 100,
divisions: 5,
label: _currentSliderValue.round().toString() + " km",
onChanged: (double value) {
setState(() {
_currentSliderValue = value;
});
}),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.grey,
textStyle: TextStyle(color: Colors.white)),
backgroundColor: Colors.grey,
textStyle: const TextStyle(color: Colors.white)),
onPressed: () {
// reset() setzt alle Felder wieder auf den Initalwert zurück.
_formKey.currentState?.reset();
},
child: Text('Löschen'),
child: const Text('Löschen'),
),
SizedBox(width: 25),
const SizedBox(width: 25),
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.blue,
textStyle: TextStyle(color: Colors.white)),
backgroundColor: Colors.blue,
textStyle: const TextStyle(color: Colors.white)),
onPressed: () {
// Wenn alle Validatoren der Felder des Formulars gültig sind.
if (_formKey.currentState!.validate()) {
@ -145,7 +142,7 @@ class _MyFormPageState extends State<MyFormPage> {
print("Formular ist nicht gültig");
}
},
child: Text('Speichern'),
child: const Text('Speichern'),
)
],
)