如何在TextField flutter中放置多个后缀图标?

时间:2020-08-22 09:17:22

标签: flutter

我一直在努力获取此设置,但是我不能仅仅按照我想要的方式来表现图标。 [1]:https://i.stack.imgur.com/mJFds.png

我想使添加按钮与TextField对齐,但是我无法将其与任何其他小部件一起包装。 我只能说的就是这个。 [2]:https://i.stack.imgur.com/m2Ze9.png 有人可以帮我解决这个问题的方法。

谢谢。

   import 'package:flutter/material.dart';
   import 'package:provider/provider.dart';
   import 'package:badminton_app/constants.dart';
   import 'package:badminton_app/model/players_data.dart';

TextEditingController _controller = TextEditingController();

class AddPlayersScreen extends StatefulWidget {
 @override
 _AddPlayersScreenState createState() => _AddPlayersScreenState();
}

class _AddPlayersScreenState extends State<AddPlayersScreen> {
 String newText;
 @override
 Widget build(BuildContext context) {
   return Scaffold(
     backgroundColor: Color(0xff07021A),
     body: SafeArea(
       child: Padding(
         padding: const EdgeInsets.all(25.0),
         child: Column(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
             SizedBox(
               height: 30.0,
             ),
             Text(
               'Add Players',
               style: TextStyle(
                   color: Colors.white,
                   fontSize: 40.0,
                   fontFamily: 'Montserrat'),
             ),
             SizedBox(
               width: 400.0,
               height: 50.0,
               child: Divider(
                 height: 10.0,
                 color: Color(0xff525274),
               ),
             ),
             Container(
               constraints: BoxConstraints.tight(Size(400.0, 70.0)),
               child: TextField(
                 cursorColor: Color(0xffA8A3BE),
                 style: TextStyle(color: Color(0xffA8A3BE), fontSize: 20.0),
                 controller: _controller,
                 onChanged: (newValue) {
                   newText = newValue;
                 },
                 enabled: true,
                 decoration: InputDecoration(
                   suffix: IconButton(
                     onPressed: () {
                       _controller.clear();
                     },
                     icon: Icon(
                       Icons.clear,
                       color: Colors.white,
                     ),
                   ),
                   suffixIcon: IconButton(
                     onPressed: () {
                       Provider.of<PlayerData>(context).changeString(newText);
                     },
                     icon: CircleAvatar(
                         backgroundColor: Colors.amberAccent,
                         child: Icon(
                           Icons.add,
                           color: Colors.black,
                         )),
                   ),
                   hintText: "New member......",
                   hintStyle: TextStyle(
                     fontSize: 20.0,
                     color: Color(
                       0xffA199C6,
                     ),
                   ),
                   filled: true,
                   fillColor: Color(0xff585179),
                   enabledBorder: OutlineInputBorder(
                       borderRadius: BorderRadius.all(Radius.circular(10.0)),
                       borderSide: BorderSide.none),
                   focusedBorder: OutlineInputBorder(
                       borderRadius: BorderRadius.all(
                         Radius.circular(10.0),
                       ),
                       borderSide: BorderSide.none),
                 ),
               ),
             )
             //Something(),
           ],
         ),
       ),
     ),
   );
 }
}

1 个答案:

答案 0 :(得分:0)

_cellEdit() => Container(
    decoration: BoxDecoration(
      borderRadius: BorderRadius.circular(8),
      color: Colors.white,
    ),
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        Container(
          child: Text('断开'),
          padding: EdgeInsets.all(BaseSize.dp(10)),
        ),
        Row(
          children: <Widget>[
            ImageIcon(IconUtils.getAssetIcon('ic_bluetooth'),
                color: ColorRes.COLOR_03B798),
            Container(
                margin: EdgeInsets.only(left: BaseSize.dp(3)),
                child: Text('A8-123456789'))
          ],
          mainAxisAlignment: MainAxisAlignment.start,
        ),
      ],
    ),
  );

您可以参考此文件重新布局您的布局