Create List objects using the CreateList method of the app object:
lst = app.CreateList( list, width, height, options );
Use the SetOnTouch and SetOnLongTouch methods of the List object to set the name of a function you want to be called when
a list item is selected. The selected item title, body, type and index are passed into your OnTouch callback function as parameters every time an item is
selected or long touched.
Example - Simple
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
lst = app.CreateList( "Fred,Bill,Jim", 0.8, 0.4 );
lst.SetOnTouch( lst_OnTouch );
lst.SetOnLongTouch( lst_OnLongTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Item = " + title + ", Index = " + index, "Short" );
}
function lst_OnLongTouch( title, body, type, index )
{
app.ShowPopup( "Long Touch Item = " + title + ", Index = " + index, "Short" );
}
You can change the look of a List using the SetBackColor and SetTextColor functions on the list object. You can also set a
background image/pattern or background gradient for the List using the SetBackground and SetBackGradient functions.
Example - Gray on White
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
lst = app.CreateList( "Fred,Bill,Jim", 0.8, 0.4 );
lst.SetTextColor( "#ff666666" );
lst.SetBackColor( "#ffffffff" );
lst.SetOnTouch( lst_OnTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Touched Item = " + title );
}
The List object also supports multi-line list items and can show icons. Multi-line items
are created by dividing each list item up using the ':' (colon) character. If you need to use a colon character
in your item text then use this character sequence: ^c^.
You can have one icon and some body text using the following formats:
title : icon
title : body : icon
You can specify your own icon file for example "Img/MyIcon.png", or one of the special built-in icons using the following key words:
"folder", "audiofolder", "photofolder", "videofolder", "audio", "photo", "video" and "playlist".
Example - Title + Icon
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
var data = "Folder:folder,Audio:audio,Photo:photo,Video:video";
lst = app.CreateList( data, 0.8, 0.4 );
lst.SetOnTouch( lst_OnTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Touched Item = " + title );
}
Example - Title + Body
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
var data = "The Hobbit:Author^c^ J.R.R. Tolkien:null";
data += ",Watership Down:Author^c^ Richard Adams:null";
lst = app.CreateList( data, 0.8, 0.4 );
lst.SetOnTouch( lst_OnTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Touched Item = " + title );
}
You can also create lists items that look like buttons by using one of the following options:
"AlumButton", "GreenButton", "OrangeButton".
Example - Orange Buttons
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
var data = "Button 1,Button 2,Button 3,Button 4";
lst = app.CreateList( data, 0.8, 0.8, "OrangeButton" );
lst.SetBackColor( "#ffffff" );
lst.SetPadding( 0.1, 0.1, 0.1, 0.1 );
lst.SetOnTouch( lst_OnTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Touched Item = " + title );
}
Or create lists with Gradient backgrounds like this:-
Example - Gradient Background
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
var data = "";
for( var i=1; i<=30; i++)
{
if( i>1 ) data += ",";
data += "Item "+i+":Details for item "+i+":null";
}
lst = app.CreateList( data, 1, 1, "WhiteGrad" );
lst.SetTextColor1( "#ff555558");
lst.SetTextColor2( "#ff555558" );
lst.SetTextMargins( 0.04, 0, 0, 0 );
lst.SetOnTouch( lst_OnTouch );
lay.AddChild( lst );
app.AddLayout( lay );
}
function lst_OnTouch( title, body, type, index )
{
app.ShowPopup( "Touched Item = " + title );
}
See 'CreateList for more informations and a complete function list