Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries over the next few weeks. Thanks for all your past and future contributions.

Using SVG icons in Avkon tabs

From Wiki
Jump to: navigation, search
Article Metadata
Created: User:Technical writer 2 (30 Nov 2006)
Last edited: hamishwillee (13 Aug 2012)


Using SVG icons in Avkon tabs


It is possible to display custom SVG icons in the Avkon tab group for each tab. There are some restrictions on the SVG files that can be used with tabs, these are described below.


CAknTabGroup::AddTabL() can be used for creating a tab with a custom SVG icon. However, only the mask (i.e., alpha or transparency) layer of the icon is used for generating the icon, rest of the image data is ignored.
As an example, consider a white SVG with the following line: a black ellipse with a white background (fill):
<ellipse fill="#FFFFFF" stroke="#000000" stroke-width="5" cx="25" cy="25" rx="20" ry="20"/>
In order to get an ellipse displayed on the tab, the fill parameter must be modified:
<ellipse fill="none" stroke="#000000" stroke-width="5" cx="25" cy="25" rx="20" ry="20"/>.
After the replacement, the mask of the image will have a white ellipse on a black background. When the SVG is used as the tab icon, the ellipse is displayed in black color and the rest of the image becomes transparent.
Note: It is not possible to draw colored SVG in the TAB, as the mask is always used for generating the icon.

This page was last modified on 13 August 2012, at 06:36.
45 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.


Thank you!

We appreciate your feedback.