微信小程序入门
微信小程序开发资源汇总:https://github.com/justjavac/awesome-wechat-weapp
PS:这可是个宝藏链接!!!!敲重点!!!
小程序的文件结构
一个小程序首先有四个应用入口文件:
- app.js:设置一些项目的全局变量
- app.json:每一个新页面都必须在这个地方注册,项目的导航栏和窗口界面设置有关的
- app.wxss:项目全局样式
- project.config.json:项目配置文件
一个页面主要是包含以下四个文件,这四个文件的名字应该都是一样的,最好以页面所在的文件夹名字为标准:
xxx.wxml:页面的结构
xxx.wxss:页面的样式
xxx.json:页面的配置文件
xxx.js:页面的脚本文件
页面可以嵌套页面,但是建议不要超过5个层级。
移动设备的分辨率与RPX
pt:视觉单位(长度单位),与设备的屏幕物理尺寸有关系,也叫做逻辑分辨率(逻辑单位),与移动端的栅格渲染有关
px:通常说的像素点,物理分辨率,随着屏幕的变化不会变化;一般设计师给的设计稿是以物理分辨率为单位的,也就是说,iPhone6下的分辨率是375,但是设计图却是750;因为rpx:px == 2:1,小程序的设计稿就要以iPhone6为参照。
pt与px之间的关系:1个pt下面包含多个px;也就是说一个逻辑分辨率包含多个物理像素点。
ppI(DPI):计算的是屏幕显示1个逻辑分辨率包含多个物理像素点,值越大,显示的图像越细腻,清晰。计算的方法是:320*320+480*480的和开根号再处于屏幕尺寸最后乘以reader值。
reader值:视网膜屏,表示一个逻辑像素点包含多个(reader值)物理像素点,一般reader值为2就达到了眼睛的所能观察到细腻的极限,再大几乎不怎么起作用,对于眼睛感觉到的色彩来说。
也就是说,当需要的元素大小适应屏幕尺寸,就选择rpx作为单位,否者使用px作为单位。