许多公司使用设计系统来加快设计流程，并确保其工作的整体一致性。使用 Sketch 这类传统 UI 设计工具的设计系统有一个缺点：你的组件库是静态的。一个库组件通常只能展示一种状态。通过与你的团队创建并共享一个交互库（Interaction Library），你可以将设计系统提升到全新的层次。你可能已经知道 ProtoPie 允许你创建完全可交互的组件。通过创建交互库，你可以将动态组件共享给整个团队，供他们在自己的 Pie 中复用。
你需要准备的内容
你需要一个已创建一个或多个组件的 Pie。你可以自己创建，或者为了跟随本指南一起操作，使用这个示例 Pie：
如果你打算将库共享给其他团队成员，你需要订阅 Team 或 Enterprise 计划。订阅 Individual 计划的用户只能创建个人库。
你将学到什么
完成本教程后，你将知道如何进行以下操作：
创建一个新的交互库并将组件发布到其中
与团队共享你的库
使用组件指南（Component Guide）为库组件编写文档
向你的库中添加并发布更多组件
完成时间：≤30 分钟
步骤 1：打开包含组件的 Pie
打开上面的示例 Pie。里面有两个本地组件：Button 组件和 Switch 组件。
这些组件都内置了逻辑以实现交互性。例如，双击 Switch 组件。它内置了各种触发器（Triggers）和响应（Responses），使 Switch 组件既可用又灵活。
步骤 2：创建一个新的交互库
在本地组件下面，你会看到另外三组列表：
团队库（Team Libraries）：这些是你将与团队共享的交互库。仅 Team 和 Enterprise 计划订阅者可用。
个人库（Personal Libraries）：这些交互库仅供你个人使用，其他人无法看到。它们与团队库的工作方式相同，只是你无法将其共享给团队。
公共库（Public Libraries）：这些是 ProtoPie Studio 内置的库。稍后我们会再讲一些。
本教程中我们将使用团队库。点击 Team Libraries 组旁边的 +** **图标以创建一个新的团队库。
现在你可以为库命名并添加描述，也可以选择要与哪些团队成员共享。完成后点击 Create。
会打开一个新标签页，显示你刚创建并处于编辑模式的库。你会知道自己正在编辑库，因为场景顶部会有一条蓝色栏，显示 Library Edit Mode.
步骤 3：添加你的第一个组件。
点击第一个标签页返回示例 Pie 文件。在组件面板中，点击 Switch 主组件。右键并选择 Copy。然后点击你的库标签页并粘贴该组件。
现在 Switch 组件应该已经出现在你的库中，如果你双击它，会注意到所有触发器和响应也一并被复制过来了。
步骤 4：使用组件指南（Component Guide）记录你的组件
当你把一个打算与他人共享的组件添加到库中后，确保他们知道如何使用它非常重要。这一步是完全可选的，如果你的组件很简单，可能有些小题大做。但对于复杂交互来说，Component Guide 是帮助他人快速上手你组件的好方法。
仍在 **Library Edit Mode **界面中，双击 Switch 组件进行编辑。在最右侧你会看到 **Component Guide. **点击其旁边的铅笔图标。
在弹出的窗口中，你现在可以说明组件的工作方式。先写一个总体描述。接下来会列出所有可被覆盖的变量，你可以说明它们的使用方法。
如果你的组件可以接收消息，你可以在** Message In **部分说明每条消息如何工作。
同样地，如果你的组件会发送消息，你可以在 Message Out 部分记录这些内容。
步骤 5：发布你的库
在你发布之前，对库所做的任何更改都不会被其他人看到。或者如果你还没准备好发布，也可以先保存更改，但请注意这些更改会保存到云端，因为交互库本身就存放在那里。
点击舞台上方蓝色栏中的** Publish**按钮。如果你还没有保存更改，需要先保存。
接下来你将有机会为这次新发布的更改添加说明。
填写详细信息，然后点击 Publish。
你应该会在屏幕底部看到确认信息，提示你的更改已成功发布。现在所有团队成员都能看到这些更新了！你现在可以关闭该库的编辑，选择 File → Close.
使用你的新库
现在你已经发布了库，让我们看看如何使用它。新建一个 Pie。如果组件面板还没打开，点击组件图标打开它。
你的新库现在应该会列在 Team Libraries. 下。你在创建库时共享给的所有团队成员都会自动获得访问权限。
点击该库，你将看到其中包含的所有组件。
你可以像使用本地组件一样把它们拖到 Pie 中。将 Switch 组件拖到你的场景里。
还记得组件指南吗？我们可以在这里查看它。看右侧的检查器面板，在 Component 标签旁边有一个看起来像白色方框内有两条线的图标。点击它。
在这里你可以看到你在上面 **Step 4 **中添加的全部文档内容。
向你的库中添加更多组件
要向你的库添加更多组件，你只需按上述相同步骤操作。但首先，你需要知道如何再次打开库进行编辑。点击我们原始 Pie 的标签页，也就是包含 Button 和 Switch 组件本地版本的那个。
让我们把 Button 组件添加到库中。像之前一样，右键点击 Button 组件，然后选择 Copy.
现在展开 Team Libraries 组，显示你创建的新库。当你将鼠标悬停在该库上时，会显示一个省略号图标。点击它，然后选择 Edit Library. 你的库将再次以** Edit Mode.**打开。
像之前一样，粘贴你的组件。如果愿意，也可以编辑 Component Guide。
你也可以从库中删除组件。创建新库时，ProtoPie 会默认在库中添加一个空白的 Component 1。如果你想移除它，右键点击并选择** Delete.**
需要注意的是，你也可以始终直接在库中创建组件。不必从 Pie 文件中复制。点击库名称旁边的** + **图标创建一个新的空组件，双击进行编辑，然后尽情发挥！
最后，发布你的更改。
公共库
ProtoPie 自带一些可直接使用的内置库。它们列在组件面板中的** Public Libraries**组下。你可以像使用团队库一样使用它们。只需将组件从库中直接拖到场景中。
*你会找到 Material Design 库以及 iOS UI kit。*
与自己的组件库一样，你也可以查看组件指南以了解它们如何工作。
就像 Pie 一样简单！
现在你已经准备好构建并与团队共享你自己的交互库了。恭喜！
资源
如何使用条件制作切换按钮：了解 ProtoPie 中条件的工作方式，以创建切换按钮以及更多效果。
使用组件和 Send & Receive 在复选框表单中勾选项目：在本课程中，你将学习如何高效使用复选框组件来勾选和取消勾选原型中的项目。
使用组件制作电视遥控器：本教程将帮助你制作一个可通过键盘（左右方向键）操作的电视遥控器。
使用组件制作下拉菜单以提升工作流效率：ProtoPie 将通过使用 组件 来减少重复任务，帮助你更快地创建下拉菜单。ProtoPie 还使用 send 和 receive 功能在输入之间无缝共享信息。玩得开心！
