Create basic horizontal list in Sencha
I am fairly new to Sencha touch and finding it difficult to create a horizontal list. I can successfully create my list vertically passing in some inline data but cannot seem to figure out the way to present my data horizontally. I have tried searching through the forums and still cannot seem to resolve. Can someone please help me resolve this simple yet very frustrating issue for me.
My Steps so far:
1 Create a data model
Ext.regModel('Alphabet', {
fields: ['Letter']
});
2 // Create Data Store
App.ListStore = new Ext.data.Store({
model: 'Alphabet',
data: [
{Letter: 'A'},
{Letter: 'b'},
{Letter: 'c'},
{Letter: 'd'},
{Letter: 'e'},
]
});
3 Create List
App.ListPanel = new Ext.List ({
store: App.ListStore,
itemTpl: '<div class = "Alphabet">{Letter}</div>'
});
4 // Bind list to panel
App.ListContainer = new Ext.Panel({
layout:{
type: 开发者_如何学C'hbox',
pack: 'center',
align: 'center'
},
items: [App.ListPanel]
});
5 // Dock panel to root panel
Thanks in Advance
Add this to App.ListContainer
scroll: {direction: 'horizontal',useIndicators: false}
Update:
Try docking this to the root panel
App.ListPanel = new Ext.Toolbar ({
defaults:{ ui: 'plain'},
items: [
{text: 'ItemList_A'},
{text: 'ItemList_b'},
{text: 'ItemList_c'},
{text: 'ItemList_d'},
{text: 'ItemList_e'},
{text: 'ItemList_A'},
{text: 'ItemList_b'},
],
dock: 'bottom',
scroll: {
direction: 'horizontal',
useIndicators: false
},
layout: {
pack: 'center'
}
});
The solution to my problem was to add the items to a new panel using a hbox layout.
I don't think EXT.LIST was designed to be able to handle my issue.
精彩评论