【下载】小程序layout设计工具

  • • 发表于 8年前
  • • 作者 Roluce
  • • 3182 人浏览
  • • 1 条评论
  • • 最后编辑时间 8年前
  • • 来自 [开发工具]

原创声明:本文为作者原创,未经允许不得转载,经授权转载需注明作者和出处

下载地址

http://pan.baidu.com/s/1kV59IS3

百度云分享有时间限制,下载不了了,QQ我(635068)

视频介绍
http://player.youku.com/player.php/sid/XMTgyNTQ4NDcyMA==/v.swf

此工具通过可视化操作进行布局,依据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+左箭头:组件宽度缩小微调
组件对齐:多选组件后,鼠标右键菜单可以进行组件对齐

分享到:
1条评论
Ctrl+Enter
作者

Roluce

Roluce

APP:0 帖子:50 回复:112 积分:3610

已加入社区[2933]天

山东_聊城_qq:635068

作者详情》
Top