iOS
Załaduj obrazy asynchronicznie

Najprostszy sposób

Najprostszym sposobem na utworzenie tego jest użycie Alamofire i jego UIImageViewExtension . Potrzebujemy widoku tabeli z komórką, która ma imageView i pozwala nazwać go imageView .

W funkcji cellForRowAt: funkcji tableView pobierzemy obraz i ustawimy w następujący sposób:

let url = URL(string: "https://httpbin.org/image/png")!
let placeholderImage = UIImage(named: "placeholder")!

imageView.af_setImage(withURL: url, placeholderImage: placeholderImage)

Adres URL powinien wskazywać obraz, który chcesz pobrać, a obraz placeHolder powinien być obrazem przechowywanym. Następnie wywołujemy metodę af_setImage na imageView który pobiera obraz z podanego imageView URL, a podczas pobierania zostanie wyświetlony obraz zastępczy. Po pobraniu obrazu zostanie wyświetlony żądany obraz

Sprawdź, czy komórka jest nadal widoczna po pobraniu

Czasami pobieranie trwa dłużej niż wyświetlana jest komórka. W takim przypadku może się zdarzyć, że pobrany obraz zostanie wyświetlony w niewłaściwej komórce. Aby to naprawić, nie możemy użyć rozszerzenia UIImageView .

Nadal będziemy używać Alamofire, jednak do wyświetlenia obrazu użyjemy modułu obsługi zakończenia.

W tym scenariuszu nadal potrzebujemy tableView z komórką, w której znajduje się imageView. W metodzie cellForRowAt: pobralibyśmy obraz z następującym kodem:

let placeholderImage = UIImage(named: "placeholder")!
imageView.image = placeholderImage

let url = URL(string: "https://httpbin.org/image/png")!

Alamofire.request(url!, method: .get).responseImage { response in
    guard let image = response.result.value else { return }

    if let updateCell = tableView.cellForRow(at: indexPath) {
        updateCell.imageView.image = image
    }
}

W tym przykładzie najpierw ustawiamy obraz na obraz zastępczy. Następnie pobieramy obraz za pomocą metody request Alamofire . Podajemy adres URL jako pierwszy argument, a ponieważ chcemy tylko uzyskać obraz, użyjemy metody .get HTTP. Ponieważ pobieramy obraz, chcemy, aby odpowiedź była obrazem, dlatego używamy metody .responseImage .

Po pobraniu obrazu wywoływane jest zamknięcie, a przede wszystkim upewniamy się, że pobrany obraz rzeczywiście istnieje. Następnie upewniamy się, że komórka jest nadal widoczna, sprawdzając, czy cellForRow (at: indexPath) nie zwraca zero. Jeśli tak się nie stanie, nic się nie stanie, jeśli nie zrobimy tego, przypisujemy ostatnio pobrany obraz.

Ta ostatnia instrukcja if zapewnia, że komórka jest nadal widoczna, jeśli użytkownik już przewinął komórkę, updateCell będzie zero, a instrukcja if zwróci zero. Pomaga nam to zapobiec wyświetlaniu niewłaściwego obrazu w komórce.