Categories: S60 | UI | SVG

This page was last modified 01:20, 15 July 2008.

From Forum Nokia Wiki

(SVG)

(SVG in S60)

SVG offers several benefits:

Scalability: SVG's can be scaled without losing clarity hence should be preferred to bmp's. Offers scalable (resolution independent) graphics format which reduces graphics design work since same graphic could be scaled to different sizes without sacrificing quality. There is no ROM space hit when going from 176x208 to double resolution, with current bitmap fonts bitmaps could take 4 times more ROM in double resolution .

Flexibility:The content can be modified dynamically, same application with one set of graphics could be used in phones with different resolutions .

Efficiency: As a text-based format, SVG graphics can be compressed better than bitmap images (such as JPEG), resulting in a smaller file size.

Use SVG files only as .mif files due to following reasons:

(1) SVG files are XML text files. To optimize the memory occupied by the SVG files they are converted into a binary format by the MIFCONV tool. The .mif file contains the binary version of the SVG file and not the text version. The memory occupied is reduced to large extent.

(2) The SVG binary format also optimizes performance. XML files are parsed and binary format which is close to the rendering engine is generated as a part the MIFCONV process itself. This reduces loading time of a SVG file as it does not involve XML parsing again.

Tools

Tool to generate MIF file:

A new tool, MifConv, is used for generating MIF (multi image file) files. This will convert source SVG-T files (which are XML) into a more efficient format and package them inside the MIF file.(MIFCONV)

Knowledge Base

The following are the links to the Knowledge Base which includes both Technical Solutions and Known Issues:

• KIS000630 - Some SVG icons are clipped on Nokia N91 and Nokia 5500 Sport
• KIS000398 - SVG rendering problems caused by missing viewBox attribute
• TSS000510 - Using SVG icons in Avkon tabs
• KIJ000820 - Icon creation panics if out of bound
• TSS000295 - How to compress SVG files
• KIS000531 - Compatibility problem with binary-encoded SVG images

Example-Project

The following example describes how an SVG file used as an Application icon as well as resized to display as part of Listbox Item:

(Example-Project)