Флаттер TextFormField обрезает текст, когда ширина превышает

Question

Я использую TextFormField для моего поля поиска приложения флаттера. Когда я набираю текст, который больше ширины текстового поля, то вводимый текст обрезается до половины, а не полностью виден. Пожалуйста, найдите мой код ниже и прикрепленное изображение для более глубокого понимания проблемы.

TextFormField(
      focusNode: focusNode,
      controller: textController,
      decoration: InputDecoration(
        border: InputBorder.none,
        icon: Icon(
          Icons.search,
        ),
        hintText: AppStrings.searchCatHint,
        hintStyle: TextStyle(
            fontSize: 17,),
      ),
      autovalidate: true,
      autocorrect: false,
      autofocus: true,
    );

Экран для проблемы:

Аналогичная проблема Я видел и в другом вопросе, но решения не было. Аналогичная ссылка на проблему

Текст отображается правильно с предложением @CarlosSR. Но проблема выравнивания, как показано ниже.

Answer 1

Таким образом, вы можете только прокрутить виджет по горизонтальной оси, а также добавить отступ, чтобы получить текст в нужной позиции. В других, я рекомендую вам проверить виджет Align.

SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: TextFormField(
      focusNode: focusNode,
      controller: textController,
      decoration: InputDecoration(
        border: InputBorder.none,
        icon: Icon(
          Icons.search,
        ),
        hintText: AppStrings.searchCatHint,
        hintStyle: TextStyle(
            fontSize: 17,),
      ),
      autovalidate: true,
      autocorrect: false,
      autofocus: true,
    ),
),
),

Answer 2

обтекание текстового поля с контейнером:

ошибка не возникнет:

Container(
            color: Colors.black12,
            width: 280,
            height: 45,
            child: TextFormField(
              decoration: InputDecoration(
                border: InputBorder.none,
                icon: Icon(
                  Icons.search,
                ),
                hintStyle: TextStyle(
                  fontSize: 17,),
              ),
              autovalidate: true,
              autocorrect: false,
              autofocus: true,
            ),
          ),

ошибка с заполнением Я думаю, если вы используете:

Container(
            color: Colors.black12,
            width: 280,
            height: 45,
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextFormField(
                decoration: InputDecoration(
                  border: InputBorder.none,
                  icon: Icon(
                    Icons.search,
                  ),
                  hintStyle: TextStyle(
                    fontSize: 17,),
                ),
                autovalidate: true,
                autocorrect: false,
                autofocus: true,
              ),
            ),
          ),