View Full Version : Real world examples.

9 Aug 2010, 7:50 AM
Why is it so difficult to implement multiple examples on a single page. For example. I want to create a homepage that uses the carousel and html content. This ideal page will also have the overlay component on a toolbar. You can scroll up and down on this page, as will as in the modal overlay. This is painful to accomplish (assuming it is something that can be accomplished). I cannot create a toolbar with an overlay button (centered), and a carousel (maybe 250px high), and then just regular html content below, and be able to slide the page up and down to show everything. I have been banging my head on the desk for weeks trying to accomplish this. What am I missing?

So the Feature Request is: Include a section in the examples (not kitchen sink), that uses multiple components and maybe a readme or instruction set on how it is accomplished. I love the strength of Sencha and its abilities, but working to combine components is really difficult. Post examples people, let me see what others are doing.

11 Aug 2010, 7:28 PM
I did my best to understand what you are looking for. If this isn't it, post a mock up drawing of what exactly you want, and which sections need to stay put when scrolling. Almost any layout you can think up is doable and not very complicated to cook up. Just think of the page as a series of cards, and each card is a series of components, and take the time to understand dockedItems. You should be able to lay out anything you'd like with those few simple methods.

var htmlContent = '';
for (var x = 0; x < 50; x++)
htmlContent += x + '<br/>';
Ext.setup({ onReady: function () {
new Ext.Panel({
fullscreen: true,
scroll: 'vertical',
items: [
xtype: 'toolbar',
layout: { pack: 'center' },
items: [
xtype: 'button',
text: 'CenterButton'
xtype: 'carousel',
height: 250,
items: [{ html: 'a' }, { html: 'b'}]
{ html: htmlContent}]