• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

不得不知的小程序基本知识

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
1.小程序的基本架构:
每个小程序的结构都是由两个主要部分构成:主体部分 + 各个页面。
 
1)主体部分主要由3个文件构成
app.js:小程序逻辑,初始化APP;
app.json :小程序配置,比如导航、窗口、页面http请求跳转等;
app.wxss:公共样式配置。
 
2)页面由4个文件构成
js:javascript 逻辑代码区;
wxml:类类似HTML布局区;
wxss:CSS样式区 ;
 json:页面配置区。
 
 
 
配置在最外层的app.json声明,app.json中第一行就是主页面。 
 
 
2、小程序的尺寸单位--rpx
 
1)rpx单位是微信小程序的尺寸单位,可根据屏幕宽度自适应。
设备 rpx换算成px(屏幕宽度/750) px换算rpx(屏幕宽度/750)
iPhone5 1rpx = 0.42px 1px = 2.34rpx
iPhone6 1rpx = 0.5px 1px = 2rpx
iPhone6s 1rpx = 0.552px 1px = 1.81rpx
注:其实只需要根据750的设计稿写代码即可,不必担心它在各个平台的适配情况
 
2)使用rpx
index.wxml 是页面的结构文件:
 
index.wxss 是页面的结构文件:
以下分别是模拟iPhone5、iPhone6得出的调试效果图,可以很明显看出rpx能自适应屏幕宽度。
 
 
 
 
建议:开发微信小程序时设计师可以用iPhone6作为视觉稿的标准。

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap