Flutter 定制时间简化组件 time_planner

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sge0Hdn1-1628218026745)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-28-32.png)]

老铁记得 转发 ，猫哥会呈现更多 Flutter 好文~~~~

微信群 ducafecat

b 站 https://space.bilibili.com/404904528

原文

https://medium.com/flutterdevs/explore-customizable-time-planner-in-flutter-c8108218b52c

参考

• https://pub.dev/packages/time_planner

正文

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KGg3GuId-1628218026747)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-05-41.png)]

从一开始，Flutter 就是一次伟大的邂逅。建造迷人的用户界面从来没有这么快。不管你是一个业余爱好者还是一个有教养的开发者，要无可救药地迷恋上 Flutter 并不难。所有的软件开发人员都明白，日期是最棘手的事情。同样，时间表也不是特例。

在移动应用程序中，有很多情况下用户需要输入出生日期、预订机票、安排会议等等。

在这个文章，我们将探索定制的时间规划 Flutter。我们还将实现一个演示程序，并创建一个可定制的时间计划使用时间规划器包在您的 Flutter 应用程序。

https://pub.dev/packages/time_planner

Introduction

一个愉快的，简单的利用，定制的时间规划为 Flutter 移动，桌面和网络。这是一个按时间表向客户显示任务的小部件。每行显示一个小时，每列显示一天，但是您可以更改该部分的标题并显示您需要的任何其他内容。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-siPXgGFa-1628218026748)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-08-07.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YBAtAPYj-1628218026749)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-07-08.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CG4bINfO-1628218026749)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-07-33.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6dtwtHCT-1628218026750)(https://ducafecat.tech/2021/08/06/translation/explore-customizable-time-planner-in-flutter/2021-08-06-06-08-23.png)]

这个演示视频显示了如何创建一个可定制的时间计划在 Flutter。它展示了如何定制的时间计划将工作，使用您的 Flutter 应用程序的时间计划包。它显示当用户点击任何行和列时，将创建一个随机的时间计划器。动画的。它会显示在你的设备上。

属性

时间计划器有以下几个属性:

• startHour: 这属性是用来时间从这个开始，它将从 1 开始
• endHour: 这属性用于此时间结束，最大值为 24
• headers: 这属性用于创建天数，每天是一个 TimePlannerTitle。你应该至少创造一天</