let us make technology work for you
    |
|
1 2 3 4 5 |
listeners: { el: { tap: myHandler, delegate: 'img' } |
Here myHandler fn event is assigned to the img as a delegate
Yes, it will!
All options like tabletStartupScreen, phoneStartupScreen, glossOnIcon etc that work for Ext.setup() will work with Ext.Application() or Ext.regApplication()
This is really comforting to know especially if, you are deciding on shifting to Sencha Touch MVC 
|
1 |
Ext.Logger.deprecate('Sample Message.'); |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
var panel = new Ext.Panel({ fullscreen: true, items: [ { xtype : 'video', x : 500, y : 250, width : 125, height : 120, url : "exmaple.mov", posterUrl: 'example.png' } ] }); |
var App = new Ext.Application({
name: ‘TestApp’,
useLoadMask: true,
launch: function () {
Ext.regModel(‘Contact’, {
fields: ['animation', 'extra']
});
var store = new Ext.data.JsonStore({
model : ‘Contact’,
data: [
{animation: 'Slide', extra: ''},
{animation: 'Slide', extra: 'Cover'},
{animation: 'Slide', extra: 'Reveal'},
{animation: 'Pop', extra: ''},
{animation: 'Flip', extra: ''},
{animation: 'Cube', extra: ''},
{animation: 'Fade', extra: ''}
]
});
var list = new Ext.List({
fullscreen: true,
itemTpl : ‘{animation} {extra}’,
listeners:{
itemtap: function( dv, index, item, e){
if ( index == 0 ) //Slide
{
TestApp.views.viewport.setActiveItem(1, { type: ‘slide’, direction: ‘left’ });
}
else if ( index == 1 ) //Slide Cover
{
TestApp.views.viewport.setActiveItem(1, { type: ‘slide’, cover: true });
}
else if ( index == 2 ) //Slide Reveal
{
TestApp.views.viewport.setActiveItem(1, { type: ‘slide’, reveal: true });
}
else if ( index == 3 ) //Pop
{
TestApp.views.viewport.setActiveItem(1, { type: ‘pop’, duration: 1000 });
}
else if ( index == 4 ) //Flip
{
TestApp.views.viewport.setActiveItem(1, { type: ‘flip’, duration: 600 });
}
else if ( index == 5 ) //Cube
{
TestApp.views.viewport.setActiveItem(1, { type: ‘cube’, duration: 600 });
}
else if ( index == 6 ) //Fade
{
TestApp.views.viewport.setActiveItem(1, { type: ‘fade’, duration: 1600 });
}
}
},
indexBar: true,
store: store
});
list.show();
TestApp.views.topToolbar = new Ext.Toolbar({
title: ‘Animation Example’,
items: [
{
text: 'Back',
ui: 'back',
handler: function ()
{
TestApp.views.viewport.setActiveItem(0, { type: 'slide', direction: 'right' });
}
}]
});
TestApp.views.viewport = new Ext.Panel({
fullscreen: true,
layout : ‘card’,
cardAnimation : ‘slide’,
items: [
list,
{
xtype: 'panel',
html:'Test Panel to demonstrate different Transitions.',
dockedItems: TestApp.views.topToolbar
}
]
});
}
});
var App = new Ext.Application({
name: ‘TestApp’,
useLoadMask: true,
launch: function () {
new Ext.form.FormPanel({
fullscreen: true,
title : ‘Testing Form Fields’,
items: [
{
xtype : 'sliderfield',
label : 'Volume',
value : 5,
minValue: 0,
maxValue: 10
},{
xtype : 'checkboxfield',
label : 'Checkbox',
checked : 'yes'
},{
xtype : 'togglefield',
label : 'Toggle'
},{
xtype : 'datepickerfield',
label : 'Date Picker Field'
},{
xtype : 'emailfield',
label : 'Email Field'
},{
xtype : 'spinnerfield',
label : 'Spinner Field'
},{
xtype : 'textfield',
label : 'Text Field'
},{
xtype : 'textareafield',
label : 'Text Area Field'
}],
});
}
});
var App = new Ext.Application({
name: ‘TestApp’,
useLoadMask: true,
launch: function () {
Ext.regModel(‘Contact’, {
fields: ['firstName', 'lastName']
});
var store = new Ext.data.JsonStore({
model : ‘Contact’,
data: [
{firstName: 'Tommy', lastName: 'Maintz'},
{firstName: 'Rob', lastName: 'Dougan'},
{firstName: 'Ed', lastName: 'Spencer'},
{firstName: 'Jamie', lastName: 'Avins'},
{firstName: 'Aaron', lastName: 'Conran'},
{firstName: 'Dave', lastName: 'Kaneda'},
{firstName: 'Michael', lastName: 'Mullany'},
{firstName: 'Abraham', lastName: 'Elias'},
{firstName: 'Jay', lastName: 'Robinson'}
]
});
var list = new Ext.List({
fullscreen: true,
itemTpl : ‘{firstName} {lastName}’,
indexBar: true,
store: store
});
list.show();
}
});
|
1 2 |
Ext.apply is a Sencha function to copy objects. Ext.apply(, ); |
You can have multiple source object names separated by comma.
Why do we need Ext.apply? Isn’t = enough? No, its not. Not only because you can merge and copy multiple sources to the destination there is also the big reason that, just a simple ‘=’ copies only the reference of the source object to the destination. Which means that if, you make any change to the destination object after copy it will affect the source copy too!
|
1 2 3 4 5 6 7 |
var panel = new Ext.Panel({ fullscreen: true, items: [{ xtype: 'map', useCurrentLocation: true }] }); |
source: sencha.com
syntax:
|
1 |
Ext.require({String/Array} expressions); |
