Загрузка изображения GWT (onLoad) для холста

#html #gwt #canvas #image-loading

#HTML #gwt #холст #загрузка изображения

Вопрос:

Без использования какой-либо библиотеки загрузки изображений я загружаю и обрабатываю изображения, как показано ниже:

 ImageGenerator(){
  for(int i=0;i<100;i  ){
      ImageProcess( data-i , i );
  }
}

ImageProcess( String data , int i ){
  final Image img = new Image(data);
  img.setVisible(false);
  RootPanel.get().add(img);
  GWT.log( "image "   i );
  img.addLoadHandler(new LoadHandler() {
      @Override
      public void onLoad(LoadEvent event) {
          GWT.log( "onload "   i   " "   img.getWidth() );
          ImageElement data = ImageElement.as(img.getElement());
          RootPanel.get().remove(img);
          obj.setData(data);
          ..obj processing
      }
  });
}
  

Результат :

 image 1;
image 2;
image 3;
..
image 98;
image 99; <-- finish for loop
onload 1; <-- start loading image
onload 2;
onload 3;
..
onload 98;
onload 99;
  

Но я надеюсь, что это выглядит так:

 image 1;  <-- generate image and load image step by step
onload 1;
image 2;
onload 2;
image 3;
onload 3;
..
image 98;
onload 98;
image 99;
onload 99;
  

Я знаю, что после того, как я присвоил значение img.src, изображение становится недоступным мгновенно. Оно должно быть загружено первым. Элемент img запустит событие onload, как только изображение будет загружено. Я пытаюсь добавить таймер и поместить изображение в другой элемент DOM. Это не работает.

Мои вопросы: как вызвать немедленную загрузку элемента изображения? или пусть ImageProcess подождет завершения загрузки?

Ответ №1:

  RootPanel.get().add(img);
  

С помощью этой строки вы принудительно загружаете изображение напрямую.
Я думаю, ваша проблема в том, что цикл завершен до того, как с сервера было передано хотя бы одно изображение — поэтому вы сначала видите выходные данные изображения, а затем выходные данные onload.

Теперь я не уверен, почему для вас так важно добавить изображение, выполнить его загрузку, добавить следующее изображение и так далее…

Но я уверен, что этого можно легко достичь, написав метод, который добавляет изображение в DOM, и в его обработчике onload вы снова вызываете метод для следующего изображения. И так далее, пока не будет достигнут критерий остановки.

Приветствую, Стефан

Комментарии:

1. 1. Я загружаю изображения с локального диска, а не с сервера. механизм загрузки — это собственный javascript. Это очень быстро, и его трудно разделить. Мне приходится обрабатывать каждое изображение по одному, иначе ему не хватит памяти. 2. Я пытаюсь перенести «native javascript ImageGenerator ()» в gwt, чтобы протестировать вашу идею, большое вам спасибо.

2. Я пытаюсь реализовать вашу идею. Но это вызывает утечки памяти. Есть ли какой-либо механизм ожидания в GWT?