Last active
November 9, 2019 13:03
-
-
Save tchafack/66e5a0896860ac22f751a26903ed2c7f to your computer and use it in GitHub Desktop.
Relative complexe form line (TextFormField-TextField- in a Row) with Flutter (Dart)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
class EventForm extends StatefulWidget { | |
@override | |
_EventFormState createState() => _EventFormState(); | |
} | |
class _EventFormState extends State<EventForm> { | |
static GlobalKey<FormState> _eventformKey = GlobalKey<FormState>(); | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
backgroundColor: Colors.white, | |
appBar: AppBar( | |
title: Text('Create an event'), | |
centerTitle: true, | |
), | |
body: Container( | |
decoration: BoxDecoration( | |
border: Border.all( | |
color: Color(0xFF263238), | |
width: 1.1, | |
), | |
), | |
child: SingleChildScrollView( | |
child: Padding( | |
padding: EdgeInsets.all(10.0), | |
child: Column( | |
children: <Widget>[ | |
Form( | |
key: _eventformKey, | |
child: Column( | |
crossAxisAlignment: CrossAxisAlignment.start, | |
children: <Widget>[ | |
TextFormField( | |
decoration: const InputDecoration( | |
icon: Icon(Icons.calendar_today), | |
hintText: 'Title of the event', | |
labelText: 'Title *', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
TextFormField( | |
decoration: const InputDecoration( | |
icon: Icon(Icons.location_on), | |
hintText: 'Complete address of the event', | |
labelText: 'Address *', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
Container( | |
padding: EdgeInsets.only(top: 10.0), | |
child: Row( | |
children: <Widget>[ | |
Expanded( | |
child: Padding( | |
padding: const EdgeInsets.all(5.0), | |
child: Icon( | |
Icons.access_time, | |
), | |
), | |
), | |
Expanded(child: Text(' From ')), | |
Expanded( | |
flex: 3, | |
child: Column( | |
mainAxisSize: MainAxisSize.min, | |
children: <Widget>[ | |
TextFormField( | |
decoration: const InputDecoration( | |
hintText: 'Date', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
Container( | |
padding: EdgeInsets.only(top: 10.0), | |
child: Text('at'), | |
), | |
TextFormField( | |
decoration: const InputDecoration( | |
hintText: 'Hour', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
], | |
), | |
), | |
Expanded(child: Text(' To ')), | |
Expanded( | |
flex: 3, | |
child: Column( | |
mainAxisSize: MainAxisSize.min, | |
children: <Widget>[ | |
TextFormField( | |
decoration: const InputDecoration( | |
hintText: 'Date', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
Container( | |
padding: EdgeInsets.only(top: 10.0), | |
child: Text('at'), | |
), | |
TextFormField( | |
decoration: const InputDecoration( | |
hintText: 'Hour', | |
), | |
validator: (value) { | |
if (value.isEmpty) { | |
return ''; | |
} | |
return null; | |
}, | |
), | |
], | |
), | |
), | |
], | |
), | |
), | |
Padding( | |
padding: const EdgeInsets.symmetric(vertical: 16.0), | |
child: RaisedButton( | |
onPressed: () { | |
// Validate will return true if the form is valid, or false if | |
// the form is invalid. | |
if (_eventformKey.currentState.validate()) { | |
// Process data. | |
} | |
}, | |
child: Text('Submit'), | |
), | |
), | |
], | |
), | |
), | |
], | |
), | |
), | |
), | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment