Question

我正在创建一个Flutter应用。我做了这样的设计。

我的TextFormField表格字段用于电子邮件和密码高度很小。我希望它与按钮的大小相同。

final email = TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    initialValue: 'sathyabaman@gmail.com', 
    style: new TextStyle(fontWeight: FontWeight.normal, color: Colors.white),
    decoration: InputDecoration(
      hintText: 'Email', 
      contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(32.0)
      ),
    ),
  );

什么是文本表单字段中高度的语法。

Answer 1

您可以通过更改minLines值来更改高度，只需尝试

               TextFormField(
                           keyboardType: TextInputType.multiline,
                           controller: _opTextController,
                           decoration: InputDecoration(
                               isDense: true,
                             border: OutlineInputBorder(
                               borderSide: BorderSide(color: Colors.black)
                             )

                           ),
                           maxLines: 5,
                           minLines: 3,
                           // controller: cpfcontroller,
                         )

Answer 2

只需调整InputDecoration中的contentPadding。

CodecRegistry codecRegistry = CodecRegistries.fromRegistries(MongoClient.getDefaultCodecRegistry());
final DocumentCodec codec = new DocumentCodec(codecRegistry, new BsonTypeClassMap());
--------
String docJson = document.toJson(codec);

Answer 3

将 expands 上的 TextFormField 属性设置为 true，然后将 TextFormField 放入带有 SizedBox 的 height

SizedBox(
   height: 40.0,
   child: TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    expands: true //Setting this attribute to true does the trick
    initialValue: 'sathyabaman@gmail.com', 
    style: new TextStyle(fontWeight: FontWeight.normal, color: Colors.white),
    decoration: InputDecoration(
      hintText: 'Email', 
      contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(32.0)
      ),
    ),
  ),
)

Answer 4

您可以使用此代码自定义TextFormField

new SizedBox(
  width: 200.0,
  height: 300.0,
  child: const Card(child: const Text('Hello World!')),
)

Answer 5

还有另外一种选择，即添加额外的永久填充来覆盖errorText，这可能会弄乱许多设计师的原始项目。

您可以创建source's TextFormField的修改版本。

要实现这一目标，您可以：

复制并粘贴source's TextFormField中的所有内容。
重命名自定义TextFormField只是为了避免与原始名称命名冲突。
- 您可能还应该重命名内部状态类。
- 在VS Code中，您可以使用 Ctrl + H 将TextFormField替换为TextFormFieldWithErrorTextOption。

向TextFormField的构造函数（在this line下）添加另一个参数，例如errorTextPresent：

// `true` is the current implicit default, i.e., showing the `errorText`
bool errorTextPresent = true

将decoration's initialization更改为内部TextField：

发件人：

decoration: effectiveDecoration.copyWith(field.errorText)

收件人：

decoration: effectiveDecoration.copyWith(
    errorText: errorTextPresent ? field.errorText : null)

然后，您可以像使用任何TextFormField一样使用新的TextFormField：

TextFormFieldWithErrorTextOption(
  errorTextPresent: false, // `false` will disable the `errorText`
  ...
),

Answer 6

只需添加一个容器。根据您的要求调整容器的高度，并将textformfield设为容器的子项。

Answer 7

使用这两行来控制TextFormField内部InputDecoration的高度。

isDense: true, 
contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 0),

完整示例

Material(
                elevation: 4,
                shadowColor: Colors.blue,
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
                child: Padding(
                  padding: const EdgeInsets.only(left: 12),
                  child: TextFormField(
                    controller: searchProvider.searchController,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        hintText: 'hintText',
                        isDense: true, // important line
                        contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 0),// control your hints text size
                        hintStyle: TextStyle(letterSpacing: 2, color: Colors.black54, fontWeight: FontWeight.bold),
                        fillColor:  Colors.white30 ,
                        filled: true,
                        border: OutlineInputBorder(borderRadius: BorderRadius.circular(30), borderSide: BorderSide.none)),
                  ),
                ),
              ),

Answer 8

截图：

代码：

您需要使用 <project> [...] <build> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-enforcer-plugin</artifactId> <version>3.0.0-M3</version> <executions> <execution> <id>enforce-java</id> <goals> <goal>enforce</goal> </goals> <configuration> <rules> <requireJavaVersion> <version>[1.8,9]</version> </requireJavaVersion> </rules> </configuration> </execution> </executions> </plugin> </plugins> </build> [...] </project> 和 SizedBox 属性。

TextField.maxLines

颤振增加TextFormField的高度

8 个答案: