代码:
TextField( maxLines:null, decoration: InputDecoration( suffixIcon: Icon(Icons.delete), ), )
每次插入新行时,图标都会自动居中。
oyjwcjzk1#
我找到了一个变通办法只需使用TextField的suffix属性,而不是suffixIcon代码:
TextField
suffix
suffixIcon
TextField( maxLines:null, decoration: InputDecoration( suffix: Icon(Icons.delete), ), )
输出:
注意:此解决方案可能会影响TextField的设计,并且当TextField未聚焦或没有数据时,Icon不可见
Icon
ldxq2e6h2#
下面是我在Icon周围使用Padding实现的:
Padding
Container( height: 100, child: TextField( expands: true, maxLines: null, decoration: InputDecoration( suffixIcon: Padding( padding: const EdgeInsets.only(left: 0, top: 0, right: 0, bottom: 100), child: Icon(Icons.add), )), ), )
hof1towb3#
这里我已经做了这样的小部件。你可以试试。它将在TextFormFiled和TextField中工作。
Container( decoration: BoxDecoration( color: Colors.grey.shade200, borderRadius: BorderRadius.circular(10.0), ), child: TextFormField( textAlignVertical: TextAlignVertical.top, // controller: , maxLines: 4, decoration: InputDecoration( border: InputBorder.none, hintText: "Bio", prefixIcon: Align( alignment: Alignment.topCenter, widthFactor: 1.0, heightFactor: 5.0, child: Padding( padding: const EdgeInsets.only(left: 8.0, top:10), child: Icon( Icons.edit_document, color: Colors.grey, ), ), ), ), ), ),
HappyCoding..
3条答案
按热度按时间oyjwcjzk1#
我找到了一个变通办法只需使用
TextField
的suffix
属性,而不是suffixIcon
代码:
输出:
注意:此解决方案可能会影响
TextField
的设计,并且当TextField
未聚焦或没有数据时,Icon
不可见ldxq2e6h2#
下面是我在
Icon
周围使用Padding
实现的:hof1towb3#
这里我已经做了这样的小部件。你可以试试。它将在TextFormFiled和TextField中工作。
HappyCoding..