UI设计中的倍图

最新推荐文章于 2023-02-15 10:19:55 发布
最新推荐文章于 2023-02-15 10:19:55 发布
阅读量6.5k 收藏 3
点赞数
分类专栏： UI 文章标签： UI中的倍图
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/COOL_BEAR_XX/article/details/45194043
版权

IOS开发中需要把UI设计的图片适配为1x,2x,3x倍图的大小，如何在Photoshop中加工呢？

之前建的工程为375x667大小的，以为就是iPhone的屏幕大小，最后发现这样的大小不符合切图的像素大小。

在网上查到如下的设置像素大小图示，



最好一开始就把工程设置为3x图，1242*2208的大小，这样在需要2x图的时候就可以把3倍图拿来修改就OK了图片就不会模糊。

打开之前的PSD工程文件，command+Alt+I 调整图像大小为750-1334即可。

其他一些参考可点击网址:http://www.3lian.com/edu/2014/11-27/181315.html

来自南方的熊
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
UI设计师自学记：抄袭别人，超越自己
02-20
看过之前系列文章的小伙伴们应该了解，我主张”玩设计”，做事先从兴趣爱好入手，这样你才有精力获得双倍甚至几倍的收益，否则因强迫而从事，终究提不起劲儿来。做UI也是如此，当你有这个兴趣，有这种动力的时候，...
UIImage的scale及size，二倍图，三倍图，像素等概念透析
yungeIOS的博客
04-25 9839
UIImage的scale及size
二倍图三倍图什么意思_iOS 2倍图 3倍图适配小结
weixin_35415045的博客
01-30 2855
写在前面越来越觉得知识点是这样的 ，知道了是一回事，总结起来，又是另外一回事。有时候，明明知道了，感觉已经掌握了这个知识点，但是总结起来却很难，甚至都不知道从何下手，也许还是知识点没掌握牢固的缘故。(以下都是小虾小结，大咖请绕行哦????)正题整个项目主要功能基本完成，测试也接近尾声，UI还在不断的细调中。关于UI发现的几个问题，特此记录下来。操作类button宽度以及默认和点击状态小图标失真背景大图片...
Android开发中关于UI图片资源的问题
u012675267的博客
11-17 1423
目前来说，我们可以按照手机屏幕的标准把800×480理解为hdpi，480×320为mdpi，320×240为ldpi，根据最新的数据显示，Android所有手机中hdpi和mdpi占有九成以上的比例；还有1280×720、1920×1080等高分辨率的android手机界面。 问题一：800×480、480X320、320X240分辨率的手机需要不同的图片资源； 答：按照经济方便的角度来说，
UI设计为什么要用1倍图？优漫动游
IUcom的博客
02-15 527
​ 大多数设计师都在选用375*812的尺寸，其主要目的是为了方便与开发的无障碍沟通，因为开发在搭建页面的时候，也会像设计师一样去设置一个画布，尺寸也就是375*812，所以他们不需要换算，就能直接照着设计稿去设置每个元素的尺寸和位置。
移动端开发-为什么需要“（二倍图，三倍图，四倍图）图解”
weixin_44684093的博客
11-04 8692
1.知其然，又要知其所以然。 2.知其前需要基础： 2.1：1.逻辑像素（CSS），2.物理像素， 3.一张在一个设备的某个区域内要想显示清晰的条件要素有什么? 2.2:1.逻辑像素：就是程序概念的横向或者纵向的(css px)像素点。 2.物理像素：就是物理设备的横向或者纵向提供的荧光点的像素点。 3.一张在一个设备的某个区域内要想显示清晰的条件要素是“ 设置的逻辑横纵向像素点需要刚好填满物理设备提供的物理 像素荧光点”。
UI设计中按钮设计攻略
Mr_GuoPengFei的博客
08-26 667
　　UI设计创新技能层出不穷，UI设计满足着形形色色各种垂直化的需求,在设计方面大家也是想方设法去做一些创新,希望自己能够在各种应用中脱颖而出,今天我就针对UI设计中按钮设计指南进行简单的说明。 　　建立认知 　　嘘!在你的印象中按钮是长啥样的，思考一会…… 　　没错，一个按钮应该看起来像一个按钮，需要让用户点。设计一个按钮时，最重要的目的是让它足够突出，尽可能的区别于其它元素内容，这样避免与其他任何东西浑为一体。 　　好的设计应符合用户的认知习惯 　　在数字产品中的F型浏览模式下..
为什么前端UI设计师给750PX的2倍设计稿？
qq1722377628的博客
11-13 8480
一、两个概念：物理像素，逻辑像素 物理像素：是手机的实际像素。 逻辑像素：即css里常用的px。 在iphone6里物理像素是7501334，即水平750，竖直1334个像素点，而前端移动端通常以这个标准给设计稿，那么2倍稿是什么意思呢？iphone6的css逻辑像素是350667。也就是说一个你在css里写1px，那么在真机里，它会用它的2个逻辑像素来填充。 二、1px边框问题 在css里最低的...
UI设计中关于按钮的那些事 
Mr_wangkai的博客
08-31 3535
UI设计中关于按钮的那些事 按钮在界面设计中，属于最基础的元素部分组成，按钮设计的精致，整个页面的品质也会上升不少的档次。今天给大家分享这篇文章，主要讲解在设计按钮时我们应该考虑哪些因素，包括视觉上，有哪些万能的方法及公式，能够正确的制定按钮的设计标准，来提升整个设计的系统性。 按钮有哪些作用？ 在设计按钮之前，需要先理解按钮起到的代表含义。什么地方该加按钮，什么地方不加按钮，在系统化设计思路中需要非常有讲究。通常按钮在页面，主要起到以下三点作用： 1、某一类型的功能操作 这种比较常见，如一.
swiftadmin基于PHP MySQL Layui 完美契合，自研Layui高颜值UI设计
11-15
【高于TP类框架性能10倍】 一键生成CURD、在线表单设计、基于PHP MySQL Layui 完美契合，自研Layui高颜值UI设计，适合开发CMS、CRM、OA等系统，是一款优秀的中后台极速开发解决方案
Sketch矢量设计软件
03-14
Sketch（App Store 精华） 是最强大的移动应用矢量绘图设计工具，对于网页设计和移动设计者来说，比PhotoShop好用N倍！尤其是在移动应用设计方面，Sketch 3 的优点在于使用简单，学习曲线低，并且功能更加强大易用。...
lwc-utils:可重复使用的LWC可以使您的解决方案构建速度提高10倍。 使用LWC +屏幕流设计交互式，数据密集型UI
05-11
可重复使用的LWC可以使您的解决方案构建速度提高10倍。 messageService ：闪电消息服务（LMS）简化了组件消息传递。 SOQL Datatable ：利用SOQL为您的列表视图，相关列表甚至屏幕流提供动力。 Collection ...
iOS设置父视图透明度而不影响子视图
热门推荐
COOL_BEAR_XX的专栏
05-12 1万+
在设置父视图的时候，只对父视图的透明度进行更改，而不影响它上面子视图的透明度。就需要用到下面蓝色字体的设置方法。 UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 375 *WIDTH, 667 *HEIGTH)];             view.backgroundColor = [[UIColor bla
iOS中雷达波扩散Layer层动画的实现
COOL_BEAR_XX的专栏
04-22 8010
iOS中雷达波扩散动画的实现，该动画是一个基于layer层的动画 /*--------------- 扩散动画 ---------------*/    CALayer * _spreadLayer;     _spreadLayer = [CALayer layer];     CGPoint tempPos = _spreadLayer.position;     C
iOS中把新建的Controller的XIB与之类关联
COOL_BEAR_XX的专栏
04-30 5041
在iOS开发中，不想用代码来写控件的位置，就用XIB来拖入需要的控件，要建立与新建类相关的XIB可以在新建一个类的的时候勾选创建XIB的勾。 但有时忘记了勾，后面又想创建，可以通过以下步骤实现， command + N新建，选择VIew，如图 点击这个XIB，点击里面的左侧栏File‘s Owner，在右侧栏的第三个图标中的class里输入需要
IOS中XIB与代码的关联使用技巧
COOL_BEAR_XX的专栏
03-26 4605
在IOS开发中难免遇到页面控件很多，繁琐的时候，又不想去写代码，这时使用XIB来进行界面控件的布局是最省事的办法。 这里介绍一下简单的一些使用技巧： 一般来说都是创建视图控制器的XIB,视图控制器的XIB使用如下，
IOS中弹出视图的简单使用（UIPopoverController，DXPopver）
COOL_BEAR_XX的专栏
04-03 4007
弹出视图UIPopoverController的一些使用 //UIPopoverController只能弹出视图控制器，使用时把需要展示的视图放在视图控制器中     UIPopoverController * popView = [[UIPopoverController alloc] initWithContentViewController:_contenVC];    
photoshop做心电图gif动画
COOL_BEAR_XX的专栏
04-24 2577
看到网上的gif动画想下载下来用一下，可是背景都是黑或者白的，又不想抠图，又不想用Flash之类的gif制作软件。 看到网上有大神制作的步骤，自己也做了一个，可以在UI方面使用。 打开Photoshop，添加需要的背景，需要透明的可以后面把背景删除。 选择移动工具，CTRL+R点击出标尺，拉一根参考线， 选择钢笔工具，选择为路径的方式， 新建一个透明图层，
ui设计图转换成html
最新发布
06-12
将UI设计图转换成HTML需要以下步骤： 1. 分析设计图：首先，你需要仔细分析设计图，将其分解成不同的部分，例如：导航栏、页眉、页脚、内容区域等。 2. 写HTML代码：根据UI设计图的分析结果，你可以开始编写HTML代码。在编写HTML代码时，确保它是语义化的，并使用正确的标签和属性。 3. 添加CSS样式：接下来，你需要添加CSS样式来实现设计图的外观。使用CSS框架和预处理器可以加快这个过程。 4. 响应式设计：现在，大多数网站都是响应式的，所以确保你的设计在不同的屏幕尺寸下都能正常显示。 5. 测试和调试：最后，测试你的代码并进行调试，确保它在主流浏览器中都能正常运行。 需要注意的是，UI设计图转换成HTML需要一定的前端开发技能和经验，如果你不熟悉这些技术，建议你寻求专业的前端开发人员的帮助。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值