如何在SingleChildScrollView中添加或启用位置指示器

时间:2018-01-14 00:23:20

标签: dart flutter

我的多行TextField需要一个滚动位置指示器,它包含在SingleChildScrollView中。

enter image description here

文本字段中的文本多于可见文本,我不明显隐藏了一些文本,隐藏了哪些文本(顶部或底部)

这是Whatsup。 TextField显示滚动条。我想做同样的事情。 enter image description here

3 个答案:

答案 0 :(得分:0)

只需将TextField小部件包装在ScrollBar小部件中。

示例:

new Container(
  height: 100.0,
  child: new Scrollbar(
    child: new TextField(
      maxLines: null,
    )
  ),
)

有关ScrollBar小部件的详细信息,请查看文档here

希望有所帮助!

答案 1 :(得分:0)

感谢上面的回答:SingleChildScrollView给了我想要的行为,我正在寻找与LayoutBuilder和约束相结合:新的BoxConstraints:

    Widget _renderTextField() => new LayoutBuilder(
      builder: (context, constraints) => new Column(children: <Widget>[
            new Container(
                    child: new Container(
                    margin: const EdgeInsets.only(
                      right: 5.0,
                    ),
                    child: new Container(
                        constraints: new BoxConstraints(maxHeight: 200.0,
                        maxWidth: constraints.maxWidth),
                        child: new Scrollbar(child: new SingleChildScrollView(
                                scrollDirection: Axis.vertical,
                                reverse: true,
                                child: new TextField(...

答案 2 :(得分:0)

我创建了一个对话框,其中包含一个窗体和一个宽度和高度分别为 450 和 500 的子容器。我使用布局构建器创建了一个最大高度为 200 的文本框窗体,并带有滚动条和单子滚动视图。该行被扩展以占据小部件的所有宽度。我有两个包含动作的材质按钮。

 String _myvalue;
 final _myTextController = TextEditingController();
 final _formKey = GlobalKey<FormState>();
 final _scrollController = ScrollController();

  Widget build(BuildContext context) {
       return Dialog(
          child: Form(
             key: _formKey,
             autovalidateMode: AutovalidateMode.disabled,
             child: Container(
                 width: 450,
                 height: 500,
                child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  Align(
                    alignment: Alignment.center,
                    child: Text(
                      "Some Text",
                      style: Head2Style,
                    ),
                  ),
                  Divider(height: 50),
                  LayoutBuilder(
                      builder: (context, constraints) => Container(
                          constraints: new BoxConstraints(
                              maxHeight: 200.0,
                              maxWidth: constraints.maxWidth),
                          child: Scrollbar(
                              isAlwaysShown: true,
                              controller: _scrollController,
                              child: SingleChildScrollView(
                                  controller: _scrollController,
                                  child: SizedBox(
                                      width: 400,
                                      child: TextFormField(
                                          decoration: InputDecoration(
                                              icon: Icon(Icons.note),
                                              hintText: "My Text"),
                                          autocorrect: true,
                                          controller: _myTextController,
                                          keyboardType:
                                              TextInputType.multiline,
                                          maxLines: null,
                                          maxLength: 1000,
                                          onChanged: (String value) {
                                            setState(() {
                                              _myvalue = value;
                                            });
                                          })))))),
                  Expanded(
                      child: Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.end,
                    children: [
                      ElevatedButton(
                        onPressed: () {
                          if (_formKey.currentState.validate()) {
                            _do_something(context);
                          }
                        },
                        child: Text("Do something"),
                      ),
                      ElevatedButton(
                        onPressed: () {
                          Navigator.of(context).pop();
                        },
                        child: Text("Cancel"),
                      )
                    ],
                  )),
      ])//column
      )//container
   )//form
   )//dialog;
}