获得设备像素比后，便可得知设备像素与CSS像素之间的比例。也就是window.devicePixelRatio。 一倍图：当这个比率为1:1时，使用1个设备像素显示1个CSS像素。 二倍图：当这个比率为2:1时，使用4个设备像素显示1个CSS像素， 三倍图：当这个比率为3:1时，使用9（3*3）个设备像素显示1个CSS像素。设备像素:也叫物理像素，显示设备上最微小的物理部件。 比如 iphone
转载
2023-08-16 11:37:12
120阅读
一直以来，web移动端都有这么几个问题困扰着我：单位太多，除了px、rem，其他单位到底啥意思？设计师经常会问前端，我到底按照什么尺寸出设计稿？高清图怎么做出来的？边框1px，为什么在不同手机中粗细完全不同？妈蛋，为何移动端总要在meta中width=device-width, initial-scale=1…写这么一句什么是viewport？我相信我的问题也困扰着你，且听我娓娓道来…
在这个不断演进的Android开发环境中，Android2为设计与开发带来了新的挑战，其中“墨刀2倍图和1倍图”的问题尤为突出。为了帮助团队有效应对此类问题，我将详细记录解决过程以及所需的步骤和最佳实践。
### 版本对比
在深入细节之前，我们首先看看Android2与之前版本之间的关键差异。
```mermaid
quadrantChart
title 兼容性分析
x-axi
# 如何实现 iOS 1 倍图的完整流程
在 iOS 开发中，使用标准的图像资源是非常重要的，这有助于确保应用在不同的屏幕分辨率下看起来都很精致。iOS 使用的是 @1x、@2x 和 @3x 这些图像资源的方式，其中 @1x 表示标准分辨率，即 1 倍图。下面，我将详细讲解如何实现 1 倍图的整个流程，并附上示例代码。
## 整体流程
为了实现 iOS 1 倍图的功能，我们可以按照以下步骤进
作者：Tamic来源：开发者技术前线（ID：TamicThinking）做移动开发的都知道，在今年 2月份的世界移动通信大会上，Flutter 团队宣布推出 Flutter 1.2 版本 ，这个版本已支持Web开发，在过去一年中，Flutter 的发展势如破竹，超乎了开发团队的想象。Flutter 严格意义是一种 的UI框架，并且采用 GPU 加速 canvas ，基于Dom 实时更新的
提升app的启动速度最常规的做法一般就是调整app启动时执行的代码，一般将可以后台进行的任务放到后台线程中执行，这样可以一定程度的提升app的启动速度（因项目决定）。那么对于启动速度的提升还有很多方法，下面我来介绍一个通过对iOS项目编译后的二进制数据进行重新排序，来提升app的启动速度的方法。一、分析app启动过程中，二进制数据排列顺序对启动速度的耗时所在。首先一个进程在访问设备内存是，需要经过
转载
2024-09-21 13:06:28
56阅读
# iOS开发3倍图实现教程
在进行iOS开发时，使用高分辨率的图像是非常重要的，尤其是在不同设备上显示时。为了确保我们的图标和图片在各种屏幕分辨率下都能清晰显示，通常会使用不同的图像资源，最常用的方式就是使用3倍图（@3x）图像。本文将指导您如何实现iOS开发中的3倍图，并提供一个清晰的流程。
## 3倍图实现流程
我们可以将整个过程分成几个步骤，如下表所示：
| 步骤 | 描述
原创
2024-10-20 03:38:31
88阅读
3.1 物理像素&物理像素比物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。是厂商在出场时就设置好的。比如苹果6、7、8是750*1334我们
开发时的
1px不是一定等于一个物理像素的PC端页面，
1个px等于
1个物理像素的，但是移动端就不尽相同，举例如下：<body>
<div></div>
</body><style>
转载
2023-12-18 16:53:19
129阅读
html移动端——基础知识1. 开发尺寸iphone6 7 8：1倍图尺寸，宽375像素，高667像素。开发：2倍图尺寸，750×1334。iphonex及以上：目前市场主流 1倍图尺寸，宽375像素，高812像素。开发：2倍图尺寸，750×1624。2. 物理像素和逻辑像素2.1 物理像素设计的尺寸：pc端设计显示的尺寸和开发的尺寸是一样的。2.2 逻辑像素开发的尺寸：，由于屏幕越来越大，分辨率
转载
2023-09-22 15:40:09
686阅读
墨刀是一个原型设计工具，可以快速构建移动应用原型与线框图，支持云端保存和实时手机预览。主要优点是操作比较简洁简单，简单拖拽和设置，即可将想法、创意变成产品原型，简单拖拽就可实现页面跳转，还可通过交互面板实现复杂交互，多种手势和转场效果，可以实现一个媲美真实产品体验的原型，内置丰富的行业素材库，也可创建自己的素材库、共享团队组件库，高频素材直接复用，享受免费版所有功能，可以创建不限数量的项目及页面，
转载
2023-11-13 15:04:52
107阅读
在 Android 开发中，针对不同设备的屏幕密度，使用2倍图（即drawable-mdpi资源）来适配是一项常见的需求。在调试和维护现有项目时，经常会遇到有关“android 2倍图”的问题。本文将总结解决“android 2倍图”问题的过程，包括版本对比、迁移指南、兼容性处理、实战案例、排错指南以及生态扩展等内容。
### 版本对比
自Android 4.0（Ice Cream Sandw
贴出一些参考的文章： 1.iPhone屏幕尺寸、分辨率及适配一.切图常说的”@1X @2X @3X”苹果IOS程序开发不同分辨率的设备统一为一个尺寸而标记的。@3X就是@1X分辨率的3倍。例如，iPad2 是768 x 1024，iPad Retina 是1536 x 2048，开发时都按 768 * 1024 操作。但实际上两者有一倍差异。为了达到最佳效果，使用的图片大小不一样。这时候就用同一
转载
2024-07-14 11:02:53
76阅读
# iOS加载倍图指南
在iOS开发中，倍图（又称为高分辨率图像）是一种非常重要的资产，尤其在不同的设备上具有不同的屏幕密度时。采用倍图可以确保图像在高分辨率设备上仍然保持清晰。比如，iPhone屏幕的分辨率可能是标准图像的一倍、一倍五倍、甚至是两倍和三倍。因此，了解如何有效加载倍图是非常重要的。
在本篇文章中，我会引导你逐步实现iOS应用中的倍图加载，以下是整体流程的表格总结：
| 步骤
目录一、移动端基础1. 浏览器现状2. PC端常见浏览器3. 移动端常见浏览器二、手机屏幕三、视口1. 布局视口 layout viewport2.视觉视口3. 理想视口 ideal viewport4. meta视口标签5.标准的viewport设置四、二倍图1.物理像素&物理像素比2. 多倍图3. 背景缩放 background-size五、移动端开发选择1 移动端主流方案2. 单独移
一、UIImage的size，scale属性先想一个问题“一个图像的尺寸到底是多大呢？”第一反应可能就是image.size，恭喜你答错了，正确的答案是图像的实际的尺寸(像 素)等于image.size乘以image.scale。如果做过界面贴图的话你可能经常会需要准备至少两套图，一套1倍图，一套图已@2x命名的二倍 图。这样当我们的程序运行在retina屏幕的时候系统就会自动的去加载@2x的图片
转载
2024-08-16 17:31:49
52阅读
1.移动web浏览与调试 F12打开手机调试工具—>点击手机图标—>切换到移动调试模式—>选择移动设备型号或调剂移动设备宽度2.视口 viewport 浏览器显示页面内容的屏幕区域 视口分为布局视口、视觉视口和理想视口 布局视口 layout viewport ios、andriod基本上都将这个视口分辨率设为980px\ 视觉视口 visual viewport 用户正在看到网
转载
2023-09-06 23:50:46
209阅读
iOS4.0加入了scale factor，这表示point长度/pixel长度。
在分辨率为960*640的设备上，我们知道
逻辑
坐标系还是不变480*320，那么一个point有两个pixel长，所以scale=2.0。
在分辨率为480*320的设备商，point和pixel长度相同，scale=1.0。
为了程序自动适应分辨率，程序会自动给UIScreen.scale赋值，[U
转载
2023-12-13 02:01:25
79阅读
Sketch与PS的区别由于Sketch是矢量绘图工具，与PS位图处理软件不同的地方在于：Sketch图像生成采用矢量图，在调整形状的时候可以进行缩放而不会损失质量。Sketch中iPhone8默认画板是一倍图尺寸375*667，PS中iPhone8默认为二倍图尺寸750*1334。 PX与PT的关系px是像素，属于相对单位，而pt是点，是iOS开发过程中使用的单位，属于
转载
2023-07-14 23:09:29
883阅读
sketch 切图踩过的坑前不久因为 sketch 切图问题害得开发找了半天的 bug, 原来是掉到切图坑里了，于是总结出了一下相关注意事项。一、确定设计尺寸sketch 的切图首先要明确你是在用什么尺寸进行设计，这个关系到导出图片的倍数。如果设计尺寸是 375x667pt，那么导出的资源尺寸倍数，1倍，2倍，3倍。(推荐使用这个尺寸)。如果设计尺寸是 750x1334px，那么导出的资源尺寸倍数
一、视口1.常见屏幕知识设备解释描述宽屏幕的宽度 - （单位：英寸）屏幕的宽度高屏幕的高度 -（单位：英寸）屏幕的高度对角线屏幕的对角线的长度 英寸一般说手机尺寸 是指以屏幕对角线为衡量 单位是 英寸逻辑分辨率屏幕的宽度 * 屏幕的高度 （单位：px）描述屏幕的宽度和高度设备分辨率物理像素点屏幕里面一共拥有的物理像素点的个数PPI像素密度每英寸所拥有的物理像素点设备像素比设备分辨率和逻辑分辨率的比
转载
2023-11-08 13:11:27
0阅读
