摹客RP内置三方组件库自从4月上线后，好评如潮。

提供多个国内外大厂高保真UI组件库，拖拽即用，大大提高了大家的原型设计效率！

当然我们也关注到了大家的使用反馈，也在持续的对组件的样式、交互等进行优化，并持续新增大家需要的UI组件库。

在近期的更新中，我们就对组件库进行了一波优化，也上新了多个常用三方组件库。今天我们就来一起详细了解一下什么是UI组件库和它的作用，摹客RP中都内置哪些组件库以及如何使用等！

什么是UI组件库？有什么作用？

简单理解组件库就是一套可重复使用的用户界面（UI）组件集合，涵盖了各种常见的界面元素，如按钮、输入框、菜单、导航菜单等等。 UI组件库中的组件都是经过精心设计，样式统一。许多大型科技公司和互联网巨头都有自己的UI组件库，用于其产品的设计和开发过程，减少重复的人力投入，通过统一、完善的组件生态提升设计开发效率。很多公司也会将他们的UI组件库开源供大家使用！那么UI组件库有什么作用和好处呢？对于产品设计过程来说其作用主要体现在以下两点：

• 提高设计效率：不管是产品经理还是设计师都可以直接使用现成的组件，快速搭建原型或界面，避免从头开始设计每个UI元素。

• 保持界面设计一致性：通过使用UI组件库，可以确保产品各个部分在外观和交互上保持一致。这有助于消除不同设计师之间的设计风格差异，提供统一的用户界面，使得用户在不同页面和功能之间的切换更加自然。

摹客RP有哪些组件库？

除了摹客RP自带的预设组件库外，目前摹客已经提供了8个国内外大厂高保真UI组件库，包括Ant Design，Element UI，TDesign，Arco Design，WeUI，iOS，macOS和Material Design。所有大厂UI组件库资源均可在摹客RP内拖拽即用，十分方便。

• Ant Design：阿里巴巴蚂蚁集团出品的B端组件库，企业级中后台产品的交互语言和视觉风格。

  • 

• Element UI：饿了么出品的桌面端组件库，多数用于后台管理系统的页面设计和开发。

  • 

• TDesign：是腾讯各业务团队在服务业务过程中沉淀的一套企业级设计体系。

  • 

• Arco Design：字节跳动出品一款企业级产品设计系统，主要服务于字节跳动旗下中后台产品的体验设计和技术实现。

  • 

• WeUI：微信官方设计团队专门为微信内网页和微信小程序定制的一款组件库。

  • 

• iOS：苹果公司为iPhone开发的手机操作系统，其组件库涵盖了丰富的 iOS 界面元素。

  • 

• macOS： 苹果笔记本电脑macbook的操作系统，其组件库涵盖了丰富的 macOS 界面元素。

  • 

• Material Design：Google所发布的设计系统，被广泛应用于各种Web、移动和桌面应用程序的开发中。

  • 

如何在摹客RP中使用三方组件库？

第一步：选择组件或组件库

• 方法一：在摹客RP左侧组件面板中找到切换组件库按钮。选择组件库后，根据不同组件分类找到你想使用的组件或者你也可以通过切换组件库按钮旁的搜索按钮，在当前你选中的组件库中搜索组件。

• 
  

• 方法二：左侧组件面板顶部搜索框中可以进行全局搜索。直接输入组件名称即可在全部组件库中搜索对应组件。

第二步：拖拽组件到画板。

将组件拖拽到画板的过程中，支持实时显示组件最终呈现的效果，所见即所得，便于准确的放置组件到对应位置，减少后续二次拖动和调整，十分方便快捷！

第三步：对组件进行编辑。

你可以根据自己的需求对组件进行二次编辑，如替换图标，替换文字等操作。

第四步：为组件设置交互等。

你可以点击右上角的圆点，拖向目标即可快速创建交互。

好了，以上就是本期对于摹客RP三方组件库的全部内容了，快去试试吧!

点击了解更多

Powered by Froala Editor