top

CAPH.WUI.WIDGET.NAVIGATOR

Navigator represents a container of a set of widgets, It can add sets of strings and images. It will convert each set of string and image to a label and image widget. The set of label and image widget will be used as a tag. User can create a tool-bar easily by using this widget. And the tag has 4 display modes, which look beautiful. Navigator can manage the size and the position of tags in it. The main APIs of navigator are 'addCls', 'addEvent', 'addItem', 'fireEvent', 'getCurIndex', 'getItem', 'removeCls', 'removeEvent', 'removeItemByIndex', 'select', 'setCurIndex.'


Constructor

Navigator

Description
The constructor of navigator component, in order to create navigator object.
Parameters
option Objectsome options is the same with arguments of parent class view, other differences as below * frame.labelCls : (Sting) * frame.interval : (Number-unit) pixel * frame.maxSize : (Number) * frame.cycle : (Boolean) * focusHighlightCLs : (String) * focusClsTargetWidth : (Number-unit) pixel * focusClsTargetHeight : (Number-unit) pixel
Emulator SupportY
SDK ConstraintNone
Example
var Navigator  = caph.wui.widget.Navigator;  
var options = {
        'frame' : {
            'width' : 450, 
            'height' : 90, 
             'focusHighlightCLs' : ' ',
        'focusClsTargetWidth' : 90,
        'focusClsTargetHeight' : 90
        },
        'center_position' : {
            'x' : 1000,
            'y' : 50,
            'z' : 1,
        },
       'labelCls' : 'bb',
            'maxSize' : 5,
            'cycle' : false,
            'interval':10
        }; 
var navigator = new Navigator(options);  
var state0 = { 'normal' : './img/social_normal.png', 'focus' : './img/social_focus2.png', 'select' : './img/social_selected.png', 'hover' : './img/social_over.png', 'text' : 'Social' };
.......
// Let's say index and stateOptions are given
// In case that the number of parameters is 2, the second parameter is considered as stateOptions
navigator.addItem( 0, state0 );
......

Methods

fireEvent

Description
Make the index of tap to fire the type of event. if the tap have the type of monitor, the type of monitor function will be invoked.
Parameters
■index
  - Number
  - The index of the navigator, it should between 0  
  - maxSize       
■type 
  - Event type
  - It can be one of the follow one 
e.g.{'click','focus','mouseover','mouseout','keydown','keyup'}"
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var navigator = new Navigator();  
navigator.fireEvent(3, "click");

select

Description
Select an item of the navigator component by index, the item will be selected status
Parameters
■index
  - Number
  - The index of item of navigator, which will be selected
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var navigator = new Navigator();  
navigator.select(3);

getItem

Description
Get the item of the navigator by index
Parameters
■index
  - Number
  - The index of item of the navigator
Return■Object
  - The item on the index
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var navigator = new Navigator(); 
navigator.getItem(3);

removeEvent

Description
Remove the type of monitor from the tap. The event function couldn't be invoked when the type event is fired.
Parameters
■index
  - Number
  - The index of the navigator, it should between 0  
  - maxSize       
■type
  - Event type
  - It can be one of the follow one 
e.g.{'click','focus','mouseover','mouseout','keydown','keyup'}"
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var navigator = new Navigator(); 
navigator.removeEvent(3, "click");

clone

Description
Creates and returns clone object from current object, the cloned object will have the same properties and same methods with the current object.
Parameters
■Void
Return■Object
  - The cloned object.
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
var obj = widget.clone();

equals

Description
Compares the contents of two objects using strict equality, objects are considered equal if they both have the same set of properties and the values of those properties are equal.
Parameters
■Object
  - Object
  - The object which wants to compare with current object.
Return■Boolean
  - Indicates whether the two objects are equal
  - true :  if they are equal, return true. 
  - false : if they aren't equal, return false.
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
var obj = widget.clone();
var isequal = obj.equals(widget);

getSize

Description
Returns the size of the container. If user don't set the size, it will return {'width':0,'height':7}.
Parameters
■Void
Return■size
  - Object
  - The size of box with width and height, their units are pixel(px). e.g. {width:100, height:100}.
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
var size = widget.getSize();

setWidth

Description
Set the width of the widget, the width of the widget will be changed after user invokes the function.
Parameters
■width
  - Number
  - The width of label, the unit is pixel(px), if null or negative, the value will be ignore, e.g. 300.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
widget.setWidth(300);

setHeight

Description
Set the height of widget, the height of widget will be changed after user invokes the function.
Parameters
■height
  - Number
  - pixel : The height of label, the unit is pixel(px), if null or negative, the value will be ignore, e.g. 100.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
widget.setHeight(300);

setSize

Description
Sets the width and height of the widget, the widget's size would be changed by right called.
Parameters
■width
  - Number
  - pixel : The height of label, if null or negative, the value will be ignore. The unit is pixel(px), e.g. 10.     
■height
  - Number
  - pixel : The height of label, if null or negative, the value will be ignore. The unit is pixel(px), e.g. 10.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator(); 
widget.setSize(300, 600);

addEvent

Description
Add a monitor to the index of the tap. The event function will be invoke when the type event is fired.
Parameters
■index
  - Number
  - The index of the navigator, it should between 0  
  - maxSize       
■type
  - Event type
  - It can be one of the follow one 
e.g.{'click','focus','mouseover','mouseout','keydown','keyup'}"       
■event
  - Function
  - User event function.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator();  
navigator.addEvent(3, "click", function(){});

removeItemByIndex

Description
Remove the item from the navigator component by index, the item will disappear from the screen, after this function is called
Parameters
■index
  - Number
  - The index of item of the navigator, it should between 0 and maxSize
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator();  
navigator.removeItemByIndex(3);

setCenterPosition

Description
Set the center position of Navigator
Parameters
■x
  -Number
  - The x coordinate
■y
  - Number
  - The y coordinate
■z
  - Number
  - The y coordinate
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator();  
navigator.setCenterPosition(300, 300, 0);

setCurIndex

Description
Set the current active item by the index of the navigator, the index item in the navigator will be activated
Parameters
■index
  - Number 
  - The index item of navigator which will be activated, the index should between 0 and maxSize
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator();  
navigator.setCurIndex(3);

addCls

Description
Add specified css class for the label in the tag, which is convert from the input text, when css is added successfully, new style will apply on the
Parameters
■cls
  - String  
  - The class name for the current widget
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator(); 
navigator.addCls('mid');

getItems

Description
Return all widgets in current navigator. It is a map, with key and value, key is index of widget, value is widget object.
Parameters
■Void
Return■map
  - Object 
  - Map : a map which include all items in navigator.
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator(); 
navigator.getItems();

removeCls

Description
Remove specific css class from the label in the tag, which is convert from the input text, when css is removed successfully, the specified css style will be removed from the widget
Parameters
■cls
  - String 
  - The class name of the navigator.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator(); 
navigator.removeCls(cls);

getCurIndex

Description
Return index of current active item. If the current active item is not in the navigator, it will return null
Parameters
■Void
Return■Number 
  - Number
  - integer type, The Index of Current active item.
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator; 
var navigator = new Navigator(); 
var index = navigator.getCurIndex ();

addItem

Description
Add an image and text to navigator component as an index item and display at the position by the index
Parameters
■index
  - Number
  - index The index of item be added to the navigator, it should between 0 and maxSize   
■url (Optional)
  - String
  - url The path of image, the image will be loaded to the index item.  In case that the number of parameters is 2, the second parameter is considered as stateOptions
■text (Optional)
  - String
  - This is the string which user want to display in the text area of item of the navigator
 ■steteOptions (Optional)
  - Object
  - The different statuses of current item of navigator  e.g. {'focus':'testUrl1', 'select':'testUrl2', 'hover':'testUrl3'}.
     In case that the number of parameters is 2, the second parameter is considered as stateOptions
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;
var navigator = new Navigator(); 
        var state0 = {
            'normal' : './img/social_normal.png',
            'focus' : './img/social_focus2.png',
            'select' : './img/social_selected.png',
            'hover' : './img/social_over.png',
            'text' : 'Social'
        };
// Let's say index and stateOptions are given
// In case that the number of parameters is 2, the second parameter is considered as stateOptions
navigator.addItem( 0, state0 );

getDomEl

Description
Returns the DOM element of the widget, note that the dom node to be found actually needs to exist (be rendered and etc).
Parameters
■Void
Return■DOM
  - A document element
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 

var dom = widget.getDomEl();  //call the view getDomEl method

blur

Description
Blurs the view object, to make the view object lose focus. And if the widget has registered blur listeners, it will be invoked.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 

widget.blur();  //call the view blur method

focus

Description
Focuses the view object, to make the view object receive focus. And if the widget has registered focus listeners, it will be invoked.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 

widget.focus();  //call the view focus method

setAbsolutePosition

Description
Sets absolute position of widget in the screen, x,y value of the top and left of the screen is (0,14).
Parameters
■x
  -Number
  - The x coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel.      
■y
  - Number
  - The y coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel
■z
  - Number
  - The y coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 

widget.setAbsolutePosition(x, y, z);  //call the view setAbsolutePosition method

addEventListener

Description
Appends an event handler to the widget.
Parameters
■type
  - String
  - Listener type of event, including {'onfocus', 'onblur', 'onkeydown'.
   * 'onfocus'- the type of function will be called when the widget is focused.
   * 'onblur'- the type of function will be called when the widget is blurred.
   * 'onkeydown'  - the type of fun}
■function
  - Function
  - the callback to add
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);

widget.addEventListener('resize', function(){  //listen the resize event
           //console.log(widget.id + ' >>>>>>>>>>>>>>>>>>>>> resized');
});

click

Description
Clicks the view object, to make the view object selected. And if the widget has registered click listeners, it will be invoked.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);

widget.click();  //call the view click method

destroy

Description
Destroys the widget itself, the widget will disappear.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);

widget.destroy();  //call the view destroy method

removeEventListener

Description
Removes all listeners according the type and event.
Parameters
■type
  - String
  - Listener type of event, including {'onfocus', 'onblur', 'onkeydown'.
   * 'onfocus'- the type of function will be called when the widget is focused.
   * 'onblur'- the type of function will be called when the widget is blurred.
   * 'onkeydown'  - the type of fun}
■func
  - Function
  - The callback to remove
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);

widget.removeEventListener('click', function(){  //listen the remove event
});

render

Description
Renders the current widget to parent widget. Specify an existing widget that this widget will be rendered into. Widget will display in the parent widget and become a child node of the parent widget.
Parameters
■object
  - Json object 
  - An existing widget that this widget will be rendered on.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);

widget.render(uicontext);

getChildNodes

Description
Returns child nodes of current widget, child nodes are those widgets rendered on the current widget.
Parameters
■Void
Return■Array
  - The child nodes list.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
var childList = widget.getChildNodes();

getCType

Description
Returns the type of the widget, every widget have different ctype, it is identification of widget.
Parameters
■Void
Return■String
  - CType is widget or animation type, including 'BasicObject','view','UIContext','button', 'box','label','radio','spinner',        'navigator','panel','carousel','colortag','image','checkbox','gridwidget',       'popup','progressbar','dropdown','indicator','highlighthelper','coverflow',    'listwidget','book','domcontainer','imagegallery','sidebar','fade','transfer','rotate','scale','bounce','flip','syncanim','advancedbox'."
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
var ctype = widget.getCtype();

getParentNode

Description
Returns parent node of current widget, parent node is the widget which the current widget will render on it.
Parameters
■Void
Return■Array
  - The parent node.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
var parentList = widget.getParentNodes();

getCenterPosition

Description
Returns center position of the widget in the parent widget, include x,y,z coordinate. x,y value of the top and left of the parent widget is (0,14).
Parameters
■Void
Return■Object
  -  Position object, including x, y, z value.                           
   * x : (Number) The x coordinate of 3D object, the unit is pixels.       
   * y : (Number) The y coordinate of 3D object, the unit is pixels.       
   * z : (Number) The z coordinate defines the order of overlap widgets, if z is too big, the widget will display above. e.g. 0, 1, 2 and etc.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
var pos = widget.getCenterPosition()

getRotation

Description
Returns widget rotation property.
Parameters
■Void
Return■Object
  - Position object, including x, y, z value.                        
   * The x coordinate for rotate position of the view.  
   * The y coordinate for rotate position of the view.       
   * The z coordinate for rotate position of the view.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
var rot = widget.getRotation();

hide

Description
Hide the color tag when current uicontext is home uicontext or detail uicontext.
Parameters
■duration (Optional)
  - Number
  - (ms) If duration is greater than 0, view will have a fade animation to hide itself, the unit is milliseconds.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.hide();

show

Description
Shows the widget to make it visible on the screen, registered listeners for this are invoked, if duration is greater than 13, that is there exists a fade animation, registered listeners will be invoked during the animation.
Parameters
■duration (Optional)
  - Number
  - (ms) If greater than 0, view will have a fade animation to show itself, the unit is milliseconds.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.hide();
widget.show();

disable

Description
Disables widget, to make widget not be able to be operated by user.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.hide();
widget.show();
widget.disable();

enable

Description
Enables widget, to make widget be able to be operated by user.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.hide();
widget.show();
widget.enable();

disableHighLight

Description
Removes the highlight effect on a widget, but still remain the focus effect.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.render(uicontext);
widget.disableHighLight();

enableHighLight

Description
Recovers the highlight effect on a widget.
Parameters
■Void
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.render(uicontext);
widget.enableHighLight();

isEnable

Description
Returns the current status of widget, return true when the widget is activated.
Parameters
■Void
Return■Boolean
  - true : if enabled
  - false : otherwise
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.render(uicontext);
widget.hide();
widget.show();
widget.disable();
widget.enable();

var rc = widget.isEnable();

isVisible

Description
Indicates whether the widget is visible or not.
Parameters
■Void
Return■Boolean
  - true  : if visible
  - false : otherwise
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.render(uicontext);
widget.hide();
widget.show();
widget.disable();
widget.enable();

var rc = widget.isVisible();

setOpacity

Description
Sets opacity of the widget.
Parameters
■opacity
  - Number
  - Opacity value of the widget, range from 0.0 to 1.0. e.g. 0.5.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.setOpacity(0.5);

getOpacity

Description
Returns opacity of the widget.
Parameters
■Void
Return■Number
  - Opacity value of the widget,range from 0.0 to 1.0. e.g. 0.5.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.setOpacity(0.5);
var op = widget.getOpacity();

setRotation

Description
Sets rotation of widget , rotation angle of the widget will be changed.
Parameters
■x
  - Number 
  - The x coordinate for rotate position of the view.  
■y
  - Number
  - The y coordinate for rotate position of the view.       
■z
  - Number
  - The z coordinate for rotate position of the view.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.setRotation(Math.PI/4, 0, 0);

setScale

Description
Sets widget scale value, the display width and height of widget will be changed, but the value of height and width properties will not be modified.
Parameters
■x
  - Number 
  - The x coordinate for scale position of the view.  
■y
  - Number
  - The y coordinate for scale position of the view.       
■z
  - Number
  - The z coordinate for scale position of the view.
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.setScale(0.8, 0.5, 0);

getScale

Description
Returns the scale value of the widget, including x, y, z coordinates.
Parameters
■Void
Return■Object
  - Position object, including x, y, z value.                        
   * The x coordinate for scale position of the view.  
   * The y coordinate for scale position of the view.       
   * The z coordinate for scale position of the view.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setCenterPosition (info.x, info.y, info.z);
widget.setScale(0.8, 0.5, 0);
var scalePosValue = widget.getScale();

setPosition

Description
Sets top and left position of widget in the parent widget.
Parameters
■x
  - Number
  - The x coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel.       
■y
  - Number
  - The y coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel   
■z
  - Number
  - The z coordinate, can be a percentage or a number ,like 50% or 500,50% means 50% of the screen, the unit is pixel
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setPosition (info.x, info.y, info.z);

getPosition

Description
Returns top and left position of widget in the parent widget, include x,y,z coordinate. x,y value of the top and left of the parent widget is (0,14).
Parameters
■Void
Return■Object
  - Position object, including x, y, z value.                        
   * x : (Number) The x coordinate of 3D object, the unit is pixels.       
   * y : (Number) The y coordinate of 3D object, the unit is pixels.       
   * z : (Number) The z coordinate defines the order of overlap widgets, if z is too big, the widget will display above. e.g. 0, 1, 2 and etc.
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  

var info = {'x': 300, 'y': 300 ,'z':0, width:300, height:300};
var uicontext   = new UIContext();
var widget = new Navigator(); 
widget.setPosition (info.x, info.y, info.z);
var pos = widget.getPosition();

setOptions

Description
Sets some properties of the widget that are in the constructor method. The widget will be changed when these properties are set. For example, if width property is set, the width of widget will changed.
Parameters
■options (Optional)
  - Object
   * id : (Number) The id of widget.       
   * name : (String) The name of widget.}
Return■Void
Emulator SupportY
SDK Constraintnone
Example
var UIContext = caph.wui.widget.UIContext;
var Navigator  = caph.wui.widget.Navigator;  
var widget = new Navigator();
var options = {
 id:'testID',   
 name:'testName', 
 cls:'testCls',  
 frame:{
     width:100,
     height:100
  }
 };
widget.setOptions(options);

Navigator

Description
(Constructor) The constructor of navigator component, in order to create navigator object.
Parameters
■options 
  - Object 
  - some options is the same with arguments of parent class view, other differences as below   
   * frame.labelCls : (Sting)
   * frame.interval : (Number-unit) pixel
   * frame.maxSize : (Number)
   * frame.cycle : (Boolean)
   * focusHighlightCLs : (String)
   * focusClsTargetWidth : (Number-unit) pixel
   * focusClsTargetHeight : (Number-unit) pixel
Return■Object
  - Navigator
  - An instance of Navigator
Emulator SupportY
SDK Constraintnone
Example
var Navigator  = caph.wui.widget.Navigator;  
var options = {
        'frame' : {
            'width' : 450, 
            'height' : 90, 
             'focusHighlightCLs' : ' ',
        'focusClsTargetWidth' : 90,
        'focusClsTargetHeight' : 90
        },
        'center_position' : {
            'x' : 1000,
            'y' : 50,
            'z' : 1,
        },
       'labelCls' : 'bb',
            'maxSize' : 5,
            'cycle' : false,
            'interval':10
        }; 
var navigator = new Navigator(options);  
var state0 = { 'normal' : './img/social_normal.png', 'focus' : './img/social_focus2.png', 'select' : './img/social_selected.png', 'hover' : './img/social_over.png', 'text' : 'Social' };
.......
// Let's say index and stateOptions are given
// In case that the number of parameters is 2, the second parameter is considered as stateOptions
navigator.addItem( 0, state0 );
......