Как галерея2020 загружает изображения?

Question

На моем сервере у меня есть три файла на изображение.

• Файл миниатюр, который обрезается до 128 на 128.
• Небольшой файл, который, как мне кажется, подходит максимум до 160 на 240.
• Большой файл, который, как мне кажется, подходит максимум 960 на 540.

Мой метод возврата этих URL в галерею Three20 выглядит следующим образом:

- (NSString*)URLForVersion:(TTPhotoVersion)version {
    switch (version) {
        case TTPhotoVersionLarge:
            return _urlLarge;
        case TTPhotoVersionMedium:
            return _urlSmall;
        case TTPhotoVersionSmall:
            return _urlSmall;
        case TTPhotoVersionThumbnail:
            return _urlThumb;
        default:
            return nil;
    }
}

После регистрации при вызове этих различных значений происходит следующее:

1. Когда загружается страница миниатюр, вызываются только миниатюры (как и ожидалось)
2. При касании изображения появляется миниатюра, а не маленькое изображение.
3. После появления этого эскиза большое изображение загружается напрямую (без отображения маленького изображения).

То, что я хочу, это следующее

1. Это то же самое (загрузка миниатюр, как и ожидалось на главной странице)
2. При касании изображения сначала загружается маленькое изображение
3. Затем после этого загружается большое изображение.

или следующее

1. Миниатюры
2. Прямо на большое изображение.

Проблема с большим пальцем в том, что я обрезаю его, чтобы он был квадратным.

Это означает, что когда миниатюрное изображение отображается в главном окне просмотра (после касания большого пальца), оно становится больше, а когда загружается большое изображение, оно сразу же уменьшается, чтобы соответствовать.

Это выглядит очень плохо, и для меня было бы гораздо больше смысла, если бы он загружал большие пальцы в виде миниатюр, а затем маленькое изображение, а затем большое изображение в подробном представлении.

У кого-нибудь есть предложения, как это исправить?
Является ли лучший способ просто сделать большие пальцы одинакового соотношения сторон?

Буду признателен за любые советы по этому вопросу

Answer 1

Глядя на источник Three20, я вижу, что TTPhotoView загружает изображение предварительного просмотра, используя следующую логику:

- (BOOL)loadPreview:(BOOL)fromNetwork {
  if (![self loadVersion:TTPhotoVersionLarge fromNetwork:NO]) {
    if (![self loadVersion:TTPhotoVersionSmall fromNetwork:NO]) {
      if (![self loadVersion:TTPhotoVersionThumbnail fromNetwork:fromNetwork]) {
        return NO;
      }
    }
  }
  return YES;
}

Проблема в том, что, поскольку ваше маленькое изображение находится на сервере, а не локально, код пропускает изображение и использует эскиз для предварительного просмотра.

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

Answer 2

Я думаю, у вас есть три пути:

1. изменить фактическую реализацию loadPreview с TTPhotoView, чтобы она реализовала необходимую логику (т. Е. Позволяет загружать небольшую версию из сети);

2. подкласс TTPhotoView и переопределить loadPreview до того же эффекта, что и выше;

3. предварительно кэшируйте небольшие версии ваших фотографий; то есть измените / подкласс TTThumbView так, чтобы при установке TTPhotoVersionThumbnail он предварительно кэшировал версию TTPhotoVersionSmall; в этом случае, если изображение уже присутствует локально, loadPreview найдет его, не выходя в сеть; кроме того, вы можете выполнять предварительное кэширование в любое время, которое считаете подходящим для вашего приложения; для предварительного кэширования изображения вы должны создать TTButton с правильным URL-адресом (это будет касаться как TTURLRequest, так и кэша для вас);

4. в противном случае вы могли бы выполнить обрезку на лету от уменьшенной версии к уменьшенной версии, используя эту категорию UIImage ; в этом случае вам также следует настроить способ рисования TTThumbView, переопределив его метод imageForCurrentState, чтобы обрезка применялась при необходимости. Опять же, либо вы изменяете напрямую TTThumbView, либо вы создаете подкласс; в качестве альтернативы, вы можете определить layoutSubviews в вашем контроллере просмотра фотографий и изменить там каждый из TTThumbView s:

   - (void)layoutSubviews {
       [super layoutSubviews];
       for (NSInteger i = 0; i < _thumbViews.count; ++i) {
            TTThumbView* tv = [_thumbViews objectAtIndex:i];
            [tv contentForCurrentState].image = <cropped image>;
   

Если вы предпочитаете не использовать приватный метод contentForCurrentState, вы можете просто сделать:

            [tv addSubview:<cropped image>];

Как видите, у каждого варианта будут свои плюсы и минусы; 1 и 2 проще всего реализовать, но небольшая версия будет загружена из сети, что может добавить некоторую задержку; то же самое верно для 4, хотя подход отличается; 3 дает вам самую быструю реализацию (без дополнительной задержки из сети, поскольку вы предварительно кэшируете), но, возможно, это наиболее сложное решение для реализации (либо вы загружаете образ и кэшируете его самостоятельно, либо используете TTButton, чтобы сделать это для ты, что вроде не очень "чисто").

В любом случае, надеюсь, это поможет.