颤振输入装饰后缀未显示图标,但始终显示十字符号

时间:2019-03-06 14:58:05

标签: input flutter

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

我在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'),
        )

          ],
        ),
      ));

2 个答案:

答案 0 :(得分:2)

您可能已经发现以下内容,但发布以防万一...

显示的“ X”是日期字段的重置图标,即。您用它来清除字段。您可以使用DateTimePickerFormField属性'resetIcon:null;'将其关闭。但是从字段中删除日期的唯一方法是确保“ editable:true”,这是默认设置,但是您已在代码中覆盖了该日期。 希望有帮助。

答案 1 :(得分:1)

我仅通过选择您提供的TextFormField代码来重新创建您的案例,并能够将dropdown arrow视为suffixIcon

enter image description here

@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。尝试将其替换为CenterContainer