Why i gonna null of the String in Flutter?

Why i gonna null of the String in Flutter? - android

I have a problem with a simple thing but I don't how is it happening in the code.
Below is the code:
Widget build(BuildContext context) {
String newTaskTitle;
return Container(
color: Color(0xff757575),
child: Container(
padding: EdgeInsets.all(20.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0),
topRight: Radius.circular(20.0),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text(
'Add Task',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 30.0,
color: Colors.lightBlueAccent,
),
),
TextField(
autofocus: true,
textAlign: TextAlign.center,
onChanged: (newText) {
newTaskTitle = newText;
},
),
FlatButton(
child: Text(
'Add',
style: TextStyle(
color: Colors.white,
),
),
color: Colors.lightBlueAccent,
onPressed: () {
print(newTaskTitle);
},
),
],
),
),
);
}
I try to get the value of the text field input and pass it to another screen but when I type something then press the button, it gives me the null.

You can also achieve this using controllers. just initialize one and specify the controller in the TextField widget. To access the text, just do _controlller.text as you can see below:
final _controller = TextEditingController();
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
color: Color(0xff757575),
child: Container(
padding: EdgeInsets.all(20.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0),
topRight: Radius.circular(20.0),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text(
'Add Task',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 30.0,
color: Colors.lightBlueAccent,
),
),
TextField(
controller: _controller,
autofocus: true,
textAlign: TextAlign.center,
),
FlatButton(
child: Text(
'Add',
style: TextStyle(
color: Colors.white,
),
),
color: Colors.lightBlueAccent,
onPressed: () {
print(_controller.text);
},
),
],
),
),
),
);
}

You have defined String newTaskTitle inside the build() method try removing it from inside the build method and try defining it inside the StatefulWidget.
This is happening because TextField on change method calls build() method every time the text is changed

Related

How to remove padding from top of ListTile in Drawer?

I can not remove the indent from the first ListTile in any way. I think this is some kind of default indent, but I could not overcome it. Is it possible? Attached is the code and screenshot.
Drawer(
child: Container(
padding: EdgeInsets.zero,
child: Column(
children: <Widget>[
SizedBox(
height: 88.0,
width: 1000,
child: DrawerHeader(
decoration: BoxDecoration(
color: Colors.blue,
),
child: Text(
'Настройки',
style: TextStyle(
color: Colors.white,
fontSize: MainStyle.p.fontSize
),
),
),
),
Expanded(
child: Column(
children: <Widget>[
ListTile(
title: Text(
'Язык',
style: TextStyle(
fontSize: MainStyle.p.fontSize
),
),
subtitle: Text(
"Русский",
),
trailing: IconButton(
icon: Icon(Icons.edit),
color: Colors.black,
onPressed: () {
},
),
),
ListTile(
title: Text(
'Выход',
style: TextStyle(
fontSize: MainStyle.p.fontSize
),
),
onTap: () {
exit();
},
),
],
)
),
Container(
child: Align(
alignment: FractionalOffset.bottomCenter,
child: Column(
children: <Widget>[
ListTile(
title: Text(
globalState.version,
style: TextStyle(
fontSize: 15,
color: Colors.grey
),
textAlign: TextAlign.center,
),
),
],
)
)
),
],
),
)
);
P.S. There is not any details, but StackOverflow make me write more text, because of "It looks like your post is mostly code; please add some more details."

add this line to your DrawerHeader:
margin: EdgeInsets.zero,

How to resize TextField() text to fit the max width of an Expanded() widget

i want to resize the text of a TextField() widget in order to fit the max width of its Expanded() parent, this width is determined by flex: 10 as you can see in the code.
However, i do not know how can i achieve this result. I also tried the AutoSizeTextField() package with no success. Maybe someone can figure out how to do this.
Thank you in advance.
Edit. If it is not clear, the text is entered by the user. I want to resize it dynamically. The following image is just an example of the current behaviour of the App when user enters "This text should be resized".
Edit. I updated the code so that is clear what i am trying to do.
I have a list of transactions. When the user click on a transaction a dialog will popup in order to let the user edit the info he has provided.
This is the code which call the dialog, the dialog is ModificaTransazione().
Material(
color: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
),
child: InkWell(
borderRadius: BorderRadius.circular(10),
onTap: () {
//sleep(Duration(milliseconds: 800));
showDialog(
context: context,
builder: (context) {
return Dialog(
insetPadding: EdgeInsets.only(
bottom: 0.0), //QUESTO TOGLIE SPAZIO DALLA TASTIERA
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(40)),
elevation: 16,
child: ModificaTransazione(
idtransazione: tx.id,
titolotransazione: tx.titolo,
importotransazione: tx.costo,
datatransazione: tx.data,
indicetransazione: tx.indicecategoria,
notatransazione: tx.nota,
listatransazioni: widget.transactions,
eliminatransazione: widget.deleteTx,
listanomicategorie: widget.listanomicategorie,
refreshSezioneFinanziaria:
widget.refreshFinanceScreen,
size: size),
);
},
).then((_) {
setState(() {});
});
},
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
),
child: SizedBox(
height: size.height * 0.10,
// color: Colors.red,
child: Row(
children: [
Expanded(
flex: 4,
child: Container(
margin: const EdgeInsets.only(left: 15),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
FittedBox(
child: Text(
tx.titolo,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
FittedBox(
child: Text(
DateFormat('dd MMMM, yyyy', 'it')
.format(tx.data),
style: const TextStyle(
color: Colors.grey,
),
),
),
],
),
),
),
Expanded(
flex: 5,
child: Container(
alignment: Alignment.centerRight,
margin: const EdgeInsets.symmetric(horizontal: 15),
child: FittedBox(
child: Text(
'- ${ciframostrata(tx.costo)} €',
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
color: Color(0xFF7465fc)),
),
),
),
),
],
),
),
),
),
),
This is "ModificaTransazione()" literally "Edit Transaction" in Italian.
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter_application_1/models/transaction.dart';
import 'package:flutter_application_1/widget/transactions_list.dart';
import 'package:intl/intl.dart';
import 'package:auto_size_text_field/auto_size_text_field.dart';
class ModificaTransazione extends StatefulWidget {
ModificaTransazione({
Key? key,
required this.size,
required this.idtransazione,
required this.titolotransazione,
required this.importotransazione,
required this.datatransazione,
required this.indicetransazione,
required this.notatransazione,
required this.listatransazioni,
required this.eliminatransazione,
required this.listanomicategorie,
required this.refreshSezioneFinanziaria,
}) : super(key: key);
final Size size;
final String idtransazione;
String titolotransazione;
double importotransazione;
DateTime datatransazione;
int indicetransazione;
String notatransazione;
List<String> listanomicategorie;
List<Transaction> listatransazioni;
final Function eliminatransazione;
final Function refreshSezioneFinanziaria;
#override
State<ModificaTransazione> createState() => _ModificaTransazioneState();
}
class _ModificaTransazioneState extends State<ModificaTransazione> {
var _notaController = TextEditingController();
var _importoController = TextEditingController();
var _titoloController = TextEditingController();
#override
void initState() {
super.initState();
if (widget.notatransazione != "") {
_notaController = TextEditingController(text: widget.notatransazione);
} else {
_notaController = TextEditingController(text: "Aggiungi");
}
_importoController = TextEditingController(
text: "${ciframostrata(widget.importotransazione)}");
_titoloController = TextEditingController(text: widget.titolotransazione);
}
#override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Container(
width: widget.size.width * 0.8,
height: widget.size.height * 0.60,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
),
child: Padding(
padding:
const EdgeInsets.only(top: 30, left: 30, right: 30, bottom: 30),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
GestureDetector(
onTap: () {
setState(() {
Navigator.of(context).pop();
});
},
child: Icon(
Icons.cancel,
color: Colors.black,
),
),
Spacer(),
Expanded(
//
// THIS IS WHAT I WANT TO RESIZE, BUT FITTEDBOX IS CAUSING RENDERBOX IS NOT LAID OUT
//
flex: 10,
child: FittedBox(
fit: BoxFit.fitWidth,
child: TextField(
maxLines: 1,
decoration: InputDecoration(
border: InputBorder.none,
),
controller: _titoloController,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
onSubmitted: (_) => salvaModifica(),
),
),
),
Spacer(),
GestureDetector(
child: Icon(
Icons.delete_outline_rounded,
color: Colors.black,
),
onTap: () {
print("Transazione Eliminata");
widget.eliminatransazione(widget.idtransazione);
Navigator.of(context).pop();
}),
],
),
Container(
padding: EdgeInsets.all(15),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
color: Theme.of(context).primaryColor.withOpacity(0.1),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Flexible(
flex: 4,
child: TextField(
decoration: InputDecoration(
border: InputBorder.none,
),
controller: _importoController,
keyboardType: const TextInputType.numberWithOptions(
decimal: true),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 60,
color: Theme.of(context).primaryColor,
),
onSubmitted: (_) => salvaModifica(),
),
),
Flexible(
//color: Colors.red,
//alignment: Alignment.centerRight,
//width: widget.size.width * 0.10,
// color: Colors.red,
child: Text(
"€",
style: TextStyle(
fontSize: 40,
color:
Theme.of(context).primaryColor.withOpacity(0.8),
),
),
),
],
),
),
// AutoSizeText(
// "${ciframostrata(widget.importotransazione)} €",
// maxLines: 1,
// style: TextStyle(
// fontSize: 70,
// color: Theme.of(context).primaryColor,
// ),
// ),
// ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Categoria",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: Colors.grey,
),
),
Container(
child: Row(
children: [
GestureDetector(
child: Text(
"${funzioneCategoria(indicenuovo ?? widget.indicetransazione, widget.listanomicategorie)[2]} ",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: funzioneCategoria(
indicenuovo ?? widget.indicetransazione,
widget.listanomicategorie)[1]),
),
onTap: _askedToLead,
),
Icon(
funzioneCategoria(
indicenuovo ?? widget.indicetransazione,
widget.listanomicategorie)[0],
color: funzioneCategoria(
indicenuovo ?? widget.indicetransazione,
widget.listanomicategorie)[1]),
],
),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Data",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: Colors.grey,
),
),
InkWell(
// borderRadius: BorderRadius.circular(10),
onTap: _presentDatePicker,
child: Text(
DateFormat('dd MMMM, yyyy', 'it')
.format(_selectedDate ?? widget.datatransazione),
style: TextStyle(
color: Colors.black, //Theme.of(context).primaryColor,
fontWeight: FontWeight.bold,
),
),
),
],
),
Container(
//color: Colors.red,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text(
"Nota",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: Colors.grey,
),
),
),
Expanded(
child: (_notaController.text != "Aggiungi")
? TextField(
textAlign: TextAlign.end,
decoration: InputDecoration(
border: InputBorder.none,
),
controller: _notaController,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
),
onSubmitted: (_) => salvaModifica(),
)
: TextField(
textAlign: TextAlign.end,
decoration: InputDecoration(
border: InputBorder.none,
),
controller: _notaController,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.grey[600],
),
onSubmitted: (_) => salvaModifica(),
)),
],
),
),
modificato == true
? TextButton(
child: Text("Salva"),
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(
Theme.of(context).primaryColor),
foregroundColor:
MaterialStateProperty.all(Colors.white),
),
onPressed: () {
premuto = true;
salvaModifica();
},
)
: SizedBox(),
],
),
),
),
);
}

You can use the FittedBox widget to dynamically change text size based on width or height.
FittedBox(
fit: BoxFit.fitWidth,
child: TextField(
maxLines: 1,
decoration: InputDecoration(
border: InputBorder.none,
),
controller: _titoloController,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
onSubmitted: (_) => salvaModifica(),
)),
The text will be resized based on the width of Expanded.

I have checked your code. You can do the following:
Row(
mainAxisSize: MainAxisSize.min,
children: [
GestureDetector(
onTap: () {
setState(() {
Navigator.of(context).pop();
});
},
child: Icon(
Icons.cancel,
color: Colors.black,
),
),
Expanded(
child: TextField(
maxLines: 4,
decoration: InputDecoration(
border: InputBorder.none,
),
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
GestureDetector(
child: Icon(
Icons.delete_outline_rounded,
color: Colors.black,
),
onTap: () {
print("Transazione Eliminata");
Navigator.of(context).pop();
}),
],
),

How to add vertical spacing to widgets Flutter

I have a piece of code here which makes up the body of the login and register screens. Everything is in the position i want but i would like to space them out a little. The two input fields, title, subtitle, button and textbutton are too close together vertically.
I tried to use mainaxisalignment.spacebetween but i get a constraint error and everything i have on the screen disappears afterwards except the background.
The body used by the register and login screen:
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.transparent,
body: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomLeft,
colors: [Color(0xFF1F1F1F), Color(0xFF1F1F1F)],
),
image: DecorationImage(
image: AssetImage("lib/assets/images/register.png"),
alignment: Alignment.topCenter,
),
),
child: Stack(
children: [
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/bottomleft.png'),
alignment: Alignment.bottomLeft,
),
),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/toptop.png'),
alignment: Alignment.topRight,
),
),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/topbig.png'),
alignment: Alignment.topCenter,
repeat: ImageRepeat.repeat),
),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/top.png'),
alignment: Alignment.topCenter,
repeat: ImageRepeat.repeatX),
),
),
Padding(
padding:
const EdgeInsets.symmetric(horizontal: 25, vertical: 250),
child: ListView(
children: [
if (onBackPressed == null) verticalSpaceLarge,
if (onBackPressed != null) verticalSpaceRegular,
if (onBackPressed != null)
IconButton(
padding: EdgeInsets.zero,
onPressed: onBackPressed,
alignment: Alignment.centerLeft,
icon: Icon(
Icons.arrow_back_ios,
color: Colors.black,
),
),
Center(
child: Text(
title!,
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
),
),
Align(
alignment: Alignment.center,
child: SizedBox(
child: Center(
child: Text(
subtitle!,
style: ktsMediumGreyBodyText,
),
),
),
),
form!,
if (onForgotPassword != null)
Align(
alignment: Alignment.centerRight,
child: GestureDetector(
onTap: onForgotPassword,
child: Center(
child: Text(
'Forgot Password?',
style: ktsMediumGreyBodyText.copyWith(),
),
),
),
),
if (validationMessage != null)
Center(
child: Text(
validationMessage!,
style: TextStyle(
color: Colors.red, fontSize: kBodyTextSize),
),
),
if (validationMessage != null) verticalSpaceRegular,
GestureDetector(
onTap: onMainButtonTapped,
child: Container(
width: double.infinity,
height: 50,
alignment: Alignment.center,
decoration: BoxDecoration(
color: kcPrimaryColor,
borderRadius: BorderRadius.circular(8),
),
child: busy!
? CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation(Colors.white),
)
: Text(
mainButtonTitle!,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 14),
),
),
),
if (onCreateAccountTapped != null)
GestureDetector(
onTap: onCreateAccountTapped,
child: Center(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Don\'t have an account?",
style: TextStyle(color: Colors.white),
),
Text(
"SIGN UP",
style: TextStyle(color: kcPrimaryColor),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"OR SIGN IN WITH",
style: TextStyle(color: kcMediumGreyColor),
),
],
),
],
),
),
),
if (showTermsText!)
Center(
child: Text(
"By signing up you agree to our terms, conditions and privacy policy",
style: ktsMediumGreyBodyText,
textAlign: TextAlign.center,
),
),
],
),
),
],
),
),
);
}
}
the login screen:
Widget build(BuildContext context) {
return ViewModelBuilder<LoginScreenModel>.reactive(
builder: (context, model, child) => Scaffold(
body: AuthenticationLayout(
busy: model.isBusy,
onCreateAccountTapped: () {},
//validationMessage: model.validationMessage,
title: 'SIGN IN',
subtitle: 'please fill the form below',
mainButtonTitle: 'SIGN IN',
form: Column(
children: [
TextField(
decoration: InputDecoration(
hintText: 'Username',
hintStyle: TextStyle(color: Colors.white),
prefixIcon: const Icon(
Icons.person,
color: Colors.white,
),
),
),
TextField(
decoration: InputDecoration(
hintText: 'Password',
hintStyle: TextStyle(color: Colors.white),
prefixIcon: const Icon(
Icons.lock,
color: Colors.white,
),
),
),
],
),
onForgotPassword: () {},
),
),
viewModelBuilder: () => LoginScreenModel(),
);
}
}

Column(
children: <Widget>[
FirstWidget(),
SizedBox(height: 100),
SecondWidget(),
],
),

You should Add SizedBox() in between two Widgets, or Set Padding to your widgets or you use Container also like below:
Using SizedBox()
Column(
children:[
Widget 1(),
SizedBox(height:10),
Widget 2(),
SizedBox(height:10),
Widget 3(),
],
),
Using Padding()
Column(
children:[
Padding(
padding:EdgeInsets.all(8.0)
child: Widget 1(),
),
Padding(
padding:EdgeInsets.all(8.0)
child: Widget 2(),
),
Padding(
padding:EdgeInsets.all(8.0)
child: Widget 3(),
),
],
),
Using Container()
Column(
children:[
Container(
padding:EdgeInsets.all(8.0)
child: Widget 1(),
),
Container(
padding:EdgeInsets.all(8.0)
child: Widget 2(),
),
Container(
padding:EdgeInsets.all(8.0)
child: Widget 3(),
),
],
),
You should use padding on your choice like:
EdgeInsets.all(8.0),
EdgeInsets.only(left:8.0,top:8.0,right:8.0,bottom:8.0),
EdgeInsets.symmetric(vertical: 8.0,horizontal:8.0),

You may add some SizedBox() between or set margin to the components.

Use SizedBox widget to add vertical spacing to your widget.
For e.g
SizedBox(height: 16),

How to achieve this layout with same color scheme in Flutter?

I want to develop the Following design in Flutter, I am using Flutter default colors, the I am facing is that when I use Container having color is black and then want to place some Widgets inside of that container having Lighter color than Black as you can in Following image are not visible how to resolve this?
Here is some Code
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:marshal/Payment.dart';
import 'bottomnavigationbar.dart';
class Payment2 extends StatefulWidget {
#override
_Payment2State createState() => _Payment2State();
}
class _Payment2State extends State<Payment2> {
#override
Widget build(BuildContext context) {
final PaymentButton = Material(
elevation: 5.0,
borderRadius: BorderRadius.circular(30.0),
color: Colors.red,
child: MaterialButton(
minWidth: MediaQuery.of(context).size.width,
padding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
onPressed: () {
Route route = MaterialPageRoute(builder: (context) => Paymentdone());
Navigator.pushReplacement(context, route);
},
child: Text("Payment",
textAlign: TextAlign.center,
style: style.copyWith(
color: Colors.white, fontWeight: FontWeight.w800)),
),
);
return Scaffold(
appBar: AppBar(
title: Text("Payment"),
centerTitle: true,
),
body: Container(
padding: EdgeInsets.all(12),
color: Colors.black,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
"ENTER YOUR CARD DETAILS",
style: TextStyle(
fontWeight: FontWeight.w400,
color: Colors.white,
fontSize: 16),
),
Card(
color: Colors.blueGrey,
child: ListTile(
leading: CircleAvatar(),
title: Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"MasterCard",
style: TextStyle(fontSize: 16, color: Colors.white),
),
Text(
'90 \u0024',
style: TextStyle(fontSize: 16, color: Colors.white),
),
],
),
),
),
),
Card(
color: Colors.blueGrey,
child: emailField(),
),
//
// Row(
// crossAxisAlignment: CrossAxisAlignment.center,
// children: <Widget>[
// Card(
// child: Exp_Date(),
// ),
// Card(
// child: CVV(),
// )
// ],
// ),
TextField(
style: style,
maxLength: 5,
cursorColor: Colors.red,
textAlign: TextAlign.center,
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: 'MM/YY',
hintStyle: TextStyle(fontSize: 16, color: Colors.white),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(
width: 0,
style: BorderStyle.none,
),
),
filled: true,
contentPadding: EdgeInsets.all(16),
),
),
// Exp_Date(),
PaymentButton,
],
),
),
bottomNavigationBar: BottomNavigation(),
);
}
Widget emailField() {
return TextFormField(
//obscureText: true,
style: style,
decoration: InputDecoration(
contentPadding: EdgeInsets.fromLTRB(20.0, 0, 0, 10.0),
//labelText: "Card Number",
hintText: 'xxxx xxxx 1234',
),
);
}
Widget Exp_Date() {
return TextFormField(
obscureText: true,
style: style,
decoration: InputDecoration(
// contentPadding: EdgeInsets.fromLTRB(20.0, 0, 0, 10.0),
// labelText: "Exp Date",
hintText: "MM/YY",
),
);
}
Widget CVV() {
return TextFormField(
obscureText: true,
style: style,
decoration: InputDecoration(
// contentPadding: EdgeInsets.fromLTRB(20.0, 0, 0, 10.0),
//labelText: "CVV",
hintText: "CVV",
),
);
}
TextStyle style =
TextStyle(fontFamily: 'Montserrat', color: Colors.white, fontSize: 16.0);
}
Note
I don't have any issues with BottomNavigationBar

Use Color(0xFF1E1E1E) instead of Colors.blueGrey.

Keep widget below the statusbar

is there a way to make sure that a widget keeps underneath the quick menu on android.
At the moment I do it in a kind of dirty way with a padding parameter, I hope there is a better solution.
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.only(top: 22.0),
color: Color(0xff757575),
child: Container(
padding: EdgeInsets.all(20.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30.0),
topRight: Radius.circular(30.0),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
buildHeader(),
Padding(
padding: const EdgeInsets.only(left: 40.0, right: 40.0),
child: TextField(
// cursorColor: Colors.red,
maxLines: null,
textAlign: TextAlign.left,
autofocus: false,
style: TextStyle(
fontSize: 20.0,
),
decoration: InputDecoration(
hintText: "Add title",
border: InputBorder.none,
),
),
),
Divider(
color: Colors.black,
),
SizedBox(
height: 20.0,
),
TimeAndDateCard(),
EventEntryCard(
label: 'Add Location',
icon: Icon(Icons.place),
onLongPress: () {
showSearch(delegate: LocationSearch(), context: context);
},
),
EventEntryCard(
icon: Icon(Icons.people),
label: 'Invite people ',
),
EventEntryCard(
icon: Icon(Icons.attachment),
label: 'Add attachment',
),
EventEntryCard(
icon: Icon(Icons.work),
label: 'Status',
),
],
),
),
);
}
}
layout without padding
Wished layout. Container is underneath the statusbar

Wrap your Container with SafeArea and it will do the magic for you..
Widget build(BuildContext context) {
return SafeArea(
child: Container(),
);
}
Hope it answers your question..

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Why i gonna null of the String in Flutter? - android

You have defined String newTaskTitle inside the build() method try removing it from inside the build method and try defining it inside the StatefulWidget. This is happening because TextField on change method calls build() method every time the text is changed

Related

How to remove padding from top of ListTile in Drawer?

How to resize TextField() text to fit the max width of an Expanded() widget

How to add vertical spacing to widgets Flutter

How to achieve this layout with same color scheme in Flutter?

Keep widget below the statusbar

Categories

Resources