carbidesdk/com.nokia.carbide.cpp.sdk.doc.user/html/CustomComponents/tutorials/verticallabel_s60/verticallabel_tutorial.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>Tutorial: Vertical Label Component</title>
<link rel="StyleSheet" href="../../../../book.css" type="text/css"/>
<style type="text/css">
<!--
.style1 {font-size: 12px}
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<h2>Tutorial: Vertical Label Component</h2>
<p>This tutorial explains how to take an example custom component called VerticalLabel and use it in an S60 UI Designer project. The Vertical Label is an example of a custom S60 visual control component. It is similar to the standard Label component, but draws the label text vertically. The tutorial consists of two versions of the Vertical Label component. VerticalLabel1 is the bare minimum needed to make a functioning component. VerticalLabel2 adds JavaScript to render the component when used within a design in the UI Designer.</p>
<p>Information is provided that explains how to add the component to the UI Designer Palette followed by an examination of how the component was created. This tutorial explains what is relevant to the example. Please refer to the component XML schema documentation for all the XML element details. Detailed documentation on the schema can be found in the reference section under <a href="../../../reference/component.xsd doc/index.html">Component XSD Description</a>.</p>
<p> The example files for the Vertical Label tutorials are provided in a zip file in the s60 components plugin located at: <code class="code">{Carbide_Installation_Dir}\plugins\com.nokia.sdt.series60.componentlibrary_<i>version</i>\templates\tutorials\example_components\example_components.zip</code>, where <i>version</i> is the current version of UI Designer. Refer to the example files while reading this tutorial.</p>
<p>The goal of this tutorial focuses on the following steps:</p>
<ul>
<li>Step 1: <a href="verticallabel_tutorial_01.htm">Create Project for Example Component Files</a></li>
<li>Step 2: <a href="verticallabel_tutorial_02.htm">Enable Components Menu</a></li>
<li>Step 3: <a href="verticallabel_tutorial_03.htm">Add Custom Component to UI Designer</a></li>
<li>Step 4: <a href="verticallabel_tutorial_04.htm">Create UI Designer Project to Test Custom Component</a></li>
<li>Step 5: <a href="verticallabel_tutorial_05.htm">Vertical Label Component XML Details</a></li>
</ul>
<div id="footer">Copyright © 2010 Nokia Corporation and/or its subsidiary(-ies). All rights reserved. <br>License: <a href="http://www.eclipse.org/legal/epl-v10.html">http://www.eclipse.org/legal/epl-v10.html</a></div>
</div>
</body>
</html>