×
Namespaces

Variants
Actions

Archived:Flash Lite UI Kit

From Nokia Developer Wiki
Jump to: navigation, search

Archived.pngArchived: This article is archived because it is not considered relevant for third-party developers creating commercial solutions today. If you think this article is still relevant, let us know by adding the template {{ReviewForRemovalFromArchive|user=~~~~|write your reason here}}.

We do not recommend Flash Lite development on current Nokia devices, and all Flash Lite articles on this wiki have been archived. Flash Lite has been removed from all Nokia Asha and recent Series 40 devices and has limited support on Symbian. Specific information for Nokia Belle is available in Flash Lite on Nokia Browser for Symbian. Specific information for OLD Series 40 and Symbian devices is available in the Flash Lite Developers Library.

Article Metadata
Article
Created: mfabiop (01 Feb 2009)
Last edited: hamishwillee (18 Jun 2013)


Contents

Introduction

There are many screen resolutions for mobile devices, it makes the development of graphic user interface more difficult than should be. Many languages provide a lot of components for build graphic interfaces easily, like Java ME, Python for Symbian or WRT. A set of components is a Kit for development of graphic user interfaces.

In Flash Lite there is no Kit for the development of graphic user interfaces. Normally the developers use the Flash native components, but they are made for web or desktop and they are so much heavy for mobile devices.

In this article is proposed a Flash Lite Kit for development of graphic user interfaces. The following will show the basic features of this kit, the download of the first beta release and how to use it.

Basic Features

  • It has to work in many screen resolutions.
  • Details as color, font and format must be configurable.

Basic Components

In the first beta version of the Kit two basic components were developed (TextBox and Button); they are the only components available in this version.

Future Releases

In future releases more and more components will be added and existing components will be upgraded. This version is just a proof-of-concept of the Kit.

How to Install and Use it

The Kit consists of a set of Action Script classes that must be imported in a Flash Lite project (It can be downloaded ()here ). After being imported, the use of them is very simple, like shown below:

import flkit.components.ui.*;
 
//Creates two instances of TextBox UI component of the Flash Lite UI Kit
var tx1:TextBox = new TextBox("tx1","FirstName","");
var tx2:TextBox = new TextBox("tx2","SurName","");
 
//Creates two instances of Button UI component of the Flash Lite UI Kit
var bt1:Button = new Button("bt1","send");
var bt2:Button = new Button("bt2","load");
 
//Defines the event when a click on button SAVE occurs
bt1.onClick = function(){
trace("click on button SAVE");
}
 
//Defines the event when a click on button LOAD occurs
bt2.onClick = function(){
trace("click on button LOAD");
}
 
//Creates a new UIManager, this is the base class of the Flash Lite UI Kit. All UI components must be in this instance.
//The constructor parameter is the MovieClip where all components will be added.
var uiManager:UIManager = new UIManager(_root);
 
//Adding all UI components
uiManager.addUIComponent(tx1);
uiManager.addUIComponent(tx2);
uiManager.addUIComponent(bt1);
uiManager.addUIComponent(bt2);
 
//Builds the graphic interface
uiManager.build();

This code produces the same effect in two different screen resolutions, as shown in the pictures below.

Example-e71.jpgExample-n96.jpg

Contributions

The code is Open Source and any contribution will be appreciated.

This page was last modified on 18 June 2013, at 07:20.
72 page views in the last 30 days.
×