Générer une extension de UIColor en fonction de votre xcassets.

Joey Barbier
3 min readOct 11, 2020

--

Le catalogue d’asset, vous permet d’enregistrer les différentes couleurs utilisées dans votre application, il permet aussi de vous simplifier le travail sur la mise en place du mode sombre.

Library — La solution native d’Xcode.

xCode — Library

Xcode permet d’inclure vos assets, notamment les couleurs, dans votre code, mais personnellement je ne trouve pas le rendu très lisible, d’autant plus que le mode sombre n’est pas géré.

ColorA correspond à : colorLiteral(red: 0, green: 0.9769999981, blue: 0, alpha: 1)

Cette problématique m’a poussé à réaliser ce script, nous allons voir comment le mettre en place dans votre projet.

Pour commencer : Un xcassets bien organisé.

Afin d’obtenir une extension d’UIColor de qualité vos couleurs devront respecter un pattern, le caractère “underscore” permet de séparer les différentes catégories.

Par exemple :
`button_favorite_nomal` donnera `UIColor.Custom.button.favorite.normal`

Un peu de Ruby

Le script a été réalisé en Ruby, il est relativement simple à comprendre. Vous devez placer celui-ci à la racine de votre projet (Le lien du script est à la fin de l’article).

Dans un premier temps, pensez à modifier les chemins d’accès.

  • “pathColor” correspond à votre dossier de couleur présent dans votre xcassets.
  • “pathUIColorFile” correspond à votre fichier Swift, fichier qui faudra créer au préalable afin de l’avoir à disposition dans votre projet xCode.

Le script fonctionne en 3 parties :

  • Dans un premier temps il va supprimer puis recréer votre fichier.
  • Lire votre “pathColor” afin de le convertir en Hash (Array en Ruby).
  • Utiliser le tableau précédemment créé pour le convertir en Enum.

Exemple d’utilisation

Dans le cas d’un bouton favoris par exemple, celui-ci change de couleur en fonction de son statut.

L’extension d’UIColor nous permet de récupérer rapidement nos couleurs afin de modifier la “tint color” du bouton et ce sans nous préoccuper du mode sombre.

Bonus

Si vous n’avez pas envie de lancer le script à la main, vous pouvez lancer celui-ci lors de votre build phase, pour cela rien de bien compliqué.

Rendez-vous dans votre target, Build Phase, + , New Run Script Phase.

Et vous ajoutez la ligne : `./color.rb`

Récupérer le script

Enjoy !

N’hésitez pas à m’envoyer vos retours !

--

--

Joey Barbier

Lead Tech iOS. Consultant et développeur pour applications iOS en remote depuis Lille. https://www.joeybarbier.com