Ext JS 4.1 - Как динамически отображать изображение?

Мне нужно повторно отобразить изображение (Ext.Image) после некоторых событий. Я нашел функцию doComponentLayout, но она у меня, к сожалению, не сработала.

Как я могу повторно отобразить изображение, которое является элементом формы?


extjs extjs4 extjs-mvc extjs4.1
person talha06    schedule 11.11.2012    source источник
comment
Что именно вы подразумеваете под повторным рендерингом? Механизм компоновки довольно хорошо отслеживает вещи и отображает их в версии 4.1, если только что-то не отключено в ваших конфигурациях макета в родительском контейнере. Не могли бы вы опубликовать код оскорбительного изображения и более точное описание того, какое поведение вы хотите при повторном рендеринге? Нужно ли реагировать на изменения размера других компонентов или окна? Или что-то еще происходит?   -  person Stephen Tremaine    schedule 12.11.2012
comment
Это изображение, и есть ползунок для изменения его яркости и контрастности. Всякий раз, когда ползунок изменяется, изображение должно немедленно обновляться. (Операции обработки изображения выполняются на сервере с помощью значений яркости и контрастности, выбранных пользователем)   -  person talha06    schedule 12.11.2012

Ответы (3)


arrow_upward
3
arrow_downward

Существует распространенный метод добавления ? и случайной строки в исходный код изображения. Сервер игнорирует эту часть src, но браузер считает, что вы устанавливаете новый src.

var originalSrc = 'http://example.com/someimg.png';
var antiCachePart = (new Date()).getTime();
var newSrc = originalSrc + '?dc=' + antiCachePart;
// now newSrc is equal to something like "http://example.com/someimg.png?dc=1352748617627"
img.setSrc(newSrc);
person Molecular Man    schedule 12.11.2012
comment
Большое спасибо за вашу помощь, эта проблема решена .. кстати, нет необходимости менять URL-адрес src, это можно сделать, установив тот же URL-адрес. img.setSrc(img.src); достаточно. - person talha06; 13.11.2012

arrow_upward
2
arrow_downward

В документации Ext.Img сказано:

var changingImage = Ext.create('Ext.Img', {
    src: 'http://www.sencha.com/img/20110215-feat-html5.png',
    renderTo: Ext.getBody()
});

// change the src of the image programmatically
changingImage.setSrc('http://www.sencha.com/img/20110215-feat-perf.png');
person chepike    schedule 12.11.2012
comment
Большое спасибо за вашу помощь, эта проблема решена .. кстати, нет необходимости менять URL-адрес src, это можно сделать, установив тот же URL-адрес. img.setSrc(img.src); достаточно. - person talha06; 13.11.2012

arrow_upward
0
arrow_downward

Я никогда раньше не работал с Ext.Image, но обычно, когда нам нужно перерендерить изображение, мы делаем одно из двух: уничтожаем и воссоздаем компонент или помещаем изображение внутрь DataView или другого компонента, управляемого шаблоном. и перерисовать шаблон.

Я полагаю, что doComponentLayout применяет только размер, он не будет регенерировать компонент. Если вы не можете поместить изображение внутрь компонента, управляемого XTemplate, то уничтожение и воссоздание компонента, вероятно, будет лучшим вариантом.

person Telgin    schedule 11.11.2012