I am new in developing games with Xcode for iPhone/iPad. Thus I need some help with the correct procedure to create images/sprites for the game.
我在为iPhone/iPad开发Xcode的游戏中是新手。因此，我需要一些帮助，以正确的程序创建图像/精灵的游戏。
By now I have created my sprites with Illustrator and I exported them as PDF files. In Xcode I created this single scale asset and put the PDF in it.
现在我已经用Illustrator创建了精灵，并将它们导出为PDF文件。在Xcode中，我创建了这个单一规模的资产并将其放入其中。
If I understand the documentation correctly, Xcode automatically generates image files at @1x, @2x and @3x from the PDF. Does it generate PNG files?
如果我理解正确，Xcode会自动从PDF中生成@1x、@2x和@3x的图像文件。它是否生成PNG文件?
Then I create a SKSpriteNode and set the size like this: abc.size = CGSize(width: 123, height: 123). Instead of 123, I fill in the width and height corresponding to the frame/image size I set up in Illustrator. Is this correct? I think so, because this is @1x version?!
然后我创建一个SKSpriteNode并设置大小如下:abc。尺寸= CGSize(宽度:123，高度:123)我不填123，而是填入与我在Illustrator中设置的帧/图像大小相对应的宽度和高度。这是正确的吗?我想是的，因为这是@1x版本?!
But if I need the same image for iPhone and iPad in different sizes, i can't simply resize it, because the @1x image version isn't a vector anymore and bounded to the frame size I chose in Illustrator? What to do then? Do I have to resize my image in Illustrator and export it in a different size?
但是如果我需要iPhone和iPad的相同图像大小不同，我不能简单地调整它的大小，因为@1x图像版本不再是一个矢量，而是限制在我在Illustrator中选择的帧大小?要做什么呢?是否需要在Illustrator中调整图像大小并导出不同的大小?
What is the correct procedure? Do I have to draw a sketch with pencil at the very beginning on a paper and the measure it with ruler? Then I would go to illustrator and set the frame width height at that what I measured manually?
正确的程序是什么?我需要在一开始就用铅笔在纸上画一幅素描，然后用尺子量一下吗?然后我去illustrator把帧宽设置在我手工测量的高度?
So many questions. I am very confused with this images sizes, resolutions and @1x, @2x and @3x version. I am not sure why I should use vector files, if I still can't resize the images in the developing process as I would like to, because they are still bound to the frame size I chose in Illustrator.
如此多的问题。我很困惑这个图片大小，分辨率和@1x， @2x和@3x版本。我不知道为什么我应该使用矢量文件，如果我仍然不能在我想要的开发过程中调整图像的大小，因为它们仍然与我在Illustrator中选择的帧大小绑定在一起。
Is there no possibility to set ratios between all my images and then just use the vector PDF file? How should I setup my Illustrator?
有没有可能在我所有的图片之间设置比例然后使用矢量PDF文件?我应该如何设置我的Illustrator?
I hope somebody can bring some light into the dark. Thank you.
我希望有人能给黑暗带来光明。谢谢你！
2 个解决方案
#1
1
Your pdf should be sized in points @1x (not pixels). The points should be the same physical size on the phone and the ipad, but if you want them smaller on the phone you need a second set of images; the asset catalog lets you swap out images based on iphone/ipad. Xcode renders your pdf to png's @1x, @2x and @3x and your app will pick the correct png based on the resolution of the device. You are correct that these are no longer vector assets and that scaling them up could leave you with blurry/pixelated images. You have a couple of choices:
您的pdf应该以@1x(而不是像素)为单位。这些点在手机和ipad上的物理尺寸应该是相同的，但是如果你想让它们在手机上更小，你需要第二组图像;资产目录允许您基于iphone/ipad交换图像。Xcode将您的pdf呈现给png的@1x、@2x和@3x，您的应用程序将根据设备的分辨率选择正确的png。您是正确的，这些不再是矢量资产，扩大它们可能留下模糊/像素化的图像。你有几个选择:
1) include a scaled up version of your image at its maximum scale in app and use this version only when you need to scale up (otherwise its a waste of memory and processing if you are always rendering a much smaller image). This is probably the easiest solution.
1)在应用程序的最大规模上增加你的图像的放大版本，只有当你需要放大的时候才使用这个版本(否则，如果你总是渲染一个小得多的图像，它会浪费内存和处理)。这可能是最简单的解决方案。
2) leave your assets as vectors and load them as vectors, You still can render them to images for performance at a constant scale or range of scales, but you can always re-render them at any scale if needed. Most likely you want to use an SVG library for this.
2)将资产保留为向量，并以向量的形式加载它们，您仍然可以将它们呈现给图像，以获得恒定规模或范围的性能，但如果需要，您可以随时重新呈现它们。您很可能希望为此使用SVG库。
3) You can directly import your assets as code using a program such as paint code. There used to be similar plugins for illustrator but I haven't seen one for Swift 3/Illustrator CC. This is obviously faster than #2 since there is no need to decode the vector file. If your file has a lot of overdraw you may still want to rasterize to images for performance.
3)您可以使用paint代码等程序直接将您的资产作为代码导入。illustrator以前也有类似的插件，但是我还没有见过Swift 3/ illustrator CC的插件，这明显比#2快，因为不需要解码矢量文件。如果您的文件有很多透支，您可能仍然想要光栅到图像的性能。
#2
1
Here's what I've found from my experience:
以下是我从我的经历中发现的:
1) Xcode does not generate @2x and @3x from .png files. It can't really - you need to manually supply @1x, @2x, and @3x sizes.
1) Xcode不从.png文件生成@2x和@3x。它不能——您需要手动提供@1x、@2x和@3x大小。
2) Whatever size you use for the CGSize(...), that should be your @1x image, then generate @2x, and @3x from that. I started by designing the size of a level in the scene editor, then made a generic SKSpriteNode shape just to get the size I wanted, then I started making the image from the size I found that looks good.
2)无论CGSize(…)使用什么大小，都应该是@1x映像，然后从中生成@2x和@3x。我首先在场景编辑器中设计一个级别的大小，然后制作一个通用的SKSpriteNode形状，以得到我想要的大小，然后我开始根据我发现的看起来不错的大小制作图像。
3) Xcode supports vector based graphics (svg, pdf), but you can't use them as part of a texture atlas, which makes them much less useful in my opinion.
3) Xcode支持基于矢量的图形(svg, pdf)，但是不能将它们作为纹理图集的一部分使用，这使得它们在我看来用处不大。
#1
1
Your pdf should be sized in points @1x (not pixels). The points should be the same physical size on the phone and the ipad, but if you want them smaller on the phone you need a second set of images; the asset catalog lets you swap out images based on iphone/ipad. Xcode renders your pdf to png's @1x, @2x and @3x and your app will pick the correct png based on the resolution of the device. You are correct that these are no longer vector assets and that scaling them up could leave you with blurry/pixelated images. You have a couple of choices:
您的pdf应该以@1x(而不是像素)为单位。这些点在手机和ipad上的物理尺寸应该是相同的，但是如果你想让它们在手机上更小，你需要第二组图像;资产目录允许您基于iphone/ipad交换图像。Xcode将您的pdf呈现给png的@1x、@2x和@3x，您的应用程序将根据设备的分辨率选择正确的png。您是正确的，这些不再是矢量资产，扩大它们可能留下模糊/像素化的图像。你有几个选择:
1) include a scaled up version of your image at its maximum scale in app and use this version only when you need to scale up (otherwise its a waste of memory and processing if you are always rendering a much smaller image). This is probably the easiest solution.
1)在应用程序的最大规模上增加你的图像的放大版本，只有当你需要放大的时候才使用这个版本(否则，如果你总是渲染一个小得多的图像，它会浪费内存和处理)。这可能是最简单的解决方案。
2) leave your assets as vectors and load them as vectors, You still can render them to images for performance at a constant scale or range of scales, but you can always re-render them at any scale if needed. Most likely you want to use an SVG library for this.
2)将资产保留为向量，并以向量的形式加载它们，您仍然可以将它们呈现给图像，以获得恒定规模或范围的性能，但如果需要，您可以随时重新呈现它们。您很可能希望为此使用SVG库。
3) You can directly import your assets as code using a program such as paint code. There used to be similar plugins for illustrator but I haven't seen one for Swift 3/Illustrator CC. This is obviously faster than #2 since there is no need to decode the vector file. If your file has a lot of overdraw you may still want to rasterize to images for performance.
3)您可以使用paint代码等程序直接将您的资产作为代码导入。illustrator以前也有类似的插件，但是我还没有见过Swift 3/ illustrator CC的插件，这明显比#2快，因为不需要解码矢量文件。如果您的文件有很多透支，您可能仍然想要光栅到图像的性能。
#2
1
Here's what I've found from my experience:
以下是我从我的经历中发现的:
1) Xcode does not generate @2x and @3x from .png files. It can't really - you need to manually supply @1x, @2x, and @3x sizes.
1) Xcode不从.png文件生成@2x和@3x。它不能——您需要手动提供@1x、@2x和@3x大小。
2) Whatever size you use for the CGSize(...), that should be your @1x image, then generate @2x, and @3x from that. I started by designing the size of a level in the scene editor, then made a generic SKSpriteNode shape just to get the size I wanted, then I started making the image from the size I found that looks good.
2)无论CGSize(…)使用什么大小，都应该是@1x映像，然后从中生成@2x和@3x。我首先在场景编辑器中设计一个级别的大小，然后制作一个通用的SKSpriteNode形状，以得到我想要的大小，然后我开始根据我发现的看起来不错的大小制作图像。
3) Xcode supports vector based graphics (svg, pdf), but you can't use them as part of a texture atlas, which makes them much less useful in my opinion.
3) Xcode支持基于矢量的图形(svg, pdf)，但是不能将它们作为纹理图集的一部分使用，这使得它们在我看来用处不大。