一年半的时间，我们亲眼见证了小程序从萌芽成长为参天大树，支撑起我们现今的生活方式，让我们在他的树荫下享受着舒适。很多公司自然不会错过这次机会，纷纷加入到小程序的行列。这对设计和开发而言算是一次挑战，毕竟要快速上线的步伐没有留给我们太多时间，而市面上的相关资料都太零碎，在实际中会遇到很多的坑，官方文档也没有说明。所以我拉着我们开发小哥哥 Yog，帮大家规避小程序设计中的那些坑。一、设计稿最好用二倍图
一、视口1.常见屏幕知识设备解释描述宽屏幕的宽度 - （单位：英寸）屏幕的宽度高屏幕的高度 -（单位：英寸）屏幕的高度对角线屏幕的对角线的长度 英寸一般说手机尺寸 是指以屏幕对角线为衡量 单位是 英寸逻辑分辨率屏幕的宽度 * 屏幕的高度 （单位：px）描述屏幕的宽度和高度设备分辨率物理像素点屏幕里面一共拥有的物理像素点的个数PPI像素密度每英寸所拥有的物理像素点设备像素比设备分辨率和逻辑分辨率的比
转载
2023-11-08 13:11:27
0阅读
文章目录一. 移动前端基础二. 流式布局（百分比布局）三. flex布局四. rem适配布局五. less扩展语言六. rem适配方案七. vw和vh 一. 移动前端基础1.1 meta视口标签<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, minimum-sca
相信很多人跟我一样一直在纠结到底用一倍图做ui设计还是二倍图？国外的设计师喜欢用一倍，国内的设计师比较多用二倍，实际上两种选择都有自己的好处，今天就打算给大家抛砖引玉一下。375x667px ：一倍图(@1x)；750x1334px：二倍图(@2x);1.PS和Sketch的差别PS是光栅图像( Raster Image )(光栅图也叫做位图、点阵图、像素图 )。所以Photoshop十分依赖DP
一、UIImage的size，scale属性先想一个问题“一个图像的尺寸到底是多大呢？”第一反应可能就是image.size，恭喜你答错了，正确的答案是图像的实际的尺寸(像 素)等于image.size乘以image.scale。如果做过界面贴图的话你可能经常会需要准备至少两套图，一套1倍图，一套图已@2x命名的二倍 图。这样当我们的程序运行在retina屏幕的时候系统就会自动的去加载@2x的图片
一、图片格式@2x与@3xAPP有时会提供不同大小的图片，1倍图和2倍图和3倍图，它们的像素与1倍数图相比相差2倍或者3倍。2倍图在1倍图的名字后加 @2x普通：sample.png 2倍：sample@2x.png 3倍：sample@3x.png “sample”寻找图片的时候，会自动根据设备屏幕取对应的图片 由于retina屏幕的普及，现在工程中用得最多的是@
# 安卓开发：如何实现 Android 二倍图
在安卓开发中，处理图像是一个常见的任务，特别是在为不同屏幕密度提供高质量的图形时。二倍图（@2x 图像）是一种常用的资源管理方式。在这篇文章中，我们将深入探讨如何在 Android 应用程序中实现二倍图，以确保在高分辨率屏幕上呈现良好的视觉效果。
## 流程概述
在实现二倍图的过程中，您需要按照以下步骤进行操作。下面是一个流程表，以便您更清晰地
二倍图的概念二倍图就是设计人员在设计ui图的时候是参照手机的二倍来设计的二倍图的作用：防止图片失真####移动端调试的两种方法模拟调试：用电脑的浏览器模拟手机端真机调试
手机和电脑必须在同一个网络下将页面以live server的形式打开打开运行cmd输入ipconfig查找到无线局域网的wlan ipv4地址将ip地址复制之后将浏览器中的127.0.0.1替换掉将地址用二维码生成器生成二维
答： 比如你需要一个30pt*30pt的图标，那么这时你就需要跟美工要3个文件：一个是30px*30px的PNG文件，用原名来命名即可，例如：sample.png 一个是60px*60px的PNG文件，这个是要用原名@2x来命名，例如：sample@2x.png 一个是90px*90px的PNG图片，这个是要用@3x来命名，例如sample@3x.png这个把这三张图片导入进工...
转载
2022-05-27 08:39:24
217阅读
DPR:物理像素/设备独立像素 这个比值就是DPR 如：iphone6 物理像素是750 设备独立像素是375 那么：750/375 = 2 iphone6的DPR是2二倍图：现在，有一张100px x 100px的图片，在DPR = 1.0的设备中，可以完美的显示。在iphone3G中，此图片背后的发光点有100 x 100个 当我们把它（100px x 100px的图片）放在DPR = 2.0
1.移动web浏览与调试 F12打开手机调试工具—>点击手机图标—>切换到移动调试模式—>选择移动设备型号或调剂移动设备宽度2.视口 viewport 浏览器显示页面内容的屏幕区域 视口分为布局视口、视觉视口和理想视口 布局视口 layout viewport ios、andriod基本上都将这个视口分辨率设为980px\ 视觉视口 visual viewport 用户正在看到网
转载
2023-09-06 23:50:46
146阅读
二倍图的概念二倍图就是设计人员在设计ui图的时候是参照手机的二倍来设计的二倍图的作用：防止图片失真####移动端调试的两种方法模拟调试：用电脑的浏览器模拟手机端真机调试
手机和电脑必须在同一个网络下将页面以live server的形式打开打开运行cmd输入ipconfig查找到无线局域网的wlan ipv4地址将ip地址复制之后将浏览器中的127.0.0.1替换掉将地址用二维码生成器生成二维
3.1 物理像素&物理像素比物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。是厂商在出场时就设置好的。比如苹果6、7、8是750*1334我们开发时的1px不是
一定等于
一个物理像素的PC端页面，1个px等于1个物理像素的，但是移动端就不尽相同，举例如下：<body>
<div></div>
</body><style>
作者：ChokCoco本文是内部的一次分享沉淀，偏向基础但是涉及了一些有意思的细节，文笔有限，才疏学浅，文中若有不正之处，万望告知。不知道小伙们是否还得小编之前也整理了2篇关于移动端各种机型适配问题详细解答，咱们一起来回顾回顾(有兴趣的小伙伴建议看看)：《大厂是怎么做移动端适配的》《手把手教你绕过移动端适配大坑》前端的一大工作内容就是去兼容页面在不同内核的浏览器，不同的设备，不同的分辨
Sketch与PS的区别由于Sketch是矢量绘图工具，与PS位图处理软件不同的地方在于：Sketch图像生成采用矢量图，在调整形状的时候可以进行缩放而不会损失质量。Sketch中iPhone8默认画板是一倍图尺寸375*667，PS中iPhone8默认为二倍图尺寸750*1334。 PX与PT的关系px是像素，属于相对单位，而pt是点，是iOS开发过程中使用的单位，属于
转载
2023-07-14 23:09:29
762阅读
为什么要切图？了解iphone界面和Android图标的尺寸在实际设计过程中，为了降低设计成本，一般选择分辨率最高的设备作为设计稿的原始尺寸，因为1倍图放大成为2倍图远比2倍图缩小成1倍图来的模糊！Android开源自由的代价就是设备规范的不可控，市面上充斥着各种品牌的android手机，有着各种各样的尺寸和分辨率，为了适配各种不同分辨率的设备，同一个图标需要切成N份，每一份对应一个尺寸。另外需要
长久以来，三维姿态估计都在追求准确性上一路狂奔。但精度提高的同时，也带来了计算成本的上升。而刚刚被CPVR 2021接受的论文中所提出的模型，MobileHumanPose却可以同时做到又小又好。还是放在手机上都能hold得住的那种。来感受一下这个feel：这种动作的健身操也没问题：据了解，这个模型的尺寸，只有基于ResNet-50的模型的1/7，算力达到了3.92GFLOPS。而且平均每关节位置
相关文章1、iphone关于单倍图和二倍图（导航 背景 变高）----2、ios切图（一倍图+二倍图+三倍图）----3、大屏iPhone的适配 +iOS 图片尺寸要求----4、iPhone设备屏幕尺寸及开发图片适配----https://www.jianshu.com/p/80cd97653e49 iPhone手机屏幕尺寸一般指：物理像素，ps像素。 iPhone的app现在一般适配
3 二倍图3.1 物理像素&物理像素比物理像素就是分辨率，物理像素点指的是屏幕显示的最小颗粒，而物理真实存在的。这是厂商在出厂时就设置好了，比如苹果6\7\8是 750*1334我们开发时候的1px不是一定等于1个物理像素的。PC端页面，1个px等于1个物理像素的，但是移动端不尽相同。一个px的能显示的物理像素点的个数，称为物理像素比或屏幕像素比。pc端和早前的手机屏幕/普通手机屏幕：1C
本篇目录一、物理像素&物理像素比二、多倍图三、背景缩放四、多倍图切图 cutterman一、物理像素&物理像素比物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。这是厂商在出厂时就设置好了,比如苹果6\7\8 是 750* 1334我们开发时候的1px 不是一定等于1个物理像素的PC端页面，1个px 等于1个物理像素的，但是移动端就不尽相同一个p
原创
2023-01-25 14:37:09
135阅读
