Appsplash'16 session (4) "Ui components & controller"

Post on 12-Apr-2017

129 views 2 download

Transcript of Appsplash'16 session (4) "Ui components & controller"

Slides made by / Abd El-star Ahmed & Hany Mohamed

The task

scrollable viewIndex.xml :

<Alloy> <Window> <ScrollableView id=‘list’> <View id=‘background’> <ImageView id=‘avatar’/> <label>Welcome in SCCI</label> </View> </ScrollableView> </Window></Alloy>

scrollable viewIndex.tss :

‘#list’:{

height : Ti.UI.FILL,

width : Ti.UI.SIZE,

layout : ’Horizontal’ ,

backgroundColor : ‘blue’

}

}

Controller file

variable

var X=5 ;

function

function Say_welcome () { alert(“ Welcome”);}

controllerControlli

ng objectiv

es

<ImageView id=“avatar” />$.avatar.left=5;

The animatio

n

animationVar animation= Ti.UI.createAnimation({ . });

height : Ti.UI.FILL,

width : Ti.UI.SIZE,

right : “20%” ,

left : 5 ,

top : “50 px” ,

bottom : “2 cm” ,}

repeat : 6, (number)

delay : 1000 , ms ( 1000 ms= 1 s)

duration : 1000 , ms

autoreverse : true / false ,

transform : Ti.UI.2DMatrix ,

The 2d matrix

2d matrixVar Matrix= Ti.UI.create2DMatrix ( );

Matrix.translate { (X,Y);(from X, from Y, to X, to Y);

Matrix.rotate { (angle);(from angle, to angle);

Matrix.scale (X,Y);

Let’s code

The recap

Ui & controller

Controller

var function $

Animation 2D Matrix

Scrollable view

Any question

?

Thank you …