首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在flutter中展开textField看起来像一个文本区域

如何在flutter中展开textField看起来像一个文本区域
EN

Stack Overflow用户
提问于 2019-03-04 03:41:22
回答 5查看 54.4K关注 0票数 46

当我在landScape模式下点击textField时,我想要像whatsapp一样全屏展开

Example gif Whats

代码语言:javascript
复制
            TextFormField(
              keyboardType: TextInputType.number,
              decoration: InputDecoration(
                  prefixIcon: Padding(
                    padding: EdgeInsets.all(0.0),
                    child: Icon(Icons.person,
                        size: 40.0, color: Colors.white),
                  ),
                  hintText: "Input your opinion",
                  hintStyle: TextStyle(color: Colors.white30),
                  border: OutlineInputBorder(
                      borderRadius:
                      BorderRadius.all(new Radius.circular(25.0))),
                  labelStyle: TextStyle(color: Colors.white)),
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Colors.white,
                fontSize: 25.0,
              ),
              controller: host,
              validator: (value) {
                if (value.isEmpty) {
                  return "Empty value";
                }
              },
            )
EN

回答 5

Stack Overflow用户

发布于 2019-03-04 09:09:42

您需要做的就是在创建TextField时设置maxLines变量。我在一个Card小部件中添加了文本字段,这样您就可以看到总面积了。

代码语言:javascript
复制
@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Simple Material App"),
      ),
      body: Column(
        children: <Widget>[
          Card(
            color: Colors.grey,
            child: Padding(
              padding: EdgeInsets.all(8.0),
              child: TextField(
                maxLines: 8,
                decoration: InputDecoration.collapsed(hintText: "Enter your text here"),
              ),
            )
          )
        ],
      )
    );
  }

票数 58
EN

Stack Overflow用户

发布于 2020-12-28 17:33:40

要获得文本区域的精确外观,可以使用以下命令

代码语言:javascript
复制
TextFormField(
   minLines: 6, // any number you need (It works as the rows for the textarea)
   keyboardType: TextInputType.multiline,
   maxLines: null,
)

这是输出(需要一些额外的样式)

享受..。

票数 16
EN

Stack Overflow用户

发布于 2020-04-21 07:42:50

不幸的是,在flutter中,您无法设置TextField或TextFormField的最小高度。为TextField或TextFormField指定固定大小的最佳方法是指定字段在不进一步扩展的情况下应该占用的最大行数。注意:这并不限制输入文本的数量,它只限制显示的行数。

示例:

代码语言:javascript
复制
                             TextFormField(
                                keyboardType: TextInputType.multiline,
                                maxLines: 8,
                                maxLength: 1000,

                              ),

这会将字段的大小限制为8行,但最多可包含1000个字符。希望这能帮助到一些人。

票数 14
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54972928

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档