如何删除文本字段 flutter 中 suffixIcon 的填充

Question

我有一个 function 来创建一个 textField

  Widget _createNormalTextField(
  String hintTxt,
  TextEditingController controller,
  TextInputType inputType,
  String Function(String) validation,
  Function(String) onTextChanged,
  int length,
  Widget suffixIcon) {
return Container(
  margin: EdgeInsets.symmetric(vertical: 8),
  child: new TextFormField(
      controller: controller,
      maxLength: length,
      keyboardType: inputType,
      validator: validation,
      onChanged: onTextChanged,
      decoration: InputDecoration(
        contentPadding: EdgeInsets.only(bottom: -10.0),
        suffixIcon: suffixIcon,
        hintText: hintTxt,
      )),
);
}

我正在创建几个这样的文本字段：

Column(
    children: <Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Expanded(flex: 2, child: Text("Discount")),
          SizedBox(
            width: 4,
          ),
          Expanded(
            flex: 1,
            child: _createNormalTextField(
                "", _discountPercentController, TextInputType.number, null,
                (txt) {
              setState(() {
                calculateAmount(txt);
              });
            }, 2, Text("%")),
          ),
          SizedBox(
            width: 4,
          ),
          Expanded(
            flex: 2,
            child: _createNormalTextField(
                "Amount",
                _discountAmountController,
                TextInputType.number,
                null,
                (txt) {},
                5,
                null),
          ),
        ],
      ),
    ],
  );

我使用 '%' 文本作为后缀图标。 但它会在中间创建 '%' 并采用我不想要的填充。 我附上了我得到的和我想要的图片：

我有：

我想要右下角的后缀图标，例如::

那么有人知道解决方法吗？

Answer 1

您可以在下面复制粘贴运行完整代码
您可以将suffixIcon与suffixIconConstraints一起使用
代码片段

    decoration: InputDecoration(
            contentPadding: EdgeInsets.only(bottom: -10.0),
            suffixIcon: suffixIcon,
            suffixIconConstraints: BoxConstraints(maxHeight: 14),
            hintText: hintTxt,
          )),

工作演示

完整代码

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  TextEditingController _discountPercentController = TextEditingController();
  TextEditingController _discountAmountController = TextEditingController();

  Widget _createNormalTextField(
      String hintTxt,
      TextEditingController controller,
      TextInputType inputType,
      String Function(String) validation,
      Function(String) onTextChanged,
      int length,
      Widget suffixIcon) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 8),
      child: TextFormField(
          controller: controller,
          maxLength: length,
          keyboardType: inputType,
          validator: validation,
          onChanged: onTextChanged,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.only(bottom: -10.0),
            suffixIcon: suffixIcon,
            suffixIconConstraints: BoxConstraints(maxHeight: 14),
            hintText: hintTxt,
          )),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
            child: Column(
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Expanded(flex: 2, child: Text("Discount")),
                SizedBox(
                  width: 4,
                ),
                Expanded(
                  flex: 1,
                  child: _createNormalTextField("", _discountPercentController,
                      TextInputType.number, null, (txt) {
                    setState(() {
                      //calculateAmount(txt);
                    });
                  }, 2, Text("%")),
                ),
                SizedBox(
                  width: 4,
                ),
                Expanded(
                  flex: 2,
                  child: _createNormalTextField(
                      "Amount",
                      _discountAmountController,
                      TextInputType.number,
                      null,
                      (txt) {},
                      5,
                      null),
                ),
              ],
            ),
          ],
        )));
  }
}