Flutter 踩坑指南

1.Row嵌套TextFild崩溃

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    TextField(
      decoration: InputDecoration.collapsed(
        hintText: "输入标题",
        hintStyle: TextStyle(
          color: AppColors.c_black,
          fontSize: 16,
        ),

      ),
      onChanged: (value){
        titleValue = value;
      },
    ),
    Text(
      "0/25",
      style: TextStyle(
        color: AppColors.c_FFC1C1C1,
        fontSize: 14,
      ),
    )
  ],
)

上面代码出现如下崩溃

The following assertion was thrown during performLayout():
An InputDecorator, which is typically created by a TextField, cannot have an unbounded width.
This happens when the parent widget does not provide a finite width constraint. For example, if the InputDecorator is contained by a Row, then its width must be constrained. An Expanded widget or a SizedBox can be used to constrain the width of the InputDecorator or the TextField that contains it.
'package:flutter/src/material/input_decorator.dart':
Failed assertion: line 959 pos 7: 'layoutConstraints.maxWidth < double.infinity'

• 解决方式： 将TextField放进Expanded中即可。

2.TextField去掉下划线

TextField样式自带下划线背景，在decoration中设置border: InputBorder.none即可去掉。

TextField(
          decoration: InputDecoration(
            border: InputBorder.none,
          ),
        )

3.TextField设置maxLength后去掉右侧默认字数统计

Flutter中TextField设置maxLength后系统会默认多显示一个字数统计控件，此时只需要把counterText设置为空即可隐藏显示

counterText: "",