PDA

View Full Version : Panel with nested List



bsander
4 Aug 2010, 11:22 PM
Hi,

i'm new at Sencha. How can i dock a nested List in a 2 column Design on the left column?


var panel = new Ext.Panel({
fullscreen: true,
layout: 'fit',
items: [{ html: 'Content', style: 'background-color: #333;',
dockedItems: [{
dock: 'left', width: 250, html: '<ol><li>Montag</li><li>Dienstag</li></ol>', style: 'background-color: #CCC;', scroll: 'vertical'
}]
}]
});


var nList = new Ext.NestedList({
title: 'test',
fullscreen: true,
items: [{
text: 'Rubble'
}, {
text: 'Test'
}, {
text: 'Trible'
}]
});


thx

evant
5 Aug 2010, 12:22 AM
Ext.setup({
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon: false,
onReady: function() {
var nestedList = new Ext.NestedList({
width: 200,
items: [{
text: 'Option A',
items: [{
text: 'Option A.1',
customAttribute: 123,
items: [{
text: 'Option A.1.a'
},{
text: 'Option A.1.b'
}]
},{
text: 'Option A.2',
customAttribute: 389
}]
},{
text: 'Option B',
items: [{
text: 'Option B.1',
customAttribute: 233
},{
text: 'Option B.2',
customAttribute: 2390
}]
},{
text: 'Option C',
items: [{
text: 'Option C.1',
customAttribute: 903
},{
text: 'Option C.2',
customAttribute: 77
}]
}]
});

new Ext.Panel({
fullscreen: true,
layout: {
type: 'hbox',
align: 'stretch'
},
items: [nestedList, {
flex: 1,
html: 'Other stuff'
}]
});
}
});

bsander
5 Aug 2010, 9:23 AM
thx.

Some other Questions. Which is the best way to learn Sencha Touch. Should i first learn ExtJS? Or just read the Sencha API Doc? Are there any MVC Tutorials with Sencha? I dont find anyone.

kevchuey
5 Aug 2010, 3:45 PM
I wouldn't learn ExtJS first. I also recently started using Sencha Touch (without knowing ExtJS) and did a bunch of ExtJS tutorials. The problem is that not everything in ExtJS is in Touch.

I would immediately bookmark the Sencha Touch welcome page (http://www.sencha.com/deploy/touch/). There's a getting started page and a bunch of examples right on there. Once you go through the getting started guide, I would definitely get used to poking around the kitchen sink (or any other example) and popping open the html and javascript source to see how things work.

kevchuey
5 Aug 2010, 3:45 PM
I wouldn't learn ExtJS first. I also recently started using Sencha Touch (without knowing ExtJS) and did a bunch of ExtJS tutorials. The problem is that not everything in ExtJS is in Touch.

I would immediately bookmark the Sencha Touch welcome page (http://www.sencha.com/deploy/touch/). There's a getting started page and a bunch of examples right on there. Once you go through the getting started guide, I would definitely get used to poking around the kitchen sink (or any other example) and popping open the html and javascript source to see how things work.