How does one customise the TextField layout's height and width in Flutter?
问题:
回答1:
To adjust the width, you could wrap your TextField
with a Container
widget, like so:
new Container(
width: 100.0,
child: new TextField()
)
I'm not really sure what you're after when it comes to the height of the TextField
but you could definitely have a look at the TextStyle
widget, with which you can manipulate the fontSize
and/or height
new Container(
width: 100.0,
child: new TextField(
style: new TextStyle(
fontSize: 40.0,
height: 2.0,
color: Colors.black
)
)
)
Bear in mind that the height
in the TextStyle
is a multiplier of the font size, as per comments on the property itself:
The height of this text span, as a multiple of the font size.
If applied to the root [TextSpan], this value sets the line height, which is the minimum distance between subsequent text baselines, as multiple of the font size.
Last but not least, you might want to have a look at the decoration
property of you TextField
, which gives you a lot of possibilities
EDIT: How to change the inner padding/margin of the TextField
You could play around with the InputDecoration
and the decoration
property of the TextField
. For instance, you could do something like this:
new TextField(
decoration: const InputDecoration(
contentPadding: const EdgeInsets.symmetric(vertical: 40.0),
)
)
回答2:
You can try margin property in the Container. Wrap the textfield inside a container and adjust the margin property.
new Container(
margin: const EdgeInsets.only(right: 10, left: 10),
child: new TextField(
decoration: new InputDecoration(
hintText: 'username',
icon: new Icon(Icons.person)),
)),