iOS - Xcode 模拟器上的颜色与设备上的颜色不同

iOS - color on Xcode simulator is different from the color on device

提问by user1046037

Overview

概述

The background color of my iPhone app in the simulator (iMac) looks different from the color on the device (iPhone 3GS).

我的 iPhone 应用程序在模拟器 (iMac) 中的背景颜色看起来与设备 (iPhone 3GS) 上的颜色不同。

EDIT (following section has been added)

编辑（以下部分已添加）

The following are all different:

以下都是不同的：

1. story board color (xib file)
2. simulator color
3. device color

1. 故事板颜色（xib 文件）
2. 模拟器颜色
3. 设备颜色

I suppose I should go with how it looks on the device.

我想我应该选择它在设备上的外观。

Questions

问题

1. Is this is a common problem other developers face and is there a way to match the colors (systematic procedure) ?
2. will the color look different on different versions of iPhone (3gs / 4 / 4s) or all the color ?
3. Am I missing something, is there any specific color profile I should use ?
4. Is there something like a rule of thumb where RGB values vary by a certain percentage ?
5. In iPhone 4 and 4S, do the color match the simulator ? ( I don't have a iPhone4 and 4S, so I am not sure.)

1. 这是其他开发人员面临的常见问题吗？有没有办法匹配颜色（系统程序）？
2. 颜色在不同版本的 iPhone (3gs / 4 / 4s) 或所有颜色上看起来会不同吗？
3. 我错过了什么，我应该使用任何特定的颜色配置文件吗？
4. 是否有类似于 RGB 值按一定百分比变化的经验法则？
5. 在 iPhone 4 和 4S 中，颜色是否与模拟器匹配？（我没有 iPhone4 和 4S，所以我不确定。）

采纳答案by user1046037

Credit goes to @jtbandes for suggesting to send screenshots which led to the solution

感谢@jtbandes 建议发送导致解决方案的屏幕截图

I am just answering the question for completeness.

我只是为了完整性回答这个问题。

Steps I followed:

我遵循的步骤：

1. Take a screenshot of image in storyboard
2. Take a screenshot of image in device (use mail / photo stream back to your mac)
3. Use color picker (part of mac OS color palette) to pick the same spot on both the screenshots
4. Note down the RGB values (available on the mac OS color palette) of spots chosen in step 3
5. compare both the RGB values and see the difference
6. add the RGB offset to match the color.

1. 在故事板中截取图像的屏幕截图
2. 在设备中截取图像的屏幕截图（使用邮件/照片流返回您的 mac）
3. 使用颜色选择器（Mac OS 调色板的一部分）在两个屏幕截图上选择相同的位置
4. 记下步骤 3 中选择的点的 RGB 值（在 mac OS 调色板上可用）
5. 比较两个 RGB 值并查看差异
6. 添加 RGB 偏移以匹配颜色。

My RGB offset (not be followed blindly)

我的 RGB 偏移量（不要盲目跟随）

based on my experience, i added the following RGB values to get the color I wanted, it is only rough and worked for me:

根据我的经验，我添加了以下 RGB 值以获得我想要的颜色，它只是粗略的并且对我有用：

• Red +12
• Green +19
• Blue +16

• 红色 +12
• 绿色 +19
• 蓝色 +16

Different angles (best to keep it horizontal)

不同的角度（最好保持水平）

Holding the phone in different angles also gives different shades, keeping it horizontal did give the color

以不同角度握住手机也会产生不同的色调，保持水平确实会产生颜色

回答by Womble

As others have pointed out, this is an issue of Color Spaces.

正如其他人指出的那样，这是Color Spaces的问题。

Two tasks need to be performed:

需要执行两个任务：

1. Get the source color using the sRGB color space.
2. Set the color in Interface Builder, using the sRGB color space.

1. 使用 sRGB 颜色空间获取源颜色。
2. 使用 sRGB 颜色空间在 Interface Builder 中设置颜色。

Task 1

任务1

You can use Apple's Digital Color Meterapp to sample the required color, using the Display in sRGBoption, but the output is very limited.

您可以使用 Apple 的Digital Color Meter应用程序来采样所需的颜色，使用该Display in sRGB选项，但输出非常有限。

Another option is to use an app like SipIt(available free on the App Store, last I checked). Make sure you are sampling in the correct color space by performing:

另一种选择是使用类似的应用程序SipIt（在 App Store 上免费提供，我上次检查过）。通过执行以下操作，确保在正确的色彩空间中进行采样：

Preferences -> General -> Color Profiles -> sRGB

You can also set your output format (e.g. hex string).

您还可以设置您的输出格式（例如十六进制字符串）。

Task 2

任务 2

In Interface Builder, open the Color window, choose the the second pane, choose "RGB Sliders". Then click on the cog icon to choose the sRGB color profile.

在 Interface Builder 中，打开 Color 窗口，选择第二个窗格，选择“RGB Sliders”。然后单击齿轮图标以选择 sRGB 颜色配置文件。

Once done, paste your color value in to the Hex Color #field

完成后，将您的颜色值粘贴到该Hex Color #字段中

You're done! Your colors should now match.

你完成了！您的颜色现在应该匹配。

I am not affiliated with SipIt in any way. But I've been using it for a few years and it is very handy. I'd recommend it to any designer.

我与 SipIt 没有任何关联。但我已经使用它几年了，它非常方便。我会推荐给任何设计师。

回答by John

The current (as of 3/17/14) CGColorSpace reference includes the following text, which says that sRGB is the native device color space for iOS.

当前（截至 2014 年 3 月 17 日）CGColorSpace 参考包括以下文本，其中说明 sRGB 是 iOS 的本机设备色彩空间。

Color Spaces and iOS: iOS does not support ColorSync, so all assets should be provided in the native device color space: sRGB.

色彩空间和 iOS：iOS 不支持 ColorSync，因此所有资产都应在本机设备色彩空间中提供：sRGB。

回答by Pablo V.

It's about color spaces.

这是关于色彩空间的。

Make sure you are picking the color from an sRGBcolor space, and replicating its RGBA values on Interface Builder by selecting sRGB IEC61966-2.1from the dropdown menu.

确保您从sRGB颜色空间中选择颜色，并通过sRGB IEC61966-2.1从下拉菜单中选择在 Interface Builder 上复制其 RGBA 值。

If you pick a color in one color space, and generate it in a different color space, it will look different, in spite of having replicated the same RGBA values.

如果您在一个颜色空间中选择一种颜色，并在不同的颜色空间中生成它，尽管复制了相同的 RGBA 值，它看起来会有所不同。

Also, have in mind that when you generate a color through code, using UIColor(red:green:blue:alpha:), it's generated on the sRGBcolor space by default. That's why it's so convenient to use this one (instead of Adobe RGB, P3, or any other). Besides, sRGBis the standard that's most used in the industry currently.

另外，请记住，当您通过代码生成颜色时，使用UIColor(red:green:blue:alpha:)，sRGB默认情况下它是在颜色空间上生成的。这就是为什么它是如此方便地使用这一个（而不是Adobe RGB，P3或任何其他）。此外，sRGB是目前业界使用最多的标准。

Fun fact: That UIColorconstructor I mentioned above creates colors in the sRGBspace since Xcode8. Before, that function used to create them within the Generic RGBspace instead. That's why it might cause confusions too.

有趣的事实：UIColor我上面提到的那个构造函数sRGB从 Xcode8 开始在空间中创建颜色。以前，该函数用于在Generic RGB空间内创建它们。这就是为什么它也可能引起混淆。

Here is a resource that extends on the topic: https://medium.com/@volbap/working-efficiently-with-colors-in-xcode-bc4c58b16f9a

这是扩展该主题的资源：https: //medium.com/@volbap/working-efficiently-with-colors-in-xcode-bc4c58b16f9a

回答by Dusan Juranovic

One more simple solution when working with image files in your app. Firstly, set your color space in Xcode to sRGB IEC61966-2.1 and apply your colors. Then, before you import any pictures to your app, match your images to sRGB IEC61966-2.1 profile using ColorSync Utility on Mac. Worked perfectly for me and my background now perfectly matches my imported images. Hope this helps someone.

在您的应用程序中处理图像文件时，一种更简单的解决方案。首先，在 Xcode 中将您的色彩空间设置为 sRGB IEC61966-2.1 并应用您的颜色。然后，在您将任何图片导入您的应用程序之前，使用 Mac 上的 ColorSync 实用程序将您的图像与 sRGB IEC61966-2.1 配置文件匹配。非常适合我，我的背景现在与我导入的图像完美匹配。希望这可以帮助某人。

回答by MrTJ

iPhone does use color space management so if you want a more "scientific" solution you can create your own color space for example with CGColorSpaceCreateCalibratedRGB. It's on Core graphics level though.

iPhone 确实使用色彩空间管理，因此如果您想要一个更“科学”的解决方案，您可以创建自己的色彩空间，例如使用CGColorSpaceCreateCalibratedRGB. 不过，它处于核心图形级别。

回答by MohyG

The better way to convert the RGB values to sRGB is using "Digital Color Meter" tool in mac, simply check the "Display in sRGB"

将 RGB 值转换为 sRGB 的更好方法是在 mac 中使用“数字色度计”工具，只需选中“以 sRGB 显示”即可

then use the sRGB values in your code instead of RGB

然后在代码中使用 sRGB 值而不是 RGB

using this tool you can find out generic RGB color and set it directly to xcode as RGB values

使用此工具，您可以找出通用 RGB 颜色并将其直接设置为 xcode 作为 RGB 值

回答by user3102878

I had a similar problem, especially with the greens in my project. My issue turned out to be that some of the assets I had were created in illustrator, and the color was set to CMYK instead of RGB. I'm not sure if this was your issue or not, but it might be helpful for those who stumble onto this question in the future. I changed the illustrator "Document color mode" to RGB and all is well.

我遇到了类似的问题，尤其是我项目中的果岭。我的问题原来是我的一些资产是在 illustrator 中创建的，并且颜色设置为 CMYK 而不是 RGB。我不确定这是否是您的问题，但它可能对将来偶然发现这个问题的人有所帮助。我将插图画家的“文档颜色模式”更改为 RGB，一切正常。

回答by S At

You can use this webPagefor different decks of colors in Xcode. for example Generic and Device Colors are different a little bit.

您可以将此网页用于 Xcode 中的不同颜色组。例如通用和设备颜色有点不同。