Configure collapse control for panels

[alane]

I'm looking for a way to configure panels so that the collapse tool that appears with collapsible: true renders on the left hand side of the panel, before the title object.

There's a hacky way suggested under collapseFirst on Ext.panel.Panel's documentation page, but this can adversely impact render time if you're rendering a lot of collapsible panels at the same time.

Is there, or are there plans to develop, something like a collapseAlign configuration?

[mitchellsimoens]

If you want total control, you can add an item to the header, the header is a container using hbox layout.

[alane]

Would I need to replace the collapse tool with a tool of my own that mimics it, or could I specify the native items in the order I want them using the header configuration?

How would I do that? (Specify the order of the native items, like the title component, collapse tool, etc?)

header: {
collapsetool,
title
}

[alane]

..ok. I do believe I got it looking at Ext.panel.Header.

for anybody else looking into this, my solution was:

Ext.define('myapp.view.repeatingpanel', {
    extend: 'Ext.form.Panel',
    collapsible: true,
    header: {        
        listeners: {
          beforerender: function(header) {
              var collapsetool = header.tools[0];
              header.insert(0,collapsetool);
              //this.log('before render',header);
          },
      }
    }