PDA

View Full Version : scrolling toolbar



seldon
3 Jan 2007, 4:50 AM
Hi, I have a layoutdialog with north and center regions. In the center region i added a toolbar. If however the content of the center region becomes too high, scrollbars appear (this is fine and what i want). The toolbar however is included in the scrollable area! This means that it scrolls out of screen. What am i doing wrong?



if (!editDlg){
editDlg = new YAHOO.ext.LayoutDialog("edit-element-dlg", {
autoTabs:true,
modal:true,
autoCreate: {
tag:'form',
cls: 'ydlg',
method:'post',
id:'edit-element-dlg',
onsubmit:'return false()'
},
title: 'Element bewerken',
width:750,
height:600,
shadow:true,
north: {
initialSize: 200,
minSize: 100,
maxSize: 500,
split:true,
autoScroll:false,
collapsible:true,
titlebar:true
},
center: {
titlebar: false,
autoScroll:true
}
});
editDlg.addKeyListener(27, editDlg.hide, editDlg);
saveBtn = editDlg.addButton('Opslaan', this.updateElement.createCallback(id), colorDlg);
editDlg.addButton('Sluiten', editDlg.hide, editDlg);

var ep = editDlg.getLayout().getEl().createChild({tag:'div', id:'edit-pane'});
ep.createChild({tag:'div', id:'edit-pane-tb'});
ep.createChild({tag:'div', id:'edit-pane-bd'});

var etb = new YAHOO.ext.Toolbar('edit-pane-tb');
etb.addButton({className: 'text-bold-btn', click: page.textBold});
etb.addButton({className: 'text-italic-btn', click: page.textItalic});
etb.addButton({className: 'text-color-btn', click: page.textColor});
etb.addButton({className: 'text-link-btn', click: page.textLink});

editDlg.getLayout().add('center', new YAHOO.ext.ContentPanel('edit-pane'), {toolbar: etb, resizeEl:'edit-pane-bd'});
editDlg.getLayout().add('north', new YAHOO.ext.ContentPanel('preview-pane'), {fitToFrame:true});
}

Animal
3 Jan 2007, 5:18 AM
I had to do this.

I ended up adding an inner layout to the center region, with the toolbar in the inner layout's south region, and the main content in the inner layout's center.

Animal
3 Jan 2007, 5:19 AM
Looking at your code, you don't have a south region. Put the toolbar in a south region.

seldon
3 Jan 2007, 5:48 AM
Ah yes, thnx! I just moved it into a south region and that works fine. Is the behaviour I encounterd a bug or is this the way jack wants it to behave? Anyway, thanks!

Animal
3 Jan 2007, 5:50 AM
Not a bug. A toolbar is just an element. If it's container gets scrolled, the toolbar element scrolls too - nothuing strange about that.

jack.slocum
3 Jan 2007, 7:33 AM
You could also turn autoScroll off for the center region and turn it on here:

new YAHOO.ext.ContentPanel('edit-pane'), {toolbar: etb, resizeEl:'edit-pane-bd', autoScroll:true});

Then the panel will scroll instead of the region and it always scrolls the resizeEl.