从零开始学习微信小程序

由于毕设方面的需要,打算开始学习微信小程序,这里记录平常的知识点学习~

微信中的快捷键使用

快捷键 说明
ctrl+b或ctrl+s 运行代码
ctrl+f 查找
f1 打开快捷键列表

关于调试方面

  • 快捷键
快捷键 说明
f10 单步调试
f8 调至下一断点

一些知识点

在小程序开发中,常使用的是iphone6下的开发状态,在iphone6下,1px = 2rpx

移动设备的分辨率与rpx

设备 屏幕尺寸 分辨率(pt) Reader 分辨率(px) 渲染后 PPI(DPI)
iphone 3GS 3.5寸 320x480 @1x 320x480 163
iphone 4/4S 3.5寸 320x480 @2x 640x960 326
iphone 5/5S/5C 4.0寸 320x568 @2x 640x1136 326
iphone 6/6S 4.7寸 375x667 @2x 750x1334 326
iphone 6/6S Plus 5.5寸 414x736 @3x 1242x2208 1080x1920 401

其中:

  • PPI=通过分辨率中的勾股定理得出的边/屏幕尺寸而来;
  • pt为逻辑分辨率,pt的大小和屏幕尺寸有关系(可以简单理解为长度和视觉单位);
  • px为物理分辨率(像素点,点无大小),和屏幕尺寸没有关系;
  • 1个pt可以由1个px或2个甚至3个构成;
  • 只有在iphone6下2个px才构成一个pt;

如何做不同分辨率设备的自适应?

  • 视觉稿通常是以ip6的物理像素750x1334设计的,而在小程序中使用rpx为单位
  • 在ip6下:1px=1rpx=0.5pt
  • 使用rpx,小程序会自动在不同的分辨率下进行转换,而使用px则不会

一些小问题的解决

出现以下报错:
未正确调用Page()问题
解决方法:
在welcome.js页面中加入如下代码:

Page({

})

以上内容会随着学习继续补充~

猜你喜欢

转载自blog.csdn.net/tozeroblog/article/details/84404850
今日推荐