Ext JS Dashboard Layout and maximize/minimize panels

3
votes

I'm attaching a picture with the mock up that I'm trying to develop with Ext JS. I'm using a Border layout, and then a Dashboard for the central part, however I see some limitations on it:

  1. Panels in the dashboard don't have minimize or maximize button. How can I implement this?
  2. How can I make a panel/part to use several columns by default. Right now with the columnIndex you can only specify one of the columns, but what if I want to use several columns, or 100% width, like in the 'functional positions' panel?.

I would appreciate any suggestion, even other alternatives without using a dashboard.

Mock up

1
extjslayoutdashboardextjs5panels
What about border layout instead? - CD..
Yes, I'm using border layout for the page, and then a dashboard in the 'center' to display 5 panels: Functional positions, identification, localisation, relations and 3d view. The problems are in the center. I will edit the question to clarify - Hernan Diaz
What do you want to happen with the screen space released from minimizing your panels? Should the other panels extend to take it or what? Depending on that, you may choose hbox layout with custom tools in the header which would resize the panels to zero (i.e. "minimize") and let the others take the space, OR just go web desktop layout. - Greendrake

1 Answers

2
votes
  1. you can add more tools to a panel.

  2. carefully read the docs for columnWidths, for your example this could be:

    columnWidths: [ 1, 0.4, 0.6, 0.5, 0.5 ]

creating 3 diffent rows