设计稿是根据640*1136尺寸设计的，现在要适配iphone 6 plus该怎么适配？_百度知道
设计稿是根据640*1136尺寸设计的，现在要适配iphone 6 plus该怎么适配？
640*1136设计的banner尺寸是640*260.5倍这样对么，如果根据这倍数关系 640*1136乘以1、我切图的时候就直接放大1，存在一个怎样的比例关系？3.5倍的话那应该是960*1704这和6p的尺寸不对啊、切图时有个@2x @3x的关系。2，适配到6p上为多大1
第二步，很容易想到先做好一种屏幕、iPhone 6 plus有两种显示模式。为什么选择iPhone 6作为基准尺寸，输出标注图，现在APP设计开发必须考虑适配大.5倍生成宽度1125px的设计稿.5倍直接等比适配、中？设计和开发之间采用什么协作模式。设计定稿后在750px的设计稿上做标注。先晒一下我们采用的协作模式：一个是程序用到的@3x切图资源。第一个决定是到底以哪种屏幕作为设计和开发的基准尺寸，再慢慢说明原委、小三种屏幕。此阶段不能用固定宽度的方式开发界面。375pt下的设计效果适配到414pt和320pt偏差不会太大：1。640x1136虽然是广泛应用的一个分辨率；3、选择一种尺寸作为设计和开发基准。所以如何做到交付一套设计稿解决适配大中小三屏的问题。由此完成大中小三屏适配;375pt）作为基准，视觉设计阶段：1？一个基本思路是，但是大屏时代依然以小尺寸为设计基准显然不合时宜；2、从中间尺寸向上和向下适配的时候界面调整的幅度最小。可见官方系统里iPhone 6和iPhone 6 plus分辨率之间就存在1，在1125px的稿子里切图，开发工程师拿到750px标注图和@3x切图资源，再去适配剩下两种屏幕、定义一套适配规则。同时等比放大1，除图片外所有设计元素用矢量路径来做，自动适配剩下两种尺寸.5倍）;iPhone 6 Plus适配版本即将提交App store审核，基于iPhone 6的界面效果，另一个是宽度750px的设计标注图、特殊适配效果给出设计效果，适配调试阶段、这个奇葩的数值是苹果官方都不愿意公开宣传的一个分辨率，设计师按宽度750px（iPhone 6）做设计稿。手机淘宝的iPhone 6&#47？当面对大中小三种屏幕需要适配的时候。第一步，输出两个交付物给开发工程师，标准模式分辨率为，放大模式分辨率为（即iPhone 6的1。第三步，基于几个原因，比如图片和文字之间视觉比例可能失调，不便于记忆和计算栅格，完成iPhone 6（375pt）的界面开发。很多情况下这两种尺寸可以用1，得用自动布局（auto layout），方便后续适配到其它尺寸。我们选择中间尺寸的iPhone （750px&#47。第四步，分别向上向下调试iPhone 6 plus（414pt）和iPhone 5S及以下（320pt）的界面效果。假设以414pt为基准做出很优雅的设计，到320pt可能元素之间比例就不是那么回事了。3。2.5倍的倍率关系，设计师会停留在小屏的视角做设计加上Android生态中纷繁复杂的各种奇葩尺寸
其他类似问题
为您推荐：
iphone的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁目前很多移动UI设计师，开始了一个又一个的APPUI项目。只知道需要设计一个iphone 6+的尺寸，然后根据这个尺寸进行缩放，从而达到适配其他手机机型的方案。今天跟大家一起分享下iphone6/6+的适配的真正原理。第一步：回顾下主流iphone的分辨率pt、px和PPI手机ptpxppiiphone4/4s/320×480640×960326iphone5/5c/5s320×568640×1136326iphone6375×667750×1334326iphone6+414×736 ()401对于6+之前的手机，pt和px的比例为1:2。而6+出来之后，这一比例达到了1:3。同时分辨率达到了（使用ip6+截图，再传到电脑上看，就是这个分辨率），而iphone实际分辨率为。分辨率的比率为1.15:1。对于ppi，6+之前均为326，而6+之后变为401。在实际APP项目开发中，素材通常是移动UI美眉负责提供。从@2x到@3x，素材的分辨率提高了1.5倍。例如一个@2x的素材大小为44×44，那么相应的@3x大小分辨率为66×66。文件命名的方式依然没变：${IMG_NAME}@3x.png这种形式了。命名好的文件丢入资源文件夹内，只要代码保持一致，文件名称不变即可。第二步：UI切图到代码这个过程，移动APP设计师必须了解的一个过程。由于ip6+点（point）和像素(pixel)的关系为1：3，因此，当UI设计稿基于1242 x 2208 分辨率【iphone6+】图给定UI设计稿时，程序员进行实际换算为设计稿的
1/3。适配问题其实在ip5出现的时候就存在了，乔布斯的3.5寸是最方便单手操作的尺寸已经成为过去，ip5的4寸屏幕扇了自己的脸。随着ip6的出现，屏幕分辨率也越来越多样化，以前在iOS中很方便的写死坐标法将越来越不好用了。因此需要进行适配。可以对控件间距进行适配，也可以对控件大小本身适配。知识点： 适配的总体原则就是相对布局了第三步：机型尺寸适配从iPhone5(s)发展到iPhone6(+)，由于高宽比保持不变，iOS对图标、图片、字体进行等比放大自适应，清晰度会有所降低。同时，绝对坐标布局会导致在大屏下出现偏左偏上的问题。从分辨率的角度来看，iPhone6沿用二倍图（@2x），但需为iPhone6+提供更高的三倍图（@3x）；从屏幕尺寸角度来看，需要重新对UI元素尺寸和布局进行适配，以期视觉协调。（1）按宽度适配我们先来看一下iPhone4~6(+)的屏幕高宽比：
iPhone4(s)：
分辨率960*640，
iPhone5(s)：
高宽比1.775
高宽比1.779
iPhone6+：
高宽比1.778可粗略认为iPhone5(s)、6(+)的高宽比是一致的（16:9），即可以等比例缩放。因此可以按宽度适配： 适配代码： fitScreenWidth= width*(SCREEN_WIDTH/320)这样，共有iPhone3/4/5、6、6+三组宽度，在iPhone6、6+下将按比例横向放大。（2）按高度适配在同样的宽度下，iPhone4(s)的屏高比iPhone5(s)低，若纵向排版紧张，可以iPhone5(s)为基准，按高度适配： 适配代码： fitScreenHeight= height*(SCREEN_HEIGHT/568)共有iPhone3/4、5、6、6+四组高度，在iPhone3/4下将按比例纵向缩小，在iPhone6、6+下将按比例纵向放大。这里需要注意iPhone/iOS双环上网的热点栏对纵向布局的影响：iPhone作为个人热点且有连接时，系统状态栏下面会多一行热点连接提示栏”Personal Hotspot: * Connection”，纵向会下压20pt，[UIApplication sharedApplication].statusBarFrame高度变为40pt；当所有连接都断开时，热点栏消失，纵向高度恢复正常为20pt。（3）按字体适配另外，iPhone的【设置】【通用】【辅助功能】中可以设置调节【更大字体】，APP也可以按字号适配：例如适配表视图（UITableView:UIScrollView），无法左右滑动，因此无论字号缩放比例多大，横向都不应超过SCREEN_WIDTH。注意限定控件元素内容区域宽度以及间距，并设置适当的LineBreakMode。表视图支持上下滑动，因此纵向上的表格行高和内容区域高度可按字号缩放。对于纵向也不支持滑动的视图，在屏幕可见视区内排版时，最好不要随字号缩放，否则可能超出既定宽高。 其他适配方法 还有：1、对于ip6或者6+最简单的适配方法就是：不适配。从上面计算可以看出，ip5，6，6+的屏幕比例均为16：9。因此，当一个app【支持ip5】的话，那么在ip6/6+上运行时，系统将会对画面进行拉伸，以便填充整个屏幕。拉伸之后看起来图标、字体、图片什么的都变大了，并且清晰度降低了，感觉就是在PC上全屏运行FC模拟器玩游戏这种感受。虽然降低了用户体验，但是比以前屏幕顶端和底端出现粗又黑的黑条来说，简直是好多了。2、占屏比适配对于不同手机，屏幕宽度是不同的。这样两个按钮的间距在不同屏幕上就显示合适了。使用[UIScreen mainScreen].bounds.size.width求出屏幕宽度。当然也不一定使用屏幕宽度作为基准尺度，在实际应用中，还可以选择superView frame的宽度、按钮本身宽度、某个基准图片的宽度等作为基准尺度。3、比例缩放适配这个是我们目前最常用的一种适配方式。根据屏幕比例进行适配。简单而容易理解，适配效果也还不错。以上就是前辈们分享的关于iphone6/6+的适配原理和iphone6/6+的适配心得，希望对各位有所收获。原文转自25学堂官网QQ群：1011374　
　文章为作者独立观点，不代表微头条立场
的最新文章
小编：2016年祝大家心想事成，越努力越幸运，新的一年在学UI网收获你理想的知识2016年的第一天，元旦新始2015的最后一天了，今天你该对2015的你说再见。2015也许你一事无成，也许你懒惰。你想改变么？那就从做文章来源/25学堂今天25学堂的小编跟大家来欣赏下美丽说和蘑菇街 AppStore截图设计对比欣赏。美丽说和原文地址/淘宝MIX无线设计林蔓：抢红包成为每年大促活动的标配套餐，用户对基本的红包玩法都不陌生，各大电商也文章转自/25学堂这是25学堂在国外某个设计网站看到的关于跨平台UX设计五项原则的观点，觉得说的还是有用的。原文地址/behance今天给大家带来的是来自behance大神的创意网页设计，这是Jerelo Natur文章转自/简书作者/粽小喵如果你是一枚交互设计师或者UI设计师，那么你一定知道Sketch这个强大的矢量设计今天上某酷上检索了一下gif，居然发现很多同学做的作业。突然有个想法让我自我膨胀了！想知道我想了啥么？做作业作品作者/Javi Pérez还有几天就是2016了，各位童鞋们还不努力？还不好好学习，做个好孩子？想要做好作品来自：digitalprogression 的设计师：malcolm tween今天和大家分享一套设计非原文地址/nngroup译文地址/jianshu译者/TerryFan在列表中使用缩略图，这样一个简单的需求作者/kong yunlei2015就剩最后几天了，不知道各位童鞋的今年的目标实现的怎么样了？想学UI的同学文章来源/25学堂今天25学堂的小编跟大家来欣赏下美丽说和蘑菇街 AppStore截图设计对比欣赏。美丽说和文章来源/25学堂今天25学堂跟大家聊聊APP当中最常见的一个设计元素：按钮。如今在移动app设计当中，图标快速发展的技术、千变万化的趋势、应接不暇的软件和素材，都是网页设计师需要面临的挑战。但是撇开这些一直变化的东今天是圣诞节了，小编给大家找来了圣诞卡片，一同来学习欣赏一下吧~UI设计导航：QQ群文章转自/优设网建议刚学UI的同学多看这类改版经验总结，提前学习交互设计的知识，在求职时能加不少分。习惯靠经2015年度十大网络用语出炉：重要的事情说三遍；世界那么大，我想去看看；你们城里人真会玩；为国护盘；明明可以叮叮当，叮叮当，铃儿响叮当…今天是圣诞节哦！男神首先在这里祝大家圣诞快乐~~今天我们的作业是一个APP的启动文章转自/人人都是产品经理微信公众号/thor_datou文章作者/Thor之前的文章里探讨过界面的易操作性小编：周末啦，又到了收干货的时候了。今天给大家带来的是由Adrian Chiran带来的精美的12页APP模原文地址/mindtheproduct文章转自/互联网的一些事　
设计岗位在如今科技产业中的地位越来越重，一些设计师在做了一段时间设计后，会产生困惑觉得自己的工作缺少影响力和话语权，很多人选择了转为产品经理，但我从来不觉得这是一条对所有人都适合的道路。与其把获得影响力全部寄希望于「多混几年」或者「转产品」，不如从现在就开始寻求和驱动改变。原文地址/onextrapixel文章转自/优设网优设译文/陈子木现代风盛行的网页设计圈中，不少设计师会倾向编者按：对于2016年网页设计的趋势我们已经在《再战明年！2016年最值得关注的16个网页设计趋势》这篇文章文章来源/设计之家小编：404页面越来越有特点，趣味、搞怪、创意，层出不穷，紧跟设计趋势勇往直前。今天这25原作者/Nick Slater今天平安夜，明天就是圣诞了，各位童鞋收到礼物了么？有约会么？没有的话赶紧来做作文章转自/25学堂一直以来，美食、时尚类App 非常的多，美食app开发给我们的餐饮习惯和享受美食的方式带来又到了做作业的时间了，今天我们的作业比较简单哦！就是一个gif小时钟的练习几乎没什么难点哦！提示：注意时钟的逆势生长的便利店，里头有的是洞悉人心的细致功夫。“独身、年轻、受过良好教育，新上海人。喜欢用好东西，租在市中文章转自/站酷作者/huang22shan没学过画画的菜鸟一枚，很喜欢插画做了一个公众号，就当记录一下自己的又到周一上班的时刻了，当你还在怀念周末的美好时光的时候，一波又一波的会议、邮件冲向你！此今天我们的作业是一组可爱的扁风的小动物哦！各位童鞋可任意挑选四个小动物临摹。 聪明的从大学开始制作像素表情，见证着QQ表情这一条路的发展，但始终却没有制作属于自对于视觉设计师、交互设计师来说，他们需要做的不仅仅是设计一张张静态的页面和独立的icon，他们需要将这些元素给用户及时、恰当的反馈，是交互设计非常重要的一项原则。由搜狐新闻客户端团今天我们的作业是一个偏写实的纸箱子，质感的处理可以自己创建图层样式来制作，或者使用美国视觉艺术家、摄影师 John Poppleto每到一年一度的大促季，会场、页面、互动游戏，都在紧张设计之中，这些精2013一米鲜是国内领先的生鲜O2O品牌，提供优质鲜果从2015年7月开始，经过了几个月的奋战，双12终于落下帷幕，先来看看@Chuckie-Chang ：今天对一些配色技巧和方法做一个分享和总结，无论你有美术基础/色彩基础还是零基ios9正式版推出已经有一段时间了，除了字体的变化和多任务后台的变更以外设计趋势每年都在改变，出于各种原因，有的设计趋势在演进中逐渐消失，有的设计上的细微调整，让设计变得更完美以前我在做设计的时候，xueuiwang 学UI网是一个发布高质量设计教程和分享设计经验的UI学习平台！ 每周的萌芽专访，带来满满的正能量；每日话题讨论，和大家一起解答疑惑；每周六晚上免费的YY公开课（），给大家提供更多学习机会。热门文章最新文章xueuiwang 学UI网是一个发布高质量设计教程和分享设计经验的UI学习平台！ 每周的萌芽专访，带来满满的正能量；每日话题讨论，和大家一起解答疑惑；每周六晚上免费的YY公开课（），给大家提供更多学习机会。1613人阅读
IOS开发（64）
iOS5.0于本周提交App Store，这两天iOS手雷成员各自都在总结。如果你仅仅认为首页/搜索改版是主要需求，那你就错了，其实iPhone6、iPhone6Plues的适配才是重点。
随着苹果发布iPhone6、iPhone6Plues，过去只属于Android设备的移动App多种设备尺寸适配问题，iOS的适配问题终于还是来了。
研发GG表示蛋疼。。。（根本是库克没调研清楚，小道消息说iPhone8又要回归4寸屏）
由于经验不足，发版过程界面适配BUG一直反复。为了将来不再受制于界面适配影响工作进度，总结5.0的经验之后，今天手雷iOS小伙伴们坐下来一起定制了这份UI规范。
以iPhone6为标准，对iPhone其他分辨率，制定了不同类型的适配方案。
首先了解iPhone主流设备：
将控件分为这几类：
一、&&&&& &
文字流控件定义了一种方案：
1、&&&&&&&&& & 字号、行高都不变；
2、&&&&&&&&& & 行数，是否定行需看具体内容；
3、&&&&&&&&& & 控件整体以iPhone6为标准，进行等比缩放。iPhone6在此基础上乘以1.10倍，iPhone5在此基础上除以1.17。
二、&&&&& &
方法一：控件不变、间距变；
（如淘宝底部导航）
方法二：间距不变，缩放控件；
（如手雷轮播图下四个入口）
方法三：左对齐，间距和控件都不变；如App Store中“精品推荐”效果
&（家里打不开store，无法截图 /(ㄒoㄒ)/~~）
三种方案中，方案一最适合手雷这个产品，方案二为辅助。
方案三目前没用，最为备选。
三、&&&&& &
方案一：像轮播图、广告图，这类横向拉通的图片需要做多套图，保持图片高度不变；
方案二：小图，则进行等比缩放。以iPhone6为标准，进行等比缩放。iPhone6在此基础上乘以1.10倍，iPhone5在此基础上除以1.17。
四、&&&&& &
两种控件叠加
后三种情况，在很多同行分享的博客上并没有提到，或许他们笼统的归纳到前三种之中，但我们还是觉得需要单独定义。
两种控件叠加的情况就要分视觉设计来分类了：
若与上层控件与底部密切关联较强，就可按等比的方案来操作。
（手雷“热门资源”模块中的叠加效果）
若关联性不够强，则可以上层控件大小不变，间距也不变而仅缩放下层控件。
（搜索中的图标没变，输入框等比拉伸）
五、&&&&& &
Table View
1、&&&&&&&&& & 左右固定；
2、&&&&&&&&& & 中间拉伸；
3、&&&&&&&&& & 高度不变；
（手雷我的首页list）
六、&&&&& &
保持模块间高度不变，不需要过多处理。
---------------------------------
团队总结的适配方案,总结出来当分享了
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：370748次
积分：4510
积分：4510
排名：第3534名
原创：83篇
转载：68篇
评论：177条
(1)(7)(2)(2)(7)(5)(3)(4)(3)(6)(7)(4)(2)(6)(7)(4)(5)(2)(13)(2)(4)(1)(3)(1)(1)(1)(2)(1)(43)(1)(1)IOS 做UI设计稿，为了适配两款手机，屏幕长宽比不同的时候，是不是也是需要出两套图的呢？
我是刚入行的射鸡师，在做项目的时候遇到了些问题，现在已经得知iPhone4、5代全系列包括6都是2倍图，但是如果遇到需要同时适配4代和5、6代的情况，他们的屏幕长宽比是不同的啊，那么出设计稿该怎么做，是4:3一套，16:9再做一套？还是有什么别的方法？像背景图那样的，包括launch image的效果图，有的时候是需要图片的啊，出现屏幕不同比例的情况，这咋整？求大神指教，！
按时间排序
图片的话可以用矢量图吧，pdf格式的。不过就算是pdf图片里面的分辨率还是要留意一下的，因为像UIBarButtonItem这种控件是不会帮你把图片的大小自动缩放的（UIImageView可以），具体可以看苹果官网的规格表。
控件的大小和位置很多时候是基于约束的，比如他距离父控件的边距是多少，距离右边控件的距离是多少。这些约束是不会随着屏幕长宽比而改变的。切图的话现在往往都是两份，2x一份3x一份APP一般切几套图适配
签到天数: 96 天连续签到: 1 天[LV.6]常住居民II主题帖子e币
那我自己都是等比例压缩的图放到hdpi中，那和系统自己去压缩调用xhdpi中的图有什么区别，干嘛还要多做一 ...
你这态度，我都说了，系统自己压缩是在内存中作的，也就是说会先创建原图然后做压缩，这样内存使用的峰值会上升，如果你的图片都这样，会有很多不必要的内存分配，也就会内存紧张，有可能就很多次GC，性能下降。听懂了？
意思是，防止系统再内存中做压缩或者拉升消耗内存，还是需要切多套图是吧。我们项目目前一般切3套480,720，1080&
该用户从未签到主题帖子e币
你这态度，我都说了，系统自己压缩是在内存中作的，也就是说会先创建原图然后做压缩，这样内存使用的 ...
意思是，防止系统再内存中做压缩或者拉升消耗内存，还是需要切多套图是吧。我们项目目前一般切3套480,720，1080
是的，最好是多使用一些点9或者是shape之类的作为图&
签到天数: 96 天连续签到: 1 天[LV.6]常住居民II主题帖子e币
意思是，防止系统再内存中做压缩或者拉升消耗内存，还是需要切多套图是吧。我们项目目前一般切3套480,720 ...
是的，最好是多使用一些点9或者是shape之类的作为图
签到天数: 135 天连续签到: 1 天[LV.7]常住居民III主题帖子e币
真希望谷歌能提供更好的解决方案。。。
推荐阅读热门话题
6192817071381629577545512492459407290285255248715
13&分钟前22&分钟前半小时前半小时前1&小时前1&小时前2&小时前2&小时前2&小时前2&小时前2&小时前2&小时前2&小时前2&小时前2&小时前
Powered by
扫一扫 关注eoe官方微信