dojo - Cambio de tamaño Dgrid dentro de BorderContainer

dijit.layout border-container

Question

Tengo una dgrid dentro de un BorderContainer con "liveSplitters" activado (usando Dojo 1.8). La cuadrícula sale muy bien, pero cuando muevo el divisor entre la columna de la izquierda y la columna "líder" (que está dentro de la cuadrícula), la cuadrícula no cambia el tamaño correctamente. Sin embargo, si cambio el tamaño de la ventana un poco, entonces la cuadrícula vuelve a su tamaño correcto (es decir, completa el 100% del panel "principal" del BorderContainer).

Tengo dgrid configurado en 100% de ancho en CSS. ¿Hay algún modo en que necesite decirle a dgrid que actualice su tamaño después de que se mueva el divisor?

Answer 1

Como se señaló en los comentarios a la respuesta de @phusick, Dgrid cambia el tamaño correctamente si uso la mezcla DijitRegistry. También tuve algunos otros problemas de cambio de tamaño, pero tenían que ver con tener un ancho relativo establecido en el elemento en mi CSS (por ejemplo, 100%). Si elimino el tamaño, que no fue requerido por ContentPanel de todos modos, todos los elementos cambian de tamaño OK. El CSS había sido transferido de Dojo 1.5, que aparentemente no reaccionó de la misma manera a un Panel de Contenido que tenía un tamaño establecido en el CSS.

Answer 2

Mire este ejemplo que escribí respondiendo a otra pregunta relacionada con dgrid : http://jsfiddle.net/phusick/VjJBT/

La regla de CSS que está buscando es:

#grid {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: auto;
}

EDITAR: Pensé que podría haber sido un problema de la versión de dgrid , así que actualicé mi dgrid a la última versión 0.3.3 y creé una prueba para su problema: http://jsfiddle.net/phusick/5mHTS/ .

Bueno, no fue el problema de las versiones y tanto 0.3.1 como 0.3.3 funcionan bien al cambiar el tamaño de BorderContainer , pero solo en Chrome y Firefox. Reproduje el problema en IE9 y Opera 12.10:

La cuadrícula necesita invocar grid.resize() para cambiar el tamaño correctamente, lo que no ocurre en IE9 / Opera, al cambiar el tamaño de BorderContainer , pero siempre ocurre cuando BorderContainer tamaño de la ventana.

DijitRegistry soluciona el problema, porque los componentes de diseño, como BorderContainer y ContentPane , llaman a BorderContainer resize() en todos sus hijos dijit cuando se cambian de tamaño.

Entonces, o bien la subclase DijitRegistry o dojo/aspect escuchan el resize en ContentPane de la grilla y invocan a grid::resize() :

aspect.after(contentPane, "resize", function() {
    grid.resize();
});