400-650-7353
您所在的位置:首页 > IT干货资料 > ui设计 > 【UI设计基础知识】移动端适配原理有哪些需要注意的

【UI设计基础知识】移动端适配原理有哪些需要注意的

  • 发布: ui培训
  • 来源:UI干货资料
  • 2020-04-06 22:15:42
  • 阅读()
  • 分享
  • 手机端入口

首先我们先要了解什么是PX,这个大家还算比较熟悉,像素,是构成图像的基本单位,一个图像,上面的像素点越多,你的眼睛看到的图像就越清晰。一个图像长度上有1200个像素,宽度上有900个像素,那这个图像就是由高900PX,宽1200PX组成的图像。那就引出分辨率的问题,分辨率的概念是什么?分辨率就是一个图像的屏幕竞速,这个图像是由多少个像素组成的。那高900PX,宽1200PX组成的图像的分辨率就是900×1200像素。

我们现在讨论适配的问题,是移动端的适配,移动端的典型例子就是手机,那最近新出的iOS手机就是iPhone11,安卓手机的尺寸比较多。那iPhone11的手机屏幕分辨率是什么呢,官网显示iPhone11的手机屏幕分辨率是1792×828像素。也就是这个手机的屏幕是高度上有1792个像素,宽度上有828像素。

下面的内容要注意啦,一定要理解。

官网显示iPhone11的手机屏幕分辨率是1792×828像素。官网也显示iPhone 11 显示屏采用曲线优美的圆角设计,四个圆角位于一个标准矩形内。按照标准矩形测量时,屏幕的对角线长度是 6.06 英寸 (实际可视区域较小)。

英寸是什么,是物理计量单位,像素是什么,像素跟屏幕的清晰度有关系。

那一个换算可以把两者联系起来,那6.06英寸是对角线的长度,那对角线上有多少个像素,大家能算出来吗?

【UI设计基础知识】移动端适配原理(上)

大家还记得我们上学的时候学过的勾股定理,X²Y²=Z²,我们知道iPhone11手机的宽高的像素的,那我们就可以算出来对角线的像素值。

1792²+828²=3211264+685584=3896848

²√3896848=1974.043565881969

这个数值就是对角线上的像素点数了,那一共有6.06英寸,每个英寸上有多少个像素呢?

1974.043565881969÷6.06=325.7497633468596

按照四舍五入取整数,这个数值等于326。

苹果官网的显示是iPhone11是326PPI,那PPI是什么。

PPI是像素密度,以每英寸的像素数值评判每英寸的像素密度是多少。

那iPhone11每英寸的像素是326,就是iPhone11的屏幕密度是326.

今天先把这些概念给大家讲清楚,后面我们再把326PPI跟@1X、@2X、@3X联系起来。

 

文章“【UI设计基础知识】移动端适配原理有哪些需要注意的”已帮助

>>本文地址:https://www.ujiuye.com/zhuanye/2020/48581.html

THE END  

声明:本站稿件版权均属中公教育优就业所有,未经许可不得擅自转载。

1 您的年龄

2 您的学历

3 您更想做哪个方向的工作?

获取测试结果
  • 大前端大前端
  • 大数据大数据
  • 互联网营销互联网营销
  • JavaJava
  • Linux云计算Linux
  • Python+人工智能Python
  • 嵌入式物联网嵌入式
  • 全域电商运营全域电商运营
  • 软件测试软件测试
  • 室内设计室内设计
  • 平面设计平面设计
  • 电商设计电商设计
  • 网页设计网页设计
  • 全链路UI/UE设计UI设计
  • VR/AR游戏开发VR/AR
  • 网络安全网络安全
  • 新媒体与短视频运营新媒体
  • 直播带货直播带货
  • 智能机器人软件开发智能机器人
 

快速通道fast track

近期开班时间TIME