ILUMISOFT - Get Started

This tutorial will show you how to get started with Color Control. By following a few simple steps, you will learn how to use the Color Control editor window, create new project colors, edit existing projects colors and how to apply your custom colors to UI components.

STEP 1: PREPARE YOUR PROJECT

Open Unity Hub and create a new Unity Project with the name "Color Control Tutorial"
When the project has been created, open the Asset Store and import Color Control

STEP 2: OPEN THE COLOR CONTROL EDITOR WINDOW

Click the Tools section in the menu bar and select Color Control. This will open the Color Control editor window.

STEP 3: CREATE A CUSTOM COLOR

In the Color Control editor window, click on New Color and type "Background". As soon as you press Enter, the asset will be created and appear in the editor window.

STEP 4: CREATE AN UI IMAGE

Right click in the scene hierarchy, select UI->Image and rename it to Background Image
Adjust the Rect Transform of the image to fit the full screen

FINAL STEP: APPLY THE COLOR

Let's apply the Background color to an UI Image:

Add the Image Color component to the Game Object of the image and select the Background color
When you now change the Background color in the Color Control editor window, it will be automatically applied to the Image component.

CONCLUSION

Congratulations! You have learnt how to create a custom project color and how to apply it to an image component. To apply colors to Text components or Sprite Renderers, use the Text Color or Sprite Renderer Color components.

FAQ

When are project colors exactly applied by Image Color, Text Color and Sprite Renderer Color to their target components?

When working in the editor, all color components are executed in edit mode and update their targets color at a frequent interval, to reflect changes made via the Color Control editor window. In a build, color components only apply the color in the OnEnable method.

Is it possible to write my own components to apply project colors to other components than Image, Text or SpriteRenderer?

Absolutely, just inherate from the ColorComponent base class and override the ApplyColor method. To see an example, check out the CameraColor script in the Example package shipped with Color Control.

Can we check out the source code of Color Control and adjust it if necessary?

Yes! While Color Control is shipped as a dll file, in order to keep your project clean and hide some internal methods used in the editor parts of the package, the source code is still part of the package (see the source.zip file). It can be examined or adjusted if your team wants to get a deeper insight or wants to add or change something.

Google Sites

Report abuse