Slider integrated with Text
This commit is contained in:
parent
533b9434ec
commit
151cb9e6db
|
|
@ -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'),
|
||||
)
|
||||
],
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in New Issue