As said in the title; my text "disappears" when I added text too much against the length of the textfield, why does this happens??
Here's the code
Container(
height: mediaSize.height * .075,
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(12.5)),
boxShadow: <BoxShadow>[
BoxShadow(
color: Colors.black54.withOpacity(0.45),
spreadRadius: 1,
blurRadius: 4,
offset: Offset(3.5, 4))
]),
child: TextFormField(
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide:
BorderSide(color: myLightOrangeColor),
borderRadius: BorderRadius.all(
Radius.circular(12.5))),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: myLightOrangeColor, width: 6),
borderRadius: BorderRadius.all(
Radius.circular(12.5))),
labelStyle: TextStyle(color: Colors.black, fontSize: 15, fontWeight: FontWeight.bold),
filled: true,
fillColor: Colors.white),
keyboardType: TextInputType.text,
style: TextStyle(color: Colors.black, fontSize: 15, fontWeight: FontWeight.bold),
),
),
When I add to much of text this happens: [first one ok] [next one ???]
For the text of the TextField to appear normally it needs his normal height, in the image below an image without giving height to the Container:
But if you give it less height than it need to show the text this happen (in the example the height of the device multiplied by 0.075):
To reduce the height of the TextField you can change the property contentPadding
or set the isDense
to true
:
TextFormField(
decoration: InputDecoration(
isDense: true,
//contentPadding: EdgeInsets.all(0), //or any padding you want
),
keyboardType: TextInputType.text,
style: TextStyle(
color: Colors.black,
fontSize: 15,
fontWeight: FontWeight.bold,
),
),