Xcode 图片说明
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26569995/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Xcode images explanation
提问by Nathan Schafer
What makes an image 1x, 2x or 3x (@1x, @2x, @3x)? How can you make a 3x image?
什么使图像成为 1x、2x 或 3x（@1x、@2x、@3x）？如何制作 3x 图像？
回答by vacawama
iOS uses points instead of pixels in its coordinate systems. In the original non-retina devices (iPhone, iPhone3G, iPhone3GS, iPad, iPad 2, iPad mini, and early iPod touches) one point in the coordinate system mapped to one pixel on the screen of the device. At that time, life was simple, you provided images to your app that mapped to the point size and everything looked great.
iOS 在其坐标系中使用点而不是像素。在原始的非视网膜设备（iPhone、iPhone3G、iPhone3GS、iPad、iPad 2、iPad mini 和早期的 iPod touch）中，坐标系中的一个点映射到设备屏幕上的一个像素。那时，生活很简单，您向应用程序提供映射到点大小的图像，一切看起来都很棒。
When Apple introduced the first retina display devices (iPhone 4, iPad with Retina Display, and iPod touch 4), the devices had 2 pixels for every point. Apple devised a clever way of dealing with this. The programmer just had to add a second image to their program with the increased resolution and add @2x to the name. No changes to the code were needed. If your code loads an image called "house", iOS will load "house" on a non-retina device (such as the iPad 2 or original iPad mini), and it will use "house@2x" for the retina devices. The iPhone 6 Plus has even higher resolution so it uses a @3x version.
当 Apple 推出第一款视网膜显示设备（iPhone 4、配备 Retina Display 的 iPad 和 iPod touch 4）时，这些设备的每个点都有 2 个像素。苹果设计了一种巧妙的方法来解决这个问题。程序员只需要将分辨率提高的第二张图像添加到他们的程序中，并将@2x 添加到名称中。无需更改代码。如果您的代码加载名为“house”的图像，iOS 将在非视网膜设备（例如 iPad 2 或原始 iPad mini）上加载“house”，并且它会在视网膜设备上使用“house@2x”。iPhone 6 Plus 的分辨率更高，所以它使用@3x 版本。
So what makes an image @1x, @2x, or @3x? If your "house" image is 120 pixels by 90 pixels, then your "house@2x" image should be 240 by 180 pixels, that is twice the number of pixels in each dimension ("2x" for short). The "house@3x" version should be 360 by 270 (3 times the number of pixel in each dimension).
那么是什么使图像@1x、@2x 或@3x？如果您的“房子”图像是 120 x 90 像素，那么您的“house@2x”图像应该是 240 x 180 像素，这是每个维度（简称“2x”）像素数的两倍。“house@3x”版本应该是 360 x 270（每个维度像素数的 3 倍）。
It's up to you to make sure that the @2x and @3x versions have more detail, and not just more pixels. You can use a program like Photoshopor Pixelmatorto create your images. Start by creating the nice highly detailed version of your image (the @3x version), and then scale it down to the @2x resolution and save that version as your @2x version. Then open your @3x version again and scale it to the @1x resolution and save that as your @1x version. Add all three versions to the Assets Catalog in Xcode, and iOS will load the appropriate version for the appropriate devices.
由您来确保@2x 和@3x 版本具有更多细节，而不仅仅是更多像素。您可以使用Photoshop或Pixelmator等程序来创建图像。首先创建您的图像的非常详细的版本（@3x 版本），然后将其缩小到@2x 分辨率并将该版本保存为您的@2x 版本。然后再次打开您的@3x 版本并将其缩放到@1x 分辨率并将其保存为您的@1x 版本。将所有三个版本都添加到 Xcode 的 Assets Catalog 中，iOS 将为相应的设备加载相应的版本。
回答by Steve Rosenberg
Read this to learn about the different resolutions:
阅读本文以了解不同的分辨率：
http://www.paintcodeapp.com/news/iphone-6-screens-demystified
http://www.paintcodeapp.com/news/iphone-6-screens-demystified
If you are looking for an inexpensive and easy way to create graphics, that will export in all three sizes, get Sketch 3:
如果您正在寻找一种廉价且简单的方法来创建图形，并且可以导出所有三种尺寸，请获取 Sketch 3：
http://bohemiancoding.com/sketch/
http://bohemiancoding.com/sketch/
With Sketch you can make a graphic and then export it immediately in any size class you need.
使用 Sketch，您可以制作图形，然后立即将其导出为您需要的任何尺寸等级。
Here are Photoshop step by step instructions for changing size. If you have a vector drawing - lines and other shapes - you can start at any size and increase or decrease the size. The three photos below show increasing an image size. If you have an image like a jpeg then you will want to start large and work smaller to avoid distortion.
以下是 Photoshop 更改大小的分步说明。如果您有矢量图 - 线条和其他形状 - 您可以从任何大小开始并增加或减少大小。下面的三张照片显示了图像尺寸的增加。如果您有一个像 jpeg 这样的图像，那么您将需要从大开始并缩小工作以避免失真。
回答by sarunw
There are plenty of online tool out there where you put the largest size there (1024x1024) and it will generate resized version for you. e.g. https://www.iconcutter.com
有很多在线工具，您可以在其中放置最大尺寸（1024x1024），它会为您生成调整大小的版本。例如https://www.iconcutter.com
回答by Vivek Lathiya
You can also use Prepomac application for different size images like 1x, 2x and 3x.
您还可以将Prepomac 应用程序用于不同尺寸的图像，如 1x、2x 和 3x。
You need to just add your image and you can export with different sizes of those images (Artwork). It also supports app icons also.
您只需要添加您的图像，您就可以导出这些图像（艺术品）的不同尺寸。它还支持应用程序图标。
