The background color of the UINavigationBar configured from the storyboard is different from the color specified by the code

My application will be available only for iOS 8 , and I am working with XCode 6.1.1 .

If I set the color through the storyboard (setting the Bar Tint attribute in the Navigation Bar section)

Color required:

56 186 145

I used Basic Encoding Utilities to get floating values โ€‹โ€‹of my color.

By code:

 let backgroundColor = UIColor(red: 0.22, green: 0.729, blue: 0.569, alpha: 1.0) self.navigationController!.navigationBar.barTintColor = backgroundColor self.navigationController!.navigationBar.translucent = false 

The color set in the storyboard is the same as the original RGB.

  • By code: enter image description here
  • By storyboard: enter image description here

EDIT

I tried using let backgroundColor = UIColor(red: 0.255, green: 0.769, blue: 0.635, alpha: 1.0) and rgb from the storyboard: 65 196 162 based on @siejkowski's comment, but I get the following colors:

  • By code: enter image description here

  • By storyboard: enter image description here

Why?

+6
source share
3 answers

There are two reasons for the color differences that you observed.

  • The value set in the Storyboard is RGB (sRGB IEC61966-2.1) , and when encoding UIColor by RGB, it returns RGB (common RGB) .

Therefore, when you change the color from the storyboard, the values โ€‹โ€‹are different for RBG types. To get the exact type of change in the RGB RGB Sliders value in the storyboard.

Click on the settings icon that will exactly match the RGB Sliders option. A pop-up menu will appear - select the option General RGB .

enter image description here

Now you can observe an image whose value for RGB

 56 186 145 

now changes to

 49 175 126 

Thus, these are the values โ€‹โ€‹of the desired code.

  1. The problem with Roundup:

In the code, you pass rounding values โ€‹โ€‹for the parameter, for example, in the line below

 UIColor(red: 0.22, green: 0.729, blue: 0.569, alpha: 1.0) 

Thus, he will make a small change per pixel in the color code. I suggest you divide these values โ€‹โ€‹by 255 and leave a rounded calculation for the compiler. This will give you the desired color accuracy.

So, now for the new values, the update code will be:

 let backgroundColor = UIColor(red: 49.0/255.0, green: 175.0/255.0, blue: 126.0/255.0, alpha: 1.0) self.navigationController!.navigationBar.barTintColor = backgroundColor self.navigationController!.navigationBar.isTranslucent = false 
+12
source

You see the difference in colors because they are set using the same RGB values, but in different color spaces.

UIColor, when set from code, interprets the values โ€‹โ€‹as from sRGB, as indicated here: https://developer.apple.com/library/ios/documentation/GraphicsImaging/Reference/CGColorSpace/index.html

However, the Storyboard coloring picker seems to use its own RGB values โ€‹โ€‹by default. You need to convert between them. You can do this in the Storyboard coloring picker by clicking the settings icon next to the RGB slider list picker on the Colors tab. Native RGB values โ€‹โ€‹are set according to the color settings of the LCD, and sRGB values โ€‹โ€‹are under sRGB, of course.

enter image description here

When you do this, it seems that 56 186 145 in the RGB native space 73,186,141 is in the sRGB space. So your code should be:

 let backgroundColor = UIColor(red: 0.286, green:0.729, blue:0.553, alpha:1.0) 
+2
source

When I try to change the color space to GenericRGB from the storyboard / interface builder (on Xcode 6.3.2), Xcode does not save the change. Therefore, if I open the color again from the interface constructor, the color space will always be sRGBIEC61966-2.1.

So, I came up with another solution that might be useful for someone else: with the default Mac OS application โ€œColorSync Utilityโ€ I used the Calculator and converted my color value from GenericRGB to sRGBIEC61966-2.1. Then I set the translated value to the interface builder, and I got the same result as its programmed programming!

Color Sync screenshot

+1
source

Source: https://habr.com/ru/post/980095/


All Articles