设计大师微信小程序 第1篇
index的json文件中引入组件
index的swan文件中使用组件
detail同上
效果如下，index和detail页面都引入header组件，并根据页面不同显示不同内容。
index页面：
detail页面：
设计大师微信小程序 第2篇
Axure RP 可以说是一个实力强劲的交互原型设计工具了，走微信小程序 UI 设计工具赛道也没什么难度。他的交互效果及原型设计功能是一大特色，可以添加触发交互事件，还具有非常强大的逻辑功能，可以帮助我们轻松的就设计出复杂的交互流程，真实模拟页面交互效果，为微信小程序 UI 设计的最终呈现效果锦上添花，是一个很值得大家去尝试一下的宝藏微信小程序 UI 设计工具。
这是一款开源的图形化微信小程序 UI 设计工具，是一个小程序支持组件化开发的框架，他可以通过预编译的手段帮助开发者快速设计出符合自己需求的微信小程序 UI 设计页面，并支持将用户设计好的页面直接导出为小程序代码，方便快捷。他支持多种编译器，还支持多种插件处理，帮助设计师及开发人员更快的进行微信小程序 UI 设计作品的创作。
除了微信小程序 UI 设计工具，一个好用的微信小程序 UI 设计组件库也是我们要走小程序设计这条赛道所不可缺少的，而 WeUI 则是由微信官方设计的小程序 UI 设计组件库，是同微信小程序的产品构建逻辑、使用感受、视觉体验等都一致的基础样式组件库。如果有需要，可以直接在即时设计的资源社区里搜索 WeUI，就会有 220w + 人都用过的We库，我们可以直接套用，很方便。
以上就是关于 4 个超优质的微信小程序 UI 设计工具的全部内容介绍了，他们分别是：即时设计、Axure RP、WePY、WeUI，今天分享的这 4 个都是超优质的微信小程序 UI 设计工具，帮助大家勇闯微信小程序 UI 设计赛道不是问题，大家在搜寻微信小程序 UI 设计工具时，可以把几个工具都试试看，反正不要钱，试他一遍又何妨，说不定试着试着就找到最适合自己的那个微信小程序 UI 设计工具了。希望今天的内容能对大家在搜寻合适的微信小程序 UI 设计工具时有所助益。
设计大师微信小程序 第3篇
index的json文件中引入组件
index的swan文件中使用组件
detail同上
效果如下，index和detail页面都引入nav组件，并根据页面显示当前所在的tab。
index页面：
detail页面：
设计大师微信小程序 第4篇
页面上使用selector组件：(如果要单个选择器)
index的swan文件中使用组件（bind绑定的方法要和组件内('方法名',{要传递的数据}); 的方法名一致）
效果如下，index页面引入selector组件。
默认效果
选中内容效果
附上选中图：选中传递给外部的数据：(data)
附上取消图：选中传递给外部的数据：(data) （注：取消时会有cancel时段，可以通过判断组件传递过来的数据是否有cancel字段，如果没有，保存数据，如果有，则从保存数据的地方对应删除掉）
页面上使用selector组件：(如果要多个选择器)
index的swan文件中使用组件（bind绑定的方法要和组件内('方法名', {要传递的数据}); 的方法名一致）
效果如下，index页面引入selector组件。
默认效果