- 屏幕尺寸:5.0(inch英寸)
- 分辨率:1080*1920px
- dpi = √{(1080^2+1920^2)}/ 5.0=440dpi
屏幕单位名词
一、屏幕尺寸:屏幕对角线长度(单位英寸)
- 屏幕对角线长度
二、屏幕像素/物理像素:屏幕宽高的像素(单位px)
- 2K 屏幕代表宽度为1440px左右的屏幕
- 1.5K 屏幕宽度为1220px左右
三、像素密度PPI:是每英寸像素(单指屏幕在宽度或者高度上的像素点密度)
- 屏幕宽度1920px,物理宽度19.2英寸 屏幕PPI=1920/19.2=100PPI
四、 屏幕像素密度:单位尺寸中包含的像素点指整个屏幕像素点和对角线尺寸的比值(单位dpi)
计算公式:像素密度=屏幕总像素/尺寸 =√{(长度像素数^2+宽度像素数^2)}/ 屏幕尺寸
屏幕尺寸:5.5 宽高:1080*1920
√(1080^2 + 1920^2) / 5.5 ≈ 401 ppigenha
五、Flutter逻辑像素实际计算和dp差不多可以直接用
- 概念:设备像素也被称为物理像素。逻辑像素也被称为与设备无关或与分辨率无关的像素
- devicePixelRatio(设备像素缩放比):实际像素与逻辑像素的比例
- 计算:物理像素px = 逻辑像素 * devicePixelRatio
- devicePixelRatio跟实际设别有关如需严格按照设计稿需要使用三方适配方案flutter_screenUtil
//获取屏幕大小 (逻辑像素分辨率)
Size scrSize = MediaQuery.of(context).size;
double screenWidth = scrSize.width;
double screenHeight = scrSize.width;
//获取 devicePixelRatio 与android dp和px倍数计算差不多
double devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
//逻辑像素
double canvasWidth = screenWidth*devicePixelRatio;
double canvasHeight = screenHeight*devicePixelRatio;
//屏幕适配方案
## [flutter_screenUtil](https://pub.flutter-io.cn/packages/flutter_screenutil)
六、鸿蒙 VP 虚拟像素(实际也与dp计算公式一样)
- 计算公式:VP=(px*160)/dpi==>1VP=(dpi/160)px
求100px dpi=320 的vp值
(100px*160)/320=44VP
- 官方适配管理方案 AttrHelper
五、 px、dp、sp、pt、inch 概念
-
px 顾名思义 分辨率
-
sp android中的字体尺寸,计算方式与dp类似
Android系统支持用户设定字体大小,因而sp的实际大小还会根据用户设定在原基础上进行缩放。
-
dp 是安卓的开发单位,也是一个固定长度的单位
//ldpi:mdpi : hdpi : xhdpi : xxhdpi = 0.75 : 1 : 1.5 : 2 : 3 计算:1dp=(屏幕像素密度DPI/160)px -
pt 是iOS系统的开发单位,而且是长度固定的,不随屏幕像素密度ppi变化而变化。
计算:1pt=1/72英寸
-
inch 英寸,1 英寸约等于2.54厘米,主要用来描述手机屏幕的大小。
一般说的屏幕多少尺寸是指的对角线长度
在 Android 开发
| 屏幕密度 | mdpi | hdpi | xhdpi | xxhpdi | xxxhdpi |
|---|---|---|---|---|---|
| 代表设计像素 | 320 × 480 px | 480 × 800 px | 720 × 1280 px | 1080 × 1920 px | 1440 × 2256 px |
| 标志尺寸 | 3.6 | 3.88 | 4.5 | 4.58 | 4.5 |
| dpi | 160 | 240 | 320 | 480 | 640 |
| 基准dpi | 160 | 160 | 160 | 160 | 160 |
| 倍率 | @1x | @1.5x | @2x | @3x | @4x |