Widgetbook
Widgetbook 是一个开源工具，用于展示 Flutter 中的小部件。
每一位来自 Web 开发背景的 Flutter 开发者可能都听说过，甚至可能使用过 Storybook.js。它是最受欢迎的 React 包之一，通过允许开发者独立构建组件来加速 UI 开发。开发者可以创建代表组件特定用例的故事。这些故事可以被分类。生成的 Storybook 也可以被非开发者（如设计师或客户）访问，这简化了审查过程。
Widgetbook 的用例
独立构建并进行视觉测试小部件
Widgetbook 提供了一个独立构建 UI 的环境。它允许您在不受屏幕周围环境和依赖项干扰的情况下开发小部件。在 Widgetbook 的 UI 中，您可以在不同的设备和主题上快速地预览和视觉测试您的小部件。它允许您在开发过程中发现 UI 缺陷，而这些缺陷如果在模拟器上测试会非常繁琐。
在此示例中，Widget RecipeInfo 仅针对“短名称”用例正确实现。当用户为该 Widget 指定长名称时，两个设备上都会出现溢出。
在此示例中，AddIngredientScreen 仅针对浅色设计正确实现。使用 Widgetbook 可以快速发现深色设计中的设计缺陷。
保持对所有小部件的概览
随着您的应用程序的增长，越来越多的开发者参与进来，要仍然能够跟踪您应用程序中的所有小部件会变得越来越困难。此时，即使是最好的命名约定也无法阻止开发者质疑，某些小部件是否已经被开发过。通常，这些混乱的结构会导致混乱，并且开发者会重复构建相同的小部件。
通过使用 widgetbook，您可以快速预览所有的小部件和屏幕，以及它们的相关用例。
开发者可以在 Widgetbook 中展示他们所有的小部件和屏幕。
与设计师、产品负责人和客户协作
应用程序开发团队中的审查过程通常是繁琐且效率低下的。当开发人员完成应用程序关键部分的开发后，通常需要由设计师、产品负责人或客户进行审查。为了获得反馈，开发人员通常有三种选择：
- 安排会议，在会议中展示和讨论最新的更改。审查者通常需要一些时间才能有空，而且会议效率通常不高。
- 创建一个包含最新更改的可执行文件，并使其可供非开发者在智能手机上下载。审查者现在必须浏览整个应用程序才能找到已更改的部分。在运行的应用程序中发现边缘情况设计错误几乎不可行。即使发现错误，审查者现在也难以提供精确的反馈。要不就是审查者安排与开发者的会议，导致上述相同的问题，要不就是他们截取错误部分的屏幕截图，并通过消息工具（如 Slack）将它们连同进一步的解释发送给开发人员。当反馈不够精确（这经常发生）时，他们最终需要交换更多的消息或安排会议。
- 截取相关部分的屏幕截图并发送给审查者。但是，屏幕截图通常缺少必要的信息。动画和小的交互，例如与按钮的交互，可以增强用户体验，但无法在屏幕截图中显示和审查。
通过使用我们托管的 Widgetbook 服务，您的审查者可以通过 Web 浏览器轻松访问您的 Widgetbook。这样，他们就可以在不同的设备和主题上快速审查您的所有小部件和屏幕。附加的协作功能可以进一步简化审查过程。有关我们协作平台的更多信息将在文章末尾提供。
与设计师、产品负责人和客户协作
目前，Widgetbook 已经允许开发者对他们的小部件进行分类，并在不同的设备和主题上快速测试它们。如果您想与您的设计团队或客户分享您的 Widgetbook，这只是部分可行。您可以运行 Web 构建并在自己的服务器上托管它，但这仅支持在一个分支上工作。尤其是在大型团队中工作时，多个开发人员会在不同的分支上工作。因此，托管的 Widgetbook 应该以多种版本显示。此外，当前的 Widgetbook 还不具备任何协作功能。
