Color Literal behaves inconsistently in Xcode 13.2.1

Color Literal used to be recognized in the Xcode IDE. As soon as you type "color", the autosuggestion dropdown shows "UIColor Color Literal" and you can simply select it without typing anything more. A small color square would appear where you can visually select your desired color.

There appears to no longer be any shortcut/ autosuggestion for color literal. Now, I have to type "#colorLiteral(" (yes, pound sign, uppercase L, and the left parenthesis) in order for the little color square to appear where I can select my color.

In addition, its behavior is inconsistent. That little color square appears only if I do something like:

If the color literals are arguments in a function call, the little color square doesn't appear anymore. Instead, the full-blown RGB function appears, in which case it is not possible to bring up the color selection popup to visually select your desired color:

Has this bug been reported to Apple, or is there an alternate way to work with color literals in Xcode 13.2.1?

Accepted Reply

I came up with a workaround

Create code snippets for color literal and image literal like below

Color

#colorLiteral()

https://i.stack.imgur.com/JmBGG.png

And add completion shortcut as you want, Example: colorLiteral. Do same for Image literal

Image

#imageLiteral()

https://i.stack.imgur.com/BtitW.png

And add completion shortcut as you want. Call those completion shortcuts in your code to get color and image literals.

https://i.stack.imgur.com/dkPsx.png https://i.stack.imgur.com/SViOq.png

  • That works, but it is still not possible to insert a color literal as an argument in a function. Example:

    setGradientBackground(topColor: QQQ, bottomColor: YYY)

    You can't put a color literal in place of QQQ and YYY. It forces it to:

    setGradientBackground(topColor: colorLiteral(red: 0.4745098054, green: 0.8392156959, blue: 0.9764705896, alpha: 1), bottomColor: colorLiteral(red: 0.5546397567, green: 0.3071874082, blue: 0.007406672928, alpha: 1))

     

Add a Comment

Replies

I came up with a workaround

Create code snippets for color literal and image literal like below

Color

#colorLiteral()

https://i.stack.imgur.com/JmBGG.png

And add completion shortcut as you want, Example: colorLiteral. Do same for Image literal

Image

#imageLiteral()

https://i.stack.imgur.com/BtitW.png

And add completion shortcut as you want. Call those completion shortcuts in your code to get color and image literals.

https://i.stack.imgur.com/dkPsx.png https://i.stack.imgur.com/SViOq.png

  • That works, but it is still not possible to insert a color literal as an argument in a function. Example:

    setGradientBackground(topColor: QQQ, bottomColor: YYY)

    You can't put a color literal in place of QQQ and YYY. It forces it to:

    setGradientBackground(topColor: colorLiteral(red: 0.4745098054, green: 0.8392156959, blue: 0.9764705896, alpha: 1), bottomColor: colorLiteral(red: 0.5546397567, green: 0.3071874082, blue: 0.007406672928, alpha: 1))

     

Add a Comment