Namespaces
Variants
Actions

Editing theme high lights in carbide.ui

Jump to: navigation, search
Article Metadata

Article
Created: kamalakshan (30 Jun 2009)
Last edited: hamishwillee (08 May 2012)

Overview

This article describes on how to make use of carbide.ui and Adobe Illustrator to edit vector elements. The process is explained by editing Grid Highlight component.

The components are either divided in to single element or nine element components. In S60 you can find 3 element component also.

6-30-2009 8-01-08 PM.png

To start with you can download the S60 Theme Design Highlight Template provided.

6-30-2009 8-05-14 PM.png

The above provided screen shot is of Grid Highlight from the template, opened in a vector editor. You can hide and unhide the layers as shown above. After opening this you may design it according to your creative requirements.

Edit the elements of the template and keep it ready, once you are satisfied with the changes made save it and keep it open in the editor.

6-30-2009 8-19-34 PM.png

Now open the theme you would like to make the changes to inside carbide.ui.

6-30-2009 8-11-28 PM.png

Go to highlights tab, where you will find grid highlights. Once you click on it, you will find the component view updated to show the Grid elements. the Grid Highlight element in this case is divided in to nine parts.

6-30-2009 8-12-54 PM.png

Some components can be either 9-piece bitmap graphics or individual single-piece svg graphics. The 9-piece component consists of four corner graphics, four side graphics, and a center graphic. You can design the corner graphics individually. The side and center area graphics can be tiled or equal the maximum size of the component area.

Switch to carbide.ui Right click on any element and open it in the external editor (Adobe Illustrator).

Copy the prepared image by dragging and dropping inside the vector editor tool.

6-30-2009 8-28-19 PM.png

You need to replace the element opened from carbide,ui, with the new one you have designed. Alternatively, you can edit it using the vector editor (Illustrator).

After editing or replacing it save the file. And now when you check the edited piece in the carbide.ui, you will find that the changes are reflected in the theme.

6-30-2009 8-36-27 PM.png

You will have to repeat this process for all the nine elements and then save it.

You can follow the above process for editing any other component also.


References

This page was last modified on 8 May 2012, at 09:26.
91 page views in the last 30 days.
Nokia Developer aims to help you create apps and publish them so you can connect with users around the world.

京ICP备05048969号  © Copyright Nokia 2013 All rights reserved