Могут ли порталы и портлеты ExtJS позиционироваться как обычные элементы CSS?
Я хотел бы, чтобы портал и его портлеты ExtJS вписывались в макет фиксированной ширины. Прямо сейчас они, кажется, занимают 100% ширины, и элементы, кажется, применяют встроенные стили, чтобы дать максимальную ширину, и трюки, такие как указание стиля "width: 50%" для элементов портала, похоже, ничего не делают.
Как можно определить размеры и расположение портлетов, и есть ли способ применить обычный навык позиционирования CSS? Сгенерированный HTML в том виде, в каком он отображается в Inspect Element, имеет встроенный стиль, задающий ширину в пикселях, который превзойдет все, что я положил в таблицу стилей.
Я хотел бы, чтобы портал отображался как обычный элемент блока с относительным позиционированием на странице. Возможно ли это, и если нет, каковы мои следующие лучшие варианты?
2 ответа
Управление портлетами осуществляется с помощью макета, который задает размеры, реагирует на изменение размеров области просмотра и т. Д. Для этого вам придется изменить существующий макет или создать свой собственный макет (или создать собственный портал, не основанный на существующий пример).
Кажется, у меня есть ответ. Переписать определение области просмотра для настройки рендеринга в тег div. Вот мой код:
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;
}});
где me.el - идентификатор элемента рендера.