初尝微信小程序3-移动设备的分辨率与rpx

屏幕尺寸就是实际的物理尺寸。
分辨率(pt),是逻辑分辨率,pt的大小只和屏幕尺寸有关,简单可以理解为长度和视觉单位。
分辨率(px),是物理分辨率,单位是像素点,和屏幕尺寸没有关系。
微信开发者工具上iphone6尺寸是375,指的是逻辑分辨率,设计图常常给出的750px是物理分辨率。1个pt可以有1个px构成,也可以是2个,还可以有3个甚至更多(其实@2x已经是人眼的极限了,再增加也不会改变清晰度)。如果是以iphone6的尺寸开发的话,那么设计图给的物理像素除以2,才是写在代码里的逻辑分辨率。这样很麻烦,针对不同的机型,添加图片需要更改各自的宽高。
所以需要做到不同分辨率设备的自适应。
以iphone6的物理像素750X1334为视觉稿进行设计,而在小程序中使用rpx为单位,1px=1rpx=0.5pt。使用rpx,小程序会自动在不同的分辨率下进行转换,而使用px为单位不会。
rpx在微信小程序中,相当于一个标准,在不同的分辨率机型下,代表不同的实际长度。
所以今后在设计页面布局图的时候,尽量以iphone6,750px屏幕尺寸为标准设计,这样比较方便,不会有太大问题。(如果以iPhone6 plus为标准设计的话,1px = 0.6rpx,换算很麻烦,而iPhone6 1px=1rpx,很方便,1:1)。
PS:不是所有的单位都适合用rpx。
比如一些文字,如果用rpx自适应,那可能在小机型上,字会很小看不清。
初尝微信小程序3-移动设备的分辨率与rpx的更多相关文章
- 初尝微信小程序开发与实践
这可能是一个java程序员最不务正业的一次分享了. 小程序的火热相信不用我多说了,年初的时候老婆去浦东某达面试,甚至都被问有没有小程序测试经验.俨然小程序成为了互联网公司自PC,WAP,安卓,IOS之 ...
- 初尝微信小程序2-基本框架
基本框架: .wxml :页面骨架 .wxss :页面样式 .js :页面逻辑 描述一些行为 .json :页面配置 创建一个小程序之后,app.js,app.json,app.wxss是必须的 ...
- 初尝微信小程序1-特点
微信小程序特点:1.不需要下载安装即可使用 2.用户用完即走,不用关心是否安装太多应用 3.应用将无处不在,随时可用 适合开发的小程序类型:1.简单的用完即走的应用 2.低频的应用 3.性能要求不高的 ...
- 初尝微信小程序2-Swiper组件、导航栏标题配置
swiper 滑块视图容器. 很多网页的首页都会有一个滚动的图片模块,比如天猫超市首页,滚动着很多优惠活动的图片,用来介绍优惠内容,以及供用户点击快速跳转到相应页面. Swiper不仅可以滚动图片,也 ...
- 微信小程序之----获取设备信息
1. 获取系统信息 wx.getSystemInfo(OBJECT) wx.getSystemInfoSync() 同步获取系统信息 回调常用 ...
- 微信小程序初体验与DEMO分享
前言 前一段时间微信公布小程序,瞬间引来了大量的关注.博主的公司也将其定为目标之一,遂派本菜为先头兵(踩坑侠). 这次开发了一个比较完整的DEMO,模仿自某个APP首页,由于保护隐私的目的我把数据拷贝 ...
- 微信小程序开发技巧及填坑记录
以下是自己在开发过程中遇到的坑和小技巧,记录以下: 1.出现了 page[pages/XXX/XXX] not found.May be caused by :1. Forgot to add pag ...
- 微信小程序开发常见问题分析
距离微信小程序内测版发布已经有十几天的时间了,网上对微信小程序的讨论也异常火爆,从发布到现在微信小程序一直占领着各种技术论坛的头条,当然各种平台也对微信小程序有新闻报道,毕竟腾讯在国内影响力还是很大的 ...
- 微信小程序之最简单的Demo设计使用
这个小Demo,代码量不多:导航样式.View.Text.点击.JS交互的使用,主要是理解每个后缀文件的功能,然后才能更好的使用开发.......(下面代码和源代码没差别,实在想要的请留言,谢谢... ...
随机推荐
- 消息中间件的研究(二) RabbitMQ应用场景分析
分析一下六个场景下RabbitMQ的应用: 1.爬虫 2.智能家居云平台 3.电子商务系统 4.实时监控系统 5.海量日志的分布式处理 6. 智能交通管控平台中数据分析子系统 1.爬虫 ...
- POJ1024 Tester Program
题目来源:http://poj.org/problem?id=1024 题目大意: 有一个迷宫,迷宫的起点在(0,0)处.给定一条路径,和该迷宫墙的设置,要求验证该路径是否为唯一的最短路径,该种墙的设 ...
- Mockito测试 注解
import static org.mockito.Mockito.*;import static org.junit.Assert.*; import org.springframework.tes ...
- 关于Spring @RequestBody 自动映射模型原理
关于Spring @RequestBody 自动映射模型 2016年10月18日 22:17:12 稻子丶 阅读数:5049 在很多时候,Spring的注解为我们提供了很多方便,但只知道其用法,不 ...
- 切换本地凭据(Windows上登录的GitHub账号)
切换本地用户,可以向微软小娜搜索Windows凭据,这个步骤可以参考这篇博客 的说明.
- D - 稳住GCD DP
http://acm.uestc.edu.cn/#/problem/show/923 给定一堆数字,求其所有数字的gcd. 现在要删除最多的数字,使得剩下的数字的gcd和原来的一样. 设dp[i][v ...
- Java面向对象_包装类访问修饰符
在java中有一个设计的原则"一切皆对象",java中的基本数据类型就完全不符合这种设计思想,因为八种基本数据类型并不是引用数据类型,所以java中为了解决这样的问题,jdk1.5 ...
- (转)linux磁盘分区fdisk分区和parted分区
linux磁盘分区fdisk分区和parted分区 原文:http://www.cnblogs.com/jiu0821/p/5503660.html ~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- SpringMVC06Exception 异常处理
1.配置web.xml文件 <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3// ...
- Teradata 认证系列 - 1. TCPP这是个啥
一看历史,好几年没发帖...正好最近在自学teradata认证(学也不一定学的完,最后也不一定去考,仅仅安慰一下不想碌碌无为的内心) 网上一搜,百度上的中文相关资料简直为0.这个不奇怪,毕竟都没什么人 ...