关于flutter:Flutter-模式对话框

原文

https://betterprogramming.pub…

代码

https://github.com/macro6461/…

参考

• https://stackoverflow.com/que…
• https://stackoverflow.com/que…
• https://stackoverflow.com/use…

注释

如果你是从我以前的帖子来的，你看到我启动了我的待办事项应用程序，解决了我状态更新时不能用 showModalBottomSheet 办法更新 NewToDo 的问题。

在 Stack Overflow 上问了一个问题之后，我终于能够把我的 NewToDo 小部件放到 showModalBottomSheet 中了。这样，NewToDo 小部件只有在我单击 FloatingActionButton 时才可见，而不是必须始终可见。

然而，在实现这个指标后不久，我留神到我的应用程序中还有一个问题。

当我抉择要编辑的 ToDo 我的项目时，我心愿可能重用我的 NewToDo。我认为这是有意义的，因为它是同样的两个输出，能够用来扭转雷同的两个状态值，title 和 content。

问题是什么？

除了在我的 FloatingActionButton 小部件 (绿色圆圈) 的 onPressed 办法之外，我无奈在任何中央执行 showModalBottomSheet (绿色箭头)。

我须要可能触发 onPressed 办法，每当我点击编辑题目 ElevatedButton 小部件(红色圆圈标记)，每个 ToDo 我的项目。

我思考了如何找到一种办法来模仿 onPressed 事件，以便执行 showmodbottomsheet 回调。

因为无奈模仿 onPressed 事件(and frustrated)，我带着 Stack Overflow 去看看是否有其他人对如何实现我所寻找的指标有任何想法。

过了一会儿，我失去了答案。我松了一口气 … … 也谦卑起来。

如此简略 … 如此纯净

我驳回了 eimmer’s 的倡议，没有把我的 showModalBottomSheet 放在 onPressed 办法中，而是把它分解成了它本人的函数 renderShowModal。参见下文:

_renderShowModal(){
  return showModalBottomSheet<void>(
    context: context,
    builder: (BuildContext context) {
      return ValueListenableBuilder(
        valueListenable: titleController,
        builder: (context, _content, child) {return NewToDo(titleController, contentController, _addTodo, _clear, _todo);
        });
    },
  );
}

这样做之后，我就能够重写我的 onPressed 办法了。

onPressed: _renderShowModal,

当初咱们曾经把咱们的 showModalBottomSheet 放在独自的函数中，让咱们看看它是否工作:

太棒了！咱们当初须要做的就是在 editTodo 函数的开端调用雷同的函数，当你点击编辑 EelevatedButton 时，这个函数就会被调用。

void _editTodo(ToDo todoitem){setState(() {
    _todo = todoitem;
    content = todoitem.content;
    title = todoitem.title;
  });
  contentController.text = todoitem.content;
  titleController.text = todoitem.title;
  _renderShowModal();}

当初让咱们看看当咱们单击 ToDo 我的项目旁边的 edit 时它是否工作。

Viola! 维奥拉

咱们当初能够应用 NewToDo 来创立新的 ToDo 我的项目和编辑现有的 ToDo 我的项目。

通过将 showModalBottomSheet 包装在一个独自的函数中，咱们能够通过调用 renderShowModal，让咱们的应用程序在任何时候都能够出现 NewToDo invoking _renderShowModal。

这个利用的所有代码都在 GitHub 上。

© 猫哥

• https://ducafecat.tech/
• https://github.com/ducafecat
• 微信群 ducafecat
• b 站 https://space.bilibili.com/40…

往期

开源

GetX Quick Start

https://github.com/ducafecat/…

新闻客户端

https://github.com/ducafecat/…

strapi 手册译文

https://getstrapi.cn

微信探讨群 ducafecat

系列汇合

译文

https://ducafecat.tech/catego…

开源我的项目

https://ducafecat.tech/catego…

Dart 编程语言根底

https://space.bilibili.com/40…

Flutter 零根底入门

https://space.bilibili.com/40…

Flutter 实战从零开始 新闻客户端

https://space.bilibili.com/40…

Flutter 组件开发

https://space.bilibili.com/40…

Flutter Bloc

https://space.bilibili.com/40…

Flutter Getx4

https://space.bilibili.com/40…

Docker Yapi

https://space.bilibili.com/40…