Flutter 颤振动态最大高度

Flutter 颤振动态最大高度,flutter,flutter-layout,Flutter,Flutter Layout,我构建了一个滚动文本字段,如中建议的。现在,我希望ConstrainedBox的maxHeight根据显示或未显示的键盘动态更改。有没有办法做到这一点 Widget _buildTextInput() { return new Container( padding: new EdgeInsets.all(7.0), child: new ConstrainedBox( constraints: new BoxConstraints( maxHeight: 150.0

我构建了一个滚动文本字段,如中建议的。现在,我希望ConstrainedBox的maxHeight根据显示或未显示的键盘动态更改。有没有办法做到这一点

Widget _buildTextInput() {
 return new Container(
  padding: new EdgeInsets.all(7.0),
  child: new ConstrainedBox(
    constraints: new BoxConstraints(
      maxHeight: 150.0 <-- This should be dynamic
    ),

    child: new SingleChildScrollView(
      scrollDirection: Axis.vertical,
      reverse: true,

      // here's the actual text box
      child: new TextField(
        keyboardType: TextInputType.multiline,
        maxLines: null, //grow automatically
        decoration: new InputDecoration.collapsed(
            hintText: 'Please enter a lot of text',
        ),
      ),
    ),
  ),
 );
}
Widget\u buildTextInput(){
退回新货柜(
填充:新边缘设置。全部(7.0),
子项:新的约束框(
约束:新的BoxConstraints(

maxHeight:150.0Autoscroll自2018年6月初以来就在textfield小部件中得到了本机支持-我认为这是添加了它。您可能需要更新到最新的颤振版本才能工作,但版本5.5中包含了它

这稍微简化了一些事情-这应该是让它按您的意愿工作所需要做的全部:

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text("Example"),
        ),
        body: new Container(
          padding: new EdgeInsets.all(7.0),
          child: new TextField(
            keyboardType: TextInputType.multiline,
            maxLines: null,
            decoration: new InputDecoration.collapsed(
              hintText: 'Please enter a lot of text',
            ),
          ),
        ),
      ),
    );
  }
}
导入“包装:颤振/材料.省道”;
void main()=>runApp(新的MyApp());
类MyApp扩展了StatefulWidget{
@凌驾
State createState()=>新建MyAppState();
}
类MyAppState扩展了状态{
@凌驾
小部件构建(构建上下文){
返回新材料PP(
家:新脚手架(
appBar:新的appBar(
标题:新文本(“示例”),
),
主体:新容器(
填充:新边缘设置。全部(7.0),
孩子:新文本字段(
键盘类型:TextInputType.multiline,
maxLines:null,
装饰:新输入装饰(
hintText:'请输入大量文本',
),
),
),
),
);
}
}
编辑:为了回答OP编辑的问题-希望在与textview相同的滚动窗格中包含其他元素,我做了以下操作:

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text("Example"),
        ),
        body: new SingleChildScrollView(
          child: new Container(
            padding: new EdgeInsets.all(7.0),
            child: new Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                new CircleAvatar(
                  backgroundColor: Colors.blue,
                  child: new Text("AB"),
                ),
                new Expanded(
                  child: new Column(
                    children: [
                      new TextField(
                        keyboardType: TextInputType.multiline,
                        maxLines: null,
                        decoration: new InputDecoration.collapsed(
                          hintText: 'Please enter a lot of text',
                        ),
                      ),
                      new Container(
                        height: 300.0,
                        width: 100.0,
                        color: Colors.green,
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
导入“包装:颤振/材料.省道”;
void main()=>runApp(新的MyApp());
类MyApp扩展了StatefulWidget{
@凌驾
State createState()=>新建MyAppState();
}
类MyAppState扩展了状态{
@凌驾
小部件构建(构建上下文){
返回新材料PP(
家:新脚手架(
appBar:新的appBar(
标题:新文本(“示例”),
),
正文:新的SingleChildScrollView(
子容器:新容器(
填充:新边缘设置。全部(7.0),
孩子:新的一排(
crossAxisAlignment:crossAxisAlignment.start,
儿童:[
新圆星(
背景颜色:Colors.blue,
子:新文本(“AB”),
),
新扩展(
子:新列(
儿童:[
新文本字段(
键盘类型:TextInputType.multiline,
maxLines:null,
装饰:新输入装饰(
hintText:'请输入大量文本',
),
),
新容器(
高度:300.0,
宽度:100.0,
颜色:颜色。绿色,
),
],
),
),
],
),
),
),
),
);
}
}

通过使用SingleChildScrollView,我们仍然允许孩子们设置视口的大小(与必须设置该大小的MultiChildLayoutDelegate等不同)。文本视图按需要增大,但不滚动,因为其高度不受限制。行中需要展开
以确保右侧(包含文本和图片)它在水平方向上尽可能大。

我认为动态化没有问题。你可以很容易地将其放入
StatefulWidget
并更新值,或者你在检测键盘时有问题吗?是的,有点。我不知道如何计算剩余空间。以及如何在打开键盘时检测。:)你可以用一个
扩展的
小部件替换
约束框
,它将占用剩余的空间。这很好,非常感谢。但结果是另一个问题::)当文本字段大于“可能”时,有没有办法将容器放在文本字段生成的同一个“滚动视图”中?因为一旦我将文本字段放入列表视图,它就会停止自动滚动。(展开->列表视图->容器,文本字段)。这有点棘手。啊。我对你的评论有不同的解释。所以发生这种情况的原因是因为ListView本身是可滚动的,所以textview可以简单地扩展到该ListView中所需的大小。而不是textview本身滚动,整个ListView将滚动。我不确定你想要实现什么因此,我不知道这种行为有何不同。也许值得再问一个问题,并解释一下你想要达到的目标(如果可能的话,可以用图片或手绘图表),因为评论并不是真正用来展开讨论的。如果你能从这里将其链接到它,我会看一看=)。或者你可以编辑这个问题并加以澄清,尽管它是有用的。是的,起初我以为这是我想要的答案,但后来我意识到这不是,不幸的是。所以我想我需要实现我的第一个想法(来源帖子),其中我将文本字段放在一个受约束的框中,该框的高度与应用程序栏和键盘(或应用程序栏和底部栏)之间的间距相同?是否有方法计算此值?