¿Se pueden colocar los portales y los portlets ExtJS como elementos CSS habituales?

Question

Me gustaría hacer que un portal y sus portlets extjs se ajusten dentro de un diseño de ancho fijo. En este momento parecen tomar el 100% del ancho, y los elementos parecen tener estilos en línea aplicados para dar un ancho máximo, y trucos como especificar un estilo de "ancho: 50%" para los elementos del portal no parecen hacer nada.

¿Cómo se pueden dimensionar y posicionar los portlets, y hay alguna forma de aplicar la habilidad de posicionamiento de CSS habitual? El HTML generado como aparece en Inspect Element tiene un estilo en línea que especifica un ancho en píxeles, que superará lo que ponga en una hoja de estilo.

Me gustaría que se muestre un portal como un elemento de bloque normal con posicionamiento relativo dentro de una página. ¿Es eso posible, y si no, cuáles son mis mejores opciones?

Answer 1

Los portlets se gestionan mediante un diseño, que es lo que establece los tamaños, responde a la vista de la vista, etc. Tendría que modificar el diseño existente o crear su propio diseño personalizado para hacer esto (o de lo contrario construir su propio portal que no se basa en el ejemplo existente).

Answer 2

Parece que tengo la respuesta. Sobrescribe la definición de ventana gráfica para personalizar el renderizado a una etiqueta DIV. Aquí está mi código:

Ext.override(Ext.container.Viewport, {
initComponent : function() {
    var me = this,
        html = Ext.fly(document.body.parentNode),
        el;
    me.callParent(arguments);
    html.addCls(Ext.baseCSSPrefix + 'viewport');
    me.el = el = 'dashboard';
    el.setHeight = Ext.emptyFn;
    el.setWidth = Ext.emptyFn;
    el.setSize = Ext.emptyFn;
    me.allowDomMove = false;
    Ext.EventManager.onWindowResize(me.fireResize, me);
    me.renderTo = me.el;
    me.height = Ext.Element.getViewportHeight() - 70;
}});

donde yo.el es la identificación de elementos render.