微信小程序ui框架有哪些

微信小程序开发，是目前火爆的开发方式，也是适应中小企业快速解决的一个方案。选择一个合适自己的开发UI框架，能够让自己开发速度提升数倍。

推荐两个小程序UI框架：

WeUI

WeUI是由微信官方设计团队分别支持微信H5网页和微信原生小程序的开源UI组件

ColorUI

ColorUI是开源且支持原生小程序的UI组件，由于我目前在帮朋友改一个原生的微信小程序，所以就选择了这款开源组件。

想要在小程序里实现分页查询，只需配置滚动分页查询图片即可。

效果展示：

通过打开分页开关，同时配置触发器行为是滚动到底部的触发器。实现上滑滚动到底部时，继续加载分页内容。

创建数据表

注意：在数据中心你可以创建属于自己应用程序的数据表格，数据表格类型分为用户表，商品表、订单表和自定义表。

点击数据中心

创建数据表并初始化数据

创建事件

注意：事件是构建数据与界面元素组件链接的抽象逻辑。数据表与界面元素组件通过事件连接。

点击事件中心

创建查询事件

触发器配置

注意：在检查器面板中的触发器设置面板创建触发器，可以对组件进行交互逻辑设置，或配合事件来进行动态数据 *** 作。

选中流式布局组件

点击检查面板的触发器

创建触发器

创建滚到到底部的触发器

绑定数据

注意：绑定数据可以将事件返回的数据和组件显示内容进行绑定。

选中List Item

点击检查面板的数据绑定与设置

绑定数据

这样就可以在小程序里实现分页查询了。

小程序的 UI 设计指南在小程序官方文档中均有介绍，以微信官方设计文档为参照：

1、 小程序布局：小程序的布局主要采用块状结构进行布局，优先采用卡片、列表或网格等布局方式；

2、 小程序 UI 调色：小程序的 UI 调色使用典型的灰色调子，较亮的颜色基调使用明度较浅的颜色；

3、小程序 UI 尺寸：采用 1080px 宽，720px 高的界面设计尺寸，控件尺寸以 8px 为基准单位，即每个控件的间距需以 8px 设计；

4、 小程序 UI 字号：字体最大尺寸 36px，最小尺寸 24px，中等字体尺寸使用 30px。

---