在 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

在decoration中使用isDense屬性並將其設置為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

它的發生只是因為你給了你的 Container 的高度。 只是增加它對你來說會很好。

try height: 42, // -- 因為 textfield 在其增長時會縮小 Textfield 的大小。

或者

添加isDense: true // inside InputDecoration