author | fturovic <frank.turovich@nokia.com> |
Tue, 27 Jul 2010 15:28:19 -0500 | |
changeset 1704 | 24ac5a5cf80c |
parent 0 | fb279309251b |
permissions | -rw-r--r-- |
1704
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
2 |
<html> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
3 |
<head> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
4 |
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
5 |
<meta http-equiv="Content-Style-Type" content="text/css" /> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
6 |
<title>Create UI Designer Project to Test Custom Component</title> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
7 |
<link rel="StyleSheet" href="../../../../book.css" type="text/css"/> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
8 |
</head> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
9 |
<body bgcolor="#FFFFFF"> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
10 |
<h2>Tutorial: Vertical Label Component - Create UI Designer Project to Test Custom Component</h2> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
11 |
<p>Create a UIQ UI Designer project to test the VerticalLabel component. For example, select <strong>File > New > Symbian OS C++ Project</strong> and choose the "3.x GUI Application with UI Designer" template. Complete the wizard by filling in required fields and selecting appropriate options on each page of the project creation wizard.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
12 |
<p>Complete the last two pages of the wizard (Basic Settings and Project Directories) or click Finish at the UIQ UI Design Properties page to accept the default settings. The project will appear in the Project Explorer view. The graphical representation of the selected view (.uidesign file) will appear in the Carbide.c++ UI Design editor.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
13 |
<p>Select either the Vertical Label 1 or Vertical Label 2 component in the palette's Custom Controls group. Then click inside the empty UI design to place the new component inside the design.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
14 |
<p align="center"><img src="images/comp_palette_custom.png" alt="custom component" width="650" height="432"></p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
15 |
<p align="center"><strong>Figure 1. Custom Component Placed in UI Design</strong></p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
16 |
<p align="left" class="note"><strong>NOTE</strong> The example_verticallabel.rh and example_verticallabel.hrh files must be made accessible to the UI Designer as system includes.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
17 |
<p align="left">One way would be to copy these files into an existing "System includes" directory, such as the UIQ SDK's epoc32\include directory. Alternately, you could copy them into a "User includes" directory in your project (for example, inc) and add the directory as a system included directory in the MMP file.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
18 |
<p align="left">To add a directory, double-click on the .mmp file in your project (in group folder by default) to open the MMP editor. Click the Options tab and select the System includes folder in the Compiler Settings group. Click Add to browse to and add the directory containing your .rh and .hrh files. You can also click the "Add a system include path" link in the Overview page.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
19 |
<p align="left" class="note"><strong>NOTE</strong> In your source files the <> brackets denote a system include path, where quotes (" ") indicate a user include.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
20 |
<p align="center"><img src="../verticallabel_s60/images/include_dir.png" alt="compiler settings" width="298" height="302"></p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
21 |
<p align="center" class="figure">Figure 2 - Compiler Settings Group in MMP Editor</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
22 |
<p align="left">After placing the custom component into the UI design and saving the file, the example VerticalLabel.cpp file will be placed into the source folder (default is src) of your UI Designer project. The VerticalLabel.cpp file is used to draw the VerticalLabel component on your handheld device or in the emulator at runtime. For the VerticalLabel2 example, the associated JavaScript file is used to draw the custom component only at design time in the UI design. Therefore, if you design a visual component and wish to display your custom component in the UI Designer, then you must supply a JavaScript file that implements some predefined interfaces.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
23 |
<p align="left">You can save all files and build and run your UI Designer project in the emulator to view the component as part of the application.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
24 |
<p align="left">Remember to refresh your project (F5), refresh components (Components > Refresh Components), clean your project, or perform a Components > Force Save; as needed.</p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
25 |
<h5 align="left">Step 5 of 5</h5> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
26 |
<p align="left"><a href="verticallabel_tutorial_05.htm">Vertical Label Component XML Details</a></p> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
27 |
<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> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
28 |
</div> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
29 |
</body> |
24ac5a5cf80c
updated copyright dates and fixed some css issues
fturovic <frank.turovich@nokia.com>
parents:
0
diff
changeset
|
30 |
</html> |