[TextField小部件中的文本切割：Flutter

Question

TextField小部件可以用较少的文本很好地工作，但是当我添加长文本时，它会从底部开始剪切。

无文字。

文字较少

问题从长文本开始

我的小部件代码。

Opacity(
      opacity: 0.5600000023841858,
      child: Container(
        padding: EdgeInsets.only(left: 10),
        width: 213,
        height: 36,
        decoration: BoxDecoration(
          color: boxShadowCreamColor,
          borderRadius: BorderRadius.circular(48),
          boxShadow: [BoxShadow(color: boxShadowColor, offset: Offset(0, 0), blurRadius: 8, spreadRadius: 0)],
        ),
        child: TextField(
          keyboardType: TextInputType.text,
          textAlign: TextAlign.left,
          maxLines: 1,
          textAlignVertical: TextAlignVertical.center,
          style: TextStyle(color: Colors.white,fontSize: fontMedium,fontWeight: fontWeightRegular),
          decoration: InputDecoration(
            hintText: "Search",
            border: InputBorder.none,
            hintStyle: TextStyle(color: Colors.white,fontSize: fontMedium,fontWeight: fontWeightRegular),
            suffixIcon: Icon(
              Icons.search,
              color: Colors.white,
            ),
          ),
        ),
      ),
    );

Answer 1

使用isDense中的decoration属性并将其设置为true，这应该可以解决您的问题。

isDense属性有助于减少垂直空间。

decoration: InputDecoration(
            isDense: true,
            hintText: "Search",
            border: InputBorder.none,
            hintStyle: TextStyle(color: Colors.white),
            suffixIcon: Icon(
              Icons.search,
              color: Colors.white,
            ),
          ),

Answer 2

发生这种情况只是因为您已将容器指定给您的身高。只是增加一点，这对您会很好。

尝试height: 42, //-因为文本字段在增长时会缩小文本字段的大小。

或

添加isDense: true // inside InputDecoration