input - Flutter输入装饰后缀图标不出现但一直显示十字符号

Question

我有以下示例代码。我现在已经设法放置了 prefixicon 并且它工作正常。我想将相同的图标移动到右侧的后缀含义，但它不起作用，但出现了 X 符号。这是一个屏幕截图。

我添加了以下几行 suffixIcon: IconButton( 但它似乎没有出现，但左侧的前缀看起来非常好。我无法获得右侧的那个。是什么阻止了它从出现？

下面是我的代码。

class MyHomePageState extends State<MyHomePage> {
  // Show some different formats.
  final formats = {
    //InputType.both: DateFormat("EEEE, MMMM d, yyyy 'at' h:mma"),
    //InputType.date: DateFormat('dd/MM/yyyy'),
    //InputType.time: DateFormat("HH:mm"),
    InputType.date: DateFormat("d MMMM  yyyy"),
  };
  //InputType.date: DateFormat('yyyy-MM-dd'),
  // Changeable in demo
  InputType inputType = InputType.date;
  bool editable = true;
  DateTime date;

  @override
  Widget build(BuildContext context) => Scaffold(
      appBar: AppBar(title: Text(appName)),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: ListView(
          children: <Widget>[

            Form(
          //key: _myKey,
          child: Column(
             children : [

              new Container(              
                width: 200.0,
                child:new DateTimePickerFormField(

                            dateOnly: true,
                            format: formats[inputType],
                            editable: false,
                            validator: (val) {
                              if (val != null) {
                                return null;
                              } else {
                                return 'Date Field is Empty';
                              }
                            },
                            /*decoration: InputDecoration(
                              border: InputBorder.none,
                              labelText: 'From',contentPadding: const EdgeInsets.symmetric(horizontal: 20.0)),*/
                          decoration: InputDecoration(
                  hintText: 'To',
                  border: InputBorder.none,
                  filled: false,
                  prefixIcon: Icon(
                    Icons.arrow_drop_down,
                    color: Colors.blue,
                    size: 28.0,
                  ),
                  suffixIcon: IconButton(
                      icon: Icon(Icons.arrow_drop_down,size: 28),
                      onPressed: () {
                        debugPrint('222');
                      })),
                   initialValue: DateTime.now().subtract(new Duration(days: 7)), //Add this in your Code.

                  ),

              )
             ]


          ),
        ),
        RaisedButton(
          onPressed: () {
            /*if (_myKey.currentState.validate()) {
              _myKey.currentState.save();
            } else {
            }*/ print("check;");
            if(emailController.text.isEmpty){
              print("TEST;");
                //valid = false;
                //emailError = "Email can't be blank!";
                //openAlertBox();
                Toast.show("Empty Date From", context, backgroundColor: Colors.red );

            } 
            else{
              print("not empty;");
              final f = new DateFormat('yyyy-MM-dd');
              final original = new DateFormat('d MMMM  yyyy');

              print("Format datre is"+emailController.text);
              print("Formate date :"+original.parse(emailController.text).toString());



            }
          },
          child: Text('Submit'),
        )

          ],
        ),
      ));

Answer 1

我通过仅挑出您提供的 TextFormField 代码重新创建了您的案例，并且能够将 下拉箭头 视为 suffixIcon。

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
        height: MediaQuery
            .of(context)
            .size
            .height,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
            children : [
              new Container(
                color: Colors.yellow,
                width: 200.0,
                  child: TextFormField(
                  decoration: InputDecoration(
                      hintText: 'To',
                      border: InputBorder.none,
                      filled: false,
                      prefixIcon: Icon(
                        Icons.arrow_drop_down,
                        color: Colors.blue,
                        size: 28.0,
                      ),
                      suffixIcon: IconButton(
                          icon: Icon(Icons.arrow_drop_down,size: 28),
                          onPressed: () {
                            debugPrint('222');
                          })),
                ),
              )
        ]
              )
        ),
      )
      );
  }
}

我看到您使用 Padding 作为您的 body 来返回 Scaffold。尝试将其替换为 Center 或 Container