APP切图和适配方法

为了通用而是只需切一行文字的高度就可以了。

不过这也不是绝对的，准确的说应该切的高
度H=paddingTop+textHeight+paddingBottom，及文字相对背景的上边距+一行文字的高度+文字相对背景的下边距。

6、切图的宽度
如果是一个通用的背景图，那么他的宽度应该是他在效果图中的最小宽度，也就是说这个背景可能在多处使用到了，就取最小的那个宽度就可以了。

比较麻烦的是铺满全屏的时候，这就需要看看你做的效果图的宽屏宽度，所以说做效果图的时候最好是做小屏幕的效果图。

有人可能会问点9的图不是可以拉伸、压缩吗，为什么需要参考最小的宽度呢？根据个人经验发现，一个大图在屏幕小的情况下点9图中拉伸的部分会变得颜色更深。

本文来源：微信[设计着]
人人都是产品经理（）中国最大最活跃的产品经理学习、交流、分享平台。

浅析app设计：切图的命名规范与标注说明写这篇文章也是总结了以前刚接触时候遇到的问题，还有来自其他朋友的提问。

关于切图的命名规范给人的第一印象就是全英文，看不懂，让很多人望而却步，当你有所了解之后，你就会发现其实没那么复杂。

本文主要为了给想了解命名规范的朋友解解惑。

一款产品的落地，必将先经历过需求分析、产品定位、项目拟定、功能分析、原型设计、再到设计稿输出，接下来再到开发，切图、标注是设计与开发需要沟通的步骤之一。

问题1：切图与标注是什么？切图：APP切图是实现设计效果的重要环节，开发们在实现的过程中需要计算好各个元素的位置，排布，然后再调用我们切好的图进行填充。

其存在是为了程序提高产品的开发效率和团队协作。

标注：标注能够帮助其他团队理解设计页面的布局关系、模块大小、颜色与字体规范等等。

注意：区分iOS与Android的规范问题2：为什么要制定规范？（规范存在的意义）1、方便修改与迭代对于项目而言，产品的优化迭代是必要的，除非打算放弃治疗。

有很多人对于文档的命名是这样的：遇到突发情况，比如你完成了设计后，突然要你改动哪个icon，你要找起来也是相当麻烦。

养成良好的命名习惯很重要，比如可以利用版本命名，亦或时间命名都可以更清晰地标明。

2、方便更快捷查找对于个人而言，psd文件有时候需要修改，整齐规范的psd文档是不是在修改图层的时候更容易找到该图层呢？（以上来自网络，图层命名没有固定性）3、方便设计团队沟通如果设计团队有一套完整的设计规范，那是再好不过。

如果没有这样完整设计系统，那么我们就得自己通过沟通制定一套规范，才能让沟通更加高效。

建议可以多看看网易、Google、QQ等企业的设计规范进行学习。

4、方便程序开发沟通曾经与程序沟通过需求，有些程序需要你切好图，标注好，命名好给他们，有些程序只需要你的设计档，他们自行切图标注，所以设计时与开发沟通尤为重要。

但是无论如何，规范的命名是最有效的沟通。

二、关于切图命名与标注的那些事像以前的设计输入都是手动输出，如今有了各种软件与插件，给设计师提供了更高效与快捷的方式去解决切图问题。

移动应用开发中的屏幕适配和分辨率处理技巧随着智能手机的普及，移动应用的开发变得越来越重要。

而在移动应用开发的过程中，屏幕适配和分辨率处理是必不可少的技巧。

本文将着重探讨如何在移动应用开发中有效地处理屏幕适配和分辨率问题。

一、屏幕适配的重要性在不同品牌和型号的手机上运行移动应用，会面临屏幕尺寸不同的问题。

如果不进行屏幕适配，应用可能会因为布局错乱、字体显示不清晰等问题而影响用户体验。

因此，进行屏幕适配是非常重要的。

二、获取屏幕尺寸在进行屏幕适配时，首先需要获取手机的屏幕尺寸信息。

在Android开发中，可以通过代码获取屏幕尺寸，使用DisplayMetrics类可以获取到屏幕的宽度和高度，还可以获取屏幕密度、DPI等信息。

在iOS开发中，可以使用UIScreen类获取屏幕的尺寸和缩放比例。

三、布局适配一种常见的屏幕适配方法是使用百分比布局。

可以通过设置控件的宽度和高度为屏幕宽度或高度的百分比来实现灵活的布局。

还可以使用ConstraintLayout布局方式，通过约束控件之间的关系来自适应不同屏幕尺寸。

四、字体适配在不同分辨率的屏幕上，字体大小的显示效果也会有所不同。

为了保证字体在不同屏幕上的清晰度和可读性，可以使用sp（scalable pixels）作为单位进行字体的设定。

sp单位会自动根据屏幕密度进行缩放，从而实现在不同屏幕上显示一致的字体大小。

五、图片适配移动应用中，图片的适配也是一个重要的问题。

为了适应不同屏幕的分辨率，可以提供不同分辨率的图片资源，在布局文件中根据屏幕密度选择相应的图片资源。

还可以使用9-patch图形，在图片的边缘指定可拉伸的区域，从而适应不同尺寸的屏幕。

六、其他适配技巧除了布局、字体和图片的适配，还有一些其他的适配技巧可以提高应用在不同屏幕上的显示效果。

比如使用矢量图形代替位图，矢量图形可以无损缩放，并且避免了在不同分辨率下产生模糊的问题。

还可以在代码中根据屏幕尺寸动态调整控件的大小和位置，从而适应不同的屏幕。

移动应用开发中的多屏适配与分辨率适配方法随着移动互联网的快速发展，人们对移动设备的依赖度越来越高，越来越多的应用程序涌现出来。

然而，市场上存在着众多品牌、型号和尺寸各异的移动设备，这给应用开发带来了巨大的挑战。

在开发移动应用时，要保证应用在不同的屏幕上显示效果良好，就需要进行多屏适配和分辨率适配。

多屏适配是指根据不同的屏幕尺寸和显示比例，调整应用的布局和显示效果，以保证在不同设备上都能正常展示。

一种常见的多屏适配方法是使用百分比布局或者使用可伸缩的布局容器，这样可以根据屏幕尺寸动态调整界面元素的大小和位置。

另外，可以使用媒体查询技术来针对不同的屏幕大小加载不同的样式文件，以适应不同的屏幕尺寸。

而分辨率适配则是指根据设备的分辨率来调整应用的显示效果，使其在高分辨率和低分辨率设备上都能正常展示。

在移动应用开发中，一般使用像素密度（dpi）来进行分辨率适配。

根据设备的dpi，可以为不同密度的屏幕提供不同的资源文件和布局文件。

例如，可以为低密度屏幕提供较小的图标和字体，并为高密度屏幕提供较大的图标和字体。

除了多屏适配和分辨率适配外，还有一些其他的适配方法可以帮助开发人员更好地适应不同的屏幕。

一种常见的方法是使用弹性布局，即使用百分比或者弹性单位代替固定的像素单位，以便应对不同尺寸的屏幕。

这样可以让界面元素在不同大小的屏幕上自动调整大小和位置。

此外，还可以使用多列布局来适应不同的屏幕宽度。

在移动应用中，经常会遇到需要在一个界面中同时显示多个模块或者功能的情况，对于较窄的屏幕，可以采用垂直排列的方式；而对于较宽的屏幕，则可以采用水平排列的方式。

这样可以更好地利用屏幕空间，提升用户体验。

总的来说，在移动应用开发中，多屏适配和分辨率适配是至关重要的。

只有通过合适的适配方法，才能保证应用在各种设备上都能正常显示，并且提供良好的用户体验。

为了实现这一点，开发人员需要充分了解不同屏幕的特点和要求，灵活运用适配方法，不断优化和改进。

ui切图规范UI切图规范是指在进行UI设计切图时遵循的一套标准和规范，旨在保证切图效果的一致性和高质量。

以下是UI切图规范的一些重要内容，共计1000字。

1. 文件类型和分辨率UI切图通常使用PNG或者JPEG格式，对于有透明背景的图像，应使用PNG格式。

切图时要确保分辨率与设计稿一致，不要缩放。

如果设计稿尺寸过大，可以通过缩小比例来适应切图。

2. 图层命名和分组切图前应对设计稿中的图层进行合理的命名和分组，以方便后续的切图工作。

图层命名要简洁明了，能够清晰地表达图层的含义。

图层分组要合理，相同类型的图层要放在一起，方便定位和使用。

3. 图片大小和优化在切图时要根据需求和使用场景来选择合适的图片大小，避免不必要的加载和占用空间。

对于需要显示在高分辨率屏幕上的图像，可以使用矢量图或者高分辨率的位图，以保证图像的清晰度。

同时，对于切图后的图片要进行压缩和优化，减小文件大小，提高加载速度，保证用户体验。

4. 边界和间距在切图时要注意图元素之间的边界和间距，在设计稿中留有足够的空隙，避免图层之间相互重叠或者挤压。

同时，对于需要对齐的图层和元素，要使用对齐工具进行精确对齐，保证切出的图像符合设计要求。

5. 切图工具和技巧在进行UI切图时，可以使用一些专业的切图工具和技巧来提高效率和准确性。

例如，可以使用切图工具中的切片功能来快速切割图层，并设置输出路径和格式。

另外，可以使用取色器工具来获取设计稿中的颜色值，保证切出的图像颜色一致。

6. 图像质量和实际效果切图前应仔细审查设计稿，确保图像质量和实际效果的一致性。

例如，注意字体的平滑性和清晰度，保证切出的文字图像不会出现锯齿现象。

另外，注意对细节部分的处理，避免模糊和失真，特别是在缩小图像大小时要特别注意。

7. 标注和导出切图完成后，应进行标注和导出，方便开发人员的使用。

标注要包括图层尺寸、字体大小、颜色值等信息，并与开发人员进行沟通，确保理解和一致性。

导出时要注意导出格式和文件命名，方便后续的开发和使用。

一款APP，从设计稿到切图（Android篇）~汇集了之前的三篇Android帖子的精髓~IOS篇：一款APP，从设计稿到切图依旧声明：这里写的依旧只是某一种工作方法，而不是一种规范，你可以参考，但不要照搬，在具体工作中，一定要灵活运用。

汇总贴，整理了之前三篇零散的关于Android的文章……这里我把Android的开发文档，字体，以及不同设计尺寸的文档图片上传了，喜欢的下载；切图的工具在IOS的帖子里，喜欢可以去那下载，这里就不上传了。

如果看了IOS篇，对标注切图的问题会有更全面的理解，建议去看一下……Part 1 基础概念① 你需要知道的一些铺垫：手机分辨率：分辨率就是手机屏幕的像素点数，类似480*800、720*1280、1080*1920这个意思……手机屏幕尺寸：手机对角线的物理尺寸，单位是英寸；比如小米4的尺寸就是5英寸，IPhone 6的尺寸就是4.7英寸……手机屏幕密度：dpi或PPI，每英寸的像素点数，数值越高显示的越逼真细腻。

下面是屏幕密度的计算方法~可以尝试算算自己手机的屏幕密度~②Android自身设定的屏幕密度安卓尺寸众多，按每个屏幕去适配肯定不现实；所以为了解决这个问题，安卓手机屏幕有自己初始的固定密度，安卓会根据这些屏幕不同的密度自己进行适配。

这一点内容掌握到能满足自己设计工作需要就可以了……以下是Android的密度划分以及代表的分辨率，这里你可以发现已经和设计稿尺寸和切图输出开始挂钩了……你需要了解IPhone各个版本的手机屏幕密度：IPhone 4/4s/5/5s/5c/6 ≈320dpi你会发现单从屏幕密度来说，IPhone可以算是超高密度了。

下面来说说这几个密度：LDPI 120dpi 低密度不考虑这个了，消失了……MDPI 160dpi 中密度这个目前少见……HDPI 240dpi 高密度常见xHDPI 320dpi 超高密度常见xxHDPI 480dpi 超超高密度常见xxxHDPI 640dpi 超超高密度 Android4.3推出了对此密度的支持，也就是平板电视的4K分辨率你的切图会根据这几个密度来决定输出多少套~Part2 标注切图你需要知道的Android的一些开发使用的单位：dp：android开发使用的单位，其实相当于一种比例换算单位，它可以保证控件在不同密度的屏幕上按照这个比例单位换算显示相同的效果。

移动应用开发技术中的适配不同屏幕尺寸技巧如今，移动应用已经成为我们日常生活中不可或缺的一部分。

我们通过手机App进行购物、支付、社交、娱乐等各种活动。

然而，不同的手机屏幕尺寸和分辨率对应用的显示效果产生了影响，因此，适配不同屏幕尺寸成为了移动应用开发中一个重要的问题。

适配不同屏幕尺寸的技巧可以从UI设计和布局、图像和文本的处理、屏幕密度和比例、响应式设计以及测试和调试等几个方面来探讨。

首先，UI设计和布局是适配的基础。

在设计UI时，应该考虑各个元素在不同屏幕上的自适应性。

采用相对布局，通过比例和权重来保持元素间的相对位置和大小关系是一种常用的方法。

而对于相对位置无关紧要的元素，可以使用线性布局或者网格布局进行适配。

其次，图像和文本的处理也是适配的关键。

在不同屏幕尺寸上，图像和文本的大小和清晰度可能会有所不同。

为了保证图像在不同设备上的显示效果，可以使用矢量图形和九宫格等技术。

此外，在对文本进行处理时，应该考虑文字大小的自适应和字体的选择，以确保在不同屏幕上都能够保持良好的可读性。

屏幕密度和比例也是适配的关键因素。

不同手机的屏幕密度和比例不同，因此，在计算元素的大小和位置时应该考虑到这些因素。

可以通过使用dp（Density-independent Pixel）单位来保持元素在不同屏幕上的一致性。

此外，还可以通过使用百分比布局和流式布局等技术来适配不同屏幕比例的设备。

另外，响应式设计也是适配的一种方法。

响应式设计是指通过检测设备的特征和屏幕尺寸，来为设备提供最佳的用户体验。

可以通过使用媒体查询和流式布局等技术来实现响应式设计。

这样，无论是大屏幕还是小屏幕的设备，都能够适应不同的屏幕尺寸。

最后，测试和调试是适配的必要环节。

在开发移动应用时，应该进行多设备、多分辨率的测试，以确保应用在所有设备上都有良好的适配性。

可以使用模拟器和真机进行测试，并注意观察应用在不同设备上的显示效果和用户体验。

如果发现适配问题，应及时进行调试和修复。

APP切图详细规范终极指南2015-03-11 分类：UI设计围观31698次我们都知道一套完整的App 通常会有很多张切图，不管是iPhone 需要1x、2x、3x 图档，Android 需要至少3 种hdpi、xhdpi、xxhdpi。

在庞大的切图数量下如何让负责套图的RD 快速找到所需图档，档名的命令方式就需要双方统一格式方便大家作业。

所以，制定一套非常有效而方便的APP切图命名规范非常有用的。

下面就跟随小编来详细了解APP切图命名的流程和命名规范。

ios切图尺寸规则目前iPhone有10种型号，5种屏幕尺寸，再加上6plus的“降采样”（Downsampling）（1080-1920），还有iPhone6和6+上的放大模式（1125-2001）和默认模式（1242-2208），是不是感觉好恐怖？但是不用怕，我分享一套超简单的适配方法，看完你都不信有这么简单~美术交付给开发的资料有1、标注图（以640为宽度尺寸为基准标注）2、 2x切图（以640为宽度尺寸为基准切图）3、 3x切图（以1280为宽度尺寸为基准切图）开发看到这份标注图，可以自己用上面的数字，乘以1.5得出3X的数字。

1.为什么3x切图要以1280来为宽度？其实iPhone6+的尺寸1242*2208作为3X，怎么算都又难记又不能整除，我们直接640*2得到1280跟1242相差也没几十个像素，最重要的是不虚边啊，放在真机上看（处女座除外）看不出差别的。

2.为什么只设宽度？为了保持长宽比例。

iPhone的这几个尺寸不是正好的，宽度放大后高度总差那么几个像素，这不要紧，千万别去改高度，手机屏幕是可以上下滑动的嘛。

不可以滑动必须保证一屏显示的除外，手动去调整好了。

3.为什么开发不是乘以2而是乘以1.5来算尺寸和字号？因为大屏手机就是要显示更多内容而存在的。

纯等比放大界面看起来傻大傻大的，实验证明1.5倍是正好的。

Android切图尺寸规则px（像素）是我们UI设计师在PS里使用的（不解释），同时也是手机屏幕上所显示的（也不解释）dp是开发写layout的时候使用的尺寸单位，sp是开发写layout时关于字体的字号单位，且dp与sp总为1：1关系。

APP制作开发切图的六大基本元素设计切图是个技术活，小伙伴们千万不能忽视切图的重要性，下面APP开发小编来为大家讲解：APP制作开发切图的六大基本元素设计。

一、整体布局优秀的应用有些共同的地方，无论是出于什么考虑，在界面上应该避免左右布局严重不平衡，当然也有故意设计成不对称美的。

比如界面的最下面一栏有两个横着排版的按钮，那么这两个按钮最好整体上居中，若是偏左或是偏右那么就有左右不平衡的感觉，要么是左重右轻，要么是左轻右重，看上去有一部分比较空。

二、界面简洁这点有两重意思，其一就是界面完成的功能很明确、简洁，其二是同类操作尽量在一个界面完成。

感觉上这两点有冲突，其实不然，如果真的不能做到既界面简洁又功能统一那么这个设计最好还是再设计设计。

比如用户信息输入功能中第一个界面完成用户名输入、密码，确定后进入第二个界面进行设置头像。

像这样的界面的个人认为太罗嗦了。

既然都是完成用户信息的功能，那么完全可以设计到一个界面中。

这样一来可以把整个功能做得更紧凑，少用一个界面更简洁。

APP制作开发切图的六大基本元素设计三、按钮的设计你可以真正点击的区域应该尽量大些，至少不应该小于一个手指的宽度，那样的话点击的命中率要高，否则会有“点击不灵敏”的感觉，当然并不是真正的不灵敏，而是没有点中操作的区域。

(用户可不管这些理由，多为用户考虑哦)。

对于RadioButton、CheckBox至少应该出3个状态的图：正常、点击、选中。

有时不能为了方便就只出两个图：正常、选中。

这种情况在点击的过程中也有“响应迟钝”的感觉，因为毕竟在点击状态没有换图。

四、排版的设计对于整体上的设计应该尽量考虑到好用、实用，而不是能用。

我自己的体会是这样的。

凡是要响应点击或者其他事件的部分应该尽量和屏幕四周的边框保持一定的距离。

如果你非得把这部分放在屏幕边上，那么最好放大操作区域。

因为屏幕边上点击并不是那么好用（如果设备加了一个保护套，那么屏幕边上就会很难点），至少我用过的有边框的设备，也就是说屏幕边上直接用手去点大部分情况是点不中的。