Flutter 在点击时生成文本字段

Posted

技术标签:

【中文标题】Flutter 在点击时生成文本字段【英文标题】:Flutter generating textfield on tap 【发布时间】:2021-02-07 02:38:30 【问题描述】:

目前我正在尝试在我的项目中构建 facebook 风格的评论系统。我接近它,但我不知道如何解决这个问题。我正在尝试在回复按钮下方生成一个文本字段,就像它在 facebook 中所做的那样。我真的需要帮助。谢谢!

代码如下:

    class _MedPreCState extends State<MedPreC> 
  @override
  Widget build(BuildContext context) 
    return SafeArea(
      child: Scaffold(
          body: Padding(
        padding: const EdgeInsets.only(left: 20, right: 20, top: 20),
        child: Column(
          children: [
            Row(
              children: [
                CircleAvatar(
                  maxRadius: 12,
                  backgroundColor: Colors.indigo,
                  child: Icon(Icons.person),
                ),
                Padding(
                  padding: EdgeInsets.only(
                    left: 10.0,
                    right: 10.0,
                  ),
                  child: Container(
                    height: 30,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.grey[400]),
                    child: Center(child: Text('This is a random comment.')),
                  ),
                )
              ],
            ),
            SizedBox(
              height: 10,
            ),
            Padding(
              padding: const EdgeInsets.only(left: 40),
              child: Row(
                children: [
                  Text('2h', style: TextStyle(fontWeight: FontWeight.w600)),
                  SizedBox(
                    width: MediaQuery.of(context).size.width * 0.1,
                  ),
                  Text('Like', style: TextStyle(fontWeight: FontWeight.w600)),
                  SizedBox(
                    width: MediaQuery.of(context).size.width * 0.1,
                  ),
                  InkWell(
                    onTap: () ,
                    child: Text(
                      'Reply',
                      style: TextStyle(fontWeight: FontWeight.w600),
                    ),
                  ),
                ],
              ),
            )
          ],
        ),
      )),
    );
  

这是我的输出。

【问题讨论】:

【参考方案1】:

您可以使用 list 将您的容器保存在 :https://flutter.dev/docs/cookbook/lists/long-lists

【讨论】:

这如何帮助我在点击回复时创建文本字段?我有点困惑 每次用户输入新评论时,将此评论添加到您的列表中,您可以使用列表构建器构建您的小部件 我可以获取有关代码 sn-p 的帮助吗?我真的不知道如何实现它。如果你能告诉我怎么做就太好了。感谢您的快速回复顺便说一句。 :D

以上是关于Flutter 在点击时生成文本字段的主要内容,如果未能解决你的问题,请参考以下文章

Flutter 焦点管理 FocusScope 组件

输入文本时自动扩展的 Flutter 文本字段,然后在达到特定高度时开始滚动文本

Flutter 中的自动填充文本字段

如何制作像生物编辑器一样的 Tinder - Flutter

Flutter BLoC 库中带有验证的文本字段

Flutter:创建新行后文本字段光标不会下降