小程序layout设计工具详情介绍

　　微信小程序工具的使用能够让小程序开发更为简单，小程序layout设计工具是什么?怎么使用小程序layout设计工具?一起来看看相关资料。

　　先看下工具截图

　　此工具通过可视化操作进行小程序布局，依据iphone6尺寸设置画布，可以自动生成rpx和百分比的wxss。后续还会增加js代码自动生成。

　　工具中组件按照微信小程序开发规范进行了缺省设置，margin、padding、fontsize、fontfamily、color等属*按照微信视觉一致规范定制而成。

　　软件左侧是常用组件，中间是画布，右侧是wxss属*设置面板。

　　wviewrow组件是小程序view的延伸，自动设置主轴：row。

　　wviewcolumn组件是小程序view的延伸，自动设置主轴：column。

　　wtextinput#组件按照微信规范设置字体大小。

　　wscrollview对应微信的scroll-view组件。

　　wswiper对应微信的swiper组件。

　　布局之后，点击下面的wxml，wxss，wxsspercent(百分比单位)，wxssrpx(rpx单位)标签自动生成代码。

　　基本操作

　　CTL+鼠标滚轴：放大缩小画布

　　CTL+C：复制

　　CTL+V：粘贴

　　CTL+右箭头：组件宽度放大微调

　　CTL+左箭头：组件宽度缩小微调

　　组件对齐：多选组件后，鼠标右键菜单可以进行组件对齐

　　以上就是关于小程序layout设计工具的全部内容了，工具的截图和具体的使用方法和步骤，小编都做了相应的介绍，更多相关资料请关注微信小程序素材网。

　　微信小程序ui设计工具怎么使用?

　　如何使用微信小程序工具条

　　微信小程序码制作工具怎么使用?