在微信小程序开发的过程中,自己不借助UI组件库开发出来的页面,不但要花费更多的时间,页面的美观度上也有一定差距。

所以在这里我给大家推荐几个好看,常用的几个UI组件库。

WeUI

WeUI 是微信官方出品的组件库,它沿用了微信的视觉设计与交互设计,提供了各类原生组件的基础样式,风格简约大方。选用这一套组件库,可以让你的小程序与微信本身保持一致的界面风格。

官方组件库能够满足基础的界面需求,但是,如果你想要更加饱满的视觉,更加活泼的动效,恐怕 WeUI 就满足不了你的需要了。

GitHub 地址:https://github.com/Tencent/weui

ColorUI 组件库

ColorUI 是由文晓港发布的高颜值组件库,侧重于视觉交互。比起 WeUI 的低调克制,ColorUI 色彩鲜亮,样式繁多。除了拥有非常丰富的原生组件的自定义样式,它还提供一些常见的页面元素,比如时间轴、步骤条、聊天页、模态窗口等等。

ColorUI 给大家提供了高度自定义的组件,一些比较麻烦的样式,开发者只需调用其组件就能得以实现。不过,ColorUI 也不是万能的,比如,它尚未涉及购物类小程序所需的组件。

GitHub 地址:https://github.com/weilanwl/ColorUI

Vant 组件库演示

Vant 是由有赞发布的,轻量的小程序 UI 组件库。如果你想制作一款电商、餐饮、外卖平台、票务预订等购物类小程序,选用 Vant 是较为合适的。为什么这么说呢?

首先,我们来看「业务组件」这一块。可以看到,「商品卡片」与「提交订单栏」两个组件可以构成一个基本的「购物车」页面;而「商品卡片」与「商品导航」二者又可以组成一个简单的商店页面。

对开发者非常友好,文档可以说是事无巨细了,而且在文档右侧,还可以预览样式哦。

开发文档:https://youzan.github.io/vant-weapp/#/intro
GitHub 地址:https://github.com/youzan/vant-weapp

iViewUI

iViewUI 是由 TalkingData 发布的组件库。作为一款好用的组件库,布局、面板、列表、表单、顶部导航栏、底部导航栏等组件当然必不可少,那么 iViewUI 除了具备这些标配的组件,还有哪些亮点呢?

iViewUI 同样有详细的文档,但是不支持网页预览,只能打开小程序预览。

开发文档:https://weapp.iviewui.com/docs/guide/start
GitHub 地址:https://github.com/TalkingData/iview-weapp

推荐微信小程序常用的几个UI组件库相关推荐

  1. api 微信小程序组件库colorui_微信小程序常用的几个UI组件库

    1.WeUI WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一.包含button.cell.dialog. progre ...

  2. 微信小程序的经验总结,UI组件、图表、自定义bar你学会了吗

    目录 写在前面 1 如何使用自定义tabbar及权限控制 拷贝官方demo中的custom-tab-bar文件到根目录 入口文件app.json启用自定义tabbar 回到自定义custom-tab- ...

  3. 微信小程序-常用API开发技巧学习笔记

    常用API开发技巧学习笔记 第一章 认识微信小程序 前后端分离的开发方式 小程序的特点 小程序对开发者的影响 学习小程序需要的基础 第二章 小程序环境搭建与开发工具介绍 小程序开发环境 没有小程序号对 ...

  4. 微信小程序常用api总结

    内容待写... ≧◔◡◔≦ 滑到底啦~ // 1.0 小程序接收传递过来的参数onLoad: function (options) {var str= options.str; //接收到的参数 st ...

  5. vc++6.0获取磁盘基本信息_微信小程序——常用功能2:微信小程序用户登录,申请用户授权并获取用户基本信息...

    微信小程序--常用功能2:申请用户授权并获取用户基本信息 为了更好的用户体验,很多时候我们想要获取用户的基本信息,从而实现将信息呈现到用户界面.给用户划分地域.给用户分类等功能. 但是要想获取用户信息 ...

  6. 微信小程序常用视图容器组件

    微信小程序常用视图容器组件 1.组件概述 2.常用的试图容器组件 2.1 view 2.1.1 案例 2.2 scroll-view 2.2.1 案例 2.3 swiper 2.3.1 案例 1.组件 ...

  7. 微信小程序-常用api

    文章目录 微信小程序-常用api 路由 wx.switchTab(Object object) wx.navigateTo(Object object) wx.navigateBack(Object ...

  8. 【小程序】微信小程序常用api的使用,附案例(建议收藏)

    1- 前言 这是微信小程序常用的几个API,特地总结一下: 学会使用 微信官方文档 · 小程序 2- 界面 2.1 wx.setNavigationBarTitle() 标题栏文本 wx.setNav ...

  9. 【小程序开发必备】微信小程序常用API全介绍,附示例代码和使用场景

    文章目录 1.网络请求相关API 1.1 wx.request 1.2 wx.uploadFile 1.3 wx.downloadFile 1.4 wx.connectSocket 2.页面跳转相关A ...

最新文章

  1. 编程之美2.15 二维数组最大子数组的和(数组下标从(1,1)开始)
  2. 路易斯安那州立大学计算机科学,西北路易斯安那州立大学
  3. 尼奥机器人不能手机绑定_微信绑定的手机号,如果手机号停用,是不是微信也不能用了?...
  4. 证书的应用之一 —— TCPSSL通信实例及协议分析(上)
  5. Java设计模式-外观模式(Facade)
  6. 8086cpu学习笔记(4):指令系统
  7. PS-如何用ps软件看psd文件中的字体大小
  8. azw3转换为pdf_PDF怎么转换为PPT?PDF秒转PPT秘技!
  9. Froala编辑器使用经历
  10. 台式电脑主板插线步骤图_图解电脑主机电源线接法图解
  11. SQL Server 负载均衡集群方案之Moebius
  12. 一北大毕业生的返乡报告:家乡面目全非 备感无力
  13. 硕士毕业,两年北漂算法工程打工生活【上】
  14. 对过去五年工作经历的总结
  15. 第一章 编程基础_ASCII 编码和GBK编码
  16. aero peek_如何在Windows中禁用Aero Peek
  17. ESP8266断网后自动重新连接Wi-Fi网络
  18. “电子商务促进乡村振兴十佳县域案例”火热征集中
  19. html实现开心消消乐小游戏
  20. WiFi(Wireless Fidelity)基础(八)

热门文章

  1. C语言学习day01
  2. The Chubby lock service for loosely-coupled distributed systems 论文阅读笔记
  3. linux查看gcc/cmake/当前版本
  4. 相片打印机原理_喷墨打印机工作原理 喷墨打印机优缺点介绍【详解】
  5. Digilent Analog Discovery Studio视频教程:DAQWare for Digilent AD 1.0.3新功能
  6. 轻松打造开源安全信息管理平台
  7. 微信小程序 JS中遍历后台获取的data数据并赋值
  8. 《信息安全技术关键信息基础设施安全保护要求》获批准通过
  9. 树莓派GPIO入门(一):点亮一个LED灯
  10. 磁盘分析软件(C盘爆满精确清理必备)---SpaceSniffer