Как создать нестандартную высоту TextFormField во флаттере?

Question

У меня есть форма, в которой есть два TextFormField и одна нижняя кнопка для проверки, но проблема в том, что экран выглядит неуклюже. Я хочу, чтобы ** TextFormField ** нижние две части полностью перекрывали область между ними, даже если нет содержимого, и становились прокручиваемыми, как только они достигают дна. введите описание изображения здесь

левый - это то, что у меня есть, но мне нужен правый, я пытался обернуть его Expandable или Container , но этого не произошло работают, потому что я использовал свойство границы.

Answer 1

Этого можно добиться, заключив виджет TexFormField в виджет Expanded и установив для свойства expands и maxLines свойства TextFormField значение true и null соответственно.

TextFormField with занимает все доступное пространство независимо от размера экрана, проверьте приведенный ниже код для примера:

  // wrap it with an Expanded widget
         Expanded(
           child: TextFormField(
             // set the keyboard type to multiline f
             keyboardType: TextInputType.multiline,
             // set maxlines to null
             maxLines: null,
             // set expands to true
             expands: true,
             decoration: InputDecoration(
                 isDense: true,
                 border: OutlineInputBorder(
                     borderSide: BorderSide(color: Colors.black)
                 )
             ),
           ),
         ),

Answer 2

Вам просто нужно увеличить maxLines внутри TextFormField, чтобы увеличить его размер, например:

Container(
  height: MediaQuery.of(context).size.height*0.5,//set the size according to your choice
  decoration: BoxDecoration(
    //Customize your container
    color: Colors.red,
    borderRadius: BorderRadius.all(Radius.circular(10.0)),
  ),
  child: TextFormField(
    maxLines: 30,//add any number of lines
    //Customize your text field
  )
),