This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision Next revision Both sides next revision | ||
built_in:lists [2015/03/07 18:39] octazid [Methods] |
built_in:lists [2016/08/02 19:17] administrator change method object name |
||
---|---|---|---|
Line 1: | Line 1: | ||
====== Lists ====== | ====== Lists ====== | ||
- | ===== Create | + | |
- | Create List objects using the CreateList method of the app object: | + | // |
+ | |||
+ | ===== Description | ||
+ | Create List objects using the **CreateList** method of the **[[built_in: | ||
< | < | ||
- | 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 is passed into your OnTouch callback function as a parameter every time an item is selected or long touched. | + | 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 is passed into your OnTouch callback function as a parameter every time an item is selected or long touched. |
+ | |||
+ | ====Example - Simple==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | lst = app.CreateList( " | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lst.SetOnLongTouch( lst_OnLongTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( "Item = " + item, " | ||
+ | } | ||
+ | function lst_OnLongTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( "Long Touch = " + item, " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | 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/ | ||
+ | |||
+ | ====Example - Gray on white==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | lst = app.CreateList( " | ||
+ | lst.SetTextColor( "# | ||
+ | lst.SetBackColor( "# | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | The List object also supports **multi-line** list items and can show certain types of **icon**. Multi-line items are created by dividing each list item up using the ':' | ||
+ | |||
+ | You can have one icon and up to three lines of text using the following formats: | ||
+ | |||
+ | * title : icon | ||
+ | * title : body : icon | ||
+ | * title : body : extra : icon | ||
+ | |||
+ | The available icons types are displayed using the following key words: | ||
+ | |||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | |||
+ | You can also use resource images or images from your sdcard instead of the keywords, for example:- " | ||
+ | |||
+ | |||
+ | ====Example - Title + Icon==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | var data = " | ||
+ | lst = app.CreateList( data, 0.8, 0.4 ); | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | ====Example - Title + Body==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | var data = "The Hobbit: | ||
+ | data += ", | ||
+ | lst = app.CreateList( data, 0.8, 0.4 ); | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | You can also create lists items that look like **buttons** by using one of the following options: | ||
+ | |||
+ | * " | ||
+ | * " | ||
+ | * " | ||
+ | |||
+ | ====Example - Orange Buttons==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | var data = " | ||
+ | lst = app.CreateList( data, 0.8, 0.8, " | ||
+ | lst.SetBackColor( "# | ||
+ | lst.SetPadding( 0.1, 0.1, 0.1, 0.1 ); | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | Or create lists with **Gradient** backgrounds like this: | ||
+ | |||
+ | ====Example - Gradient Background==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | var data = ""; | ||
+ | for( var i=1; i<=30; i++) | ||
+ | { | ||
+ | if( i>1 ) data += ","; | ||
+ | data += "Item " | ||
+ | } | ||
+ | lst = app.CreateList( data, 1, 1, " | ||
+ | lst.SetTextColor1( "# | ||
+ | lst.SetTextColor2( "# | ||
+ | lst.SetTextMargins( 0.04, 0, 0, 0 ); | ||
+ | lst.SetOnTouch( lst_OnTouch ); | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | |||
+ | function lst_OnTouch( item ) | ||
+ | { | ||
+ | app.ShowPopup( " | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | |||
+ | ====Example - HTML Font Color==== | ||
+ | <code javascript> | ||
+ | function OnStart() | ||
+ | { | ||
+ | // | ||
+ | lay = app.CreateLayout( " | ||
+ | |||
+ | // | ||
+ | var data = | ||
+ | "< | ||
+ | "< | ||
+ | "< | ||
+ | lst = app.CreateList( data, | ||
+ | lay.AddChild( lst ); | ||
+ | |||
+ | // | ||
+ | app.AddLayout( lay ); | ||
+ | } | ||
+ | </ | ||
+ | ---- | ||
===== Methods ===== | ===== Methods ===== | ||
Some controls use the same methods.\\ | Some controls use the same methods.\\ | ||
For examples of the **[[same methods]]** look here. | For examples of the **[[same methods]]** look here. | ||
- | ^Method ^Description ^ | + | ^ Method |
- | |ListView.AddItem( title, | + | | List.AddItem( title, |
- | |ListView.Destroy() | | | + | | List.GetAbsHeight() | |
- | |ListView.GetAbsHeight() | | | + | | List.GetAbsWidth() |
- | |ListView.GetAbsWidth() | | | + | | List.GetHeight() |
- | |ListView.GetHeight() | | | + | | List.GetItemByIndex( index ) |
- | |ListView.GetList( | + | | List.GetLength() |
- | |ListView.GetPosition() | | | + | | List.GetList( |
- | |ListView.GetTextSize( mode ) | | | + | | List.GetPosition() |
- | |ListView.GetType() | | | + | | List.GetTextSize( mode ) |
- | |ListView.GetVisibility() | | | + | | List.GetType() |
- | |ListView.GetWidth() | | | + | | List.GetVisibility() |
- | |ListView.Release() | | | + | | List.GetWidth() |
- | |ListView.RemoveItem( title ) | | | + | | List.InsertItem(index, |
- | |ListView.ScrollToItem( name,body ) | | | + | | List.RemoveAll() |
- | |ListView.SelectItem( title, | + | | List.RemoveItem( title ) | | |
- | |ListView.SelectItemByIndex( index, | + | | List.RemoveItemByIndex( index ) |
- | |ListView.SetBackColor( | + | | List.ScrollToItem( name,body ) |
- | |ListView.SetBackGradient( color1, | + | | List.ScrollToItemByIndex( index ) | | |
- | |ListView.SetBackGradientRadial( x, | + | | List.SelectItem( title, |
- | |ListView.SetBackground( imagefile, | + | | List.SelectItemByIndex( index, |
- | |ListView.SetDivider( height, | + | | List.SetBackColor( |
- | |ListView.SetEllipsize( mode ) | | | + | | List.SetBackGradient( color1, |
- | |ListView.SetEllipsize1( mode ) | | | + | | List.SetBackGradientRadial( x, |
- | |ListView.SetEllipsize2( mode ) | | | + | | List.SetBackground( imagefile, |
- | |ListView.SetFontFile( file ) | | | + | | List.SetDivider( height, |
- | |ListView.SetHiTextColor1( | + | | List.SetEllipsize( mode ) | |
- | |ListView.SetHiTextColor2( | + | | List.SetEllipsize1( mode ) |
- | |ListView.SetItem( title, | + | | List.SetEllipsize2( mode ) |
- | |ListView.SetList( list, | + | | List.SetFontFile( file ) |
- | |ListView.SetMargins( left, | + | | List.SetHiTextColor1( |
- | |ListView.SetOnLongTouch( callback ) |sets the function called when list is long-touched | | + | | List.SetHiTextColor2( |
- | |ListView.SetOnTouch( callback ) |sets the function called when list is touched | | + | | List.SetItem( title, |
- | |ListView.SetPadding( left, | + | | List.SetItemByIndex( index, |
- | |ListView.SetPosition( left, | + | | List.SetList( list, |
- | |ListView.SetScale( x,y ) | | | + | | List.SetMargins( left, |
- | |ListView.SetSize( width, | + | | List.SetOnLongTouch( callback ) | sets the function called when list is long-touched |
- | |ListView.SetTextColor( | + | | List.SetOnTouch( callback ) | sets the function called when list is touched |
- | |ListView.SetTextColor1( | + | | List.SetPadding( left, |
- | |ListView.SetTextColor2( | + | | List.SetPosition( left, |
- | |ListView.SetTextMargins( left, | + | | List.SetScale( x,y ) |
- | |ListView.SetTextShadow( radius, | + | | List.SetSize( width, |
- | |ListView.SetTextShadow1( radius, | + | | List.SetTextColor( |
- | |ListView.SetTextShadow2( radius, | + | | List.SetTextColor1( |
- | |ListView.SetTextSize( size,mode ) | | | + | | List.SetTextColor2( |
- | |ListView.SetVisibility( ShowHide ) | | | + | | List.SetTextMargins( left, |
+ | | List.SetTextShadow( radius, | ||
+ | | List.SetTextShadow1( radius, | ||
+ | | List.SetTextShadow2( radius, | ||
+ | | List.SetTextSize( size,mode ) | | ||
+ | | List.SetVisibility( ShowHide ) | ||
- | ===== Options ===== | + | ===== Available |
- | ^Option ^Description ^ | + | ^ Option |
- | |FontAwesome|Use this to display Icons \\ from this inbuilt font| | + | | AlumButton |
+ | | FontAwesome | ||
+ | | GreenButton | ||
+ | | Html | Use this option to display html formated code | | ||
+ | | OrangeButton | ||
+ | | WhiteGrad | ||
===== Sample callbacks ===== | ===== Sample callbacks ===== | ||
+ | |||
<code javascript> | <code javascript> | ||
function lst_OnTouch( title, body, type, index ) | function lst_OnTouch( title, body, type, index ) | ||
Line 66: | Line 271: | ||
} | } | ||
</ | </ | ||
+ | |||
<code javascript> | <code javascript> | ||
function lst_OnLongTouch( title, body, type, index ) | function lst_OnLongTouch( title, body, type, index ) | ||
Line 72: | Line 278: | ||
} | } | ||
</ | </ | ||
+ | |||
<code javascript> | <code javascript> | ||
function lst_OnTouch( title, body, type, index ) | function lst_OnTouch( title, body, type, index ) | ||
Line 79: | Line 286: | ||
} | } | ||
</ | </ | ||
+ | |||
<code javascript> | <code javascript> | ||
function lst_OnTouch( item ) | function lst_OnTouch( item ) | ||
Line 86: | Line 294: | ||
} | } | ||
</ | </ | ||
+ | |||
+ | ---- | ||
+ |