Powiedzmy, że chcemy użyć obrazu z Internetu,
a do tego możesz po prostu wybrać go tutaj, zrobię to za pomocą wyszukiwania grafiki Google, powiedzmy to i
chcemy użyć tego obrazu w naszej grze na ekranie.
Wcześniej używaliśmy tej składni wymagającej do załadowania lokalnego obrazu, teraz
ta składnia nie będzie już właściwa.
Więc powielę ten wiersz i skomentuję go, dla
obrazu internetowego, zamiast tego przekazujesz obiekt do źródła, a na tym obiekcie przekazujesz rekwizyt URI, a rekwizyt URI zawiera ciąg,
który jest twoim linkiem do obrazu.
Więc twój link do obrazu jest przekazywany do prop URI w tym obiekcie, który przekazałeś do źródła.
Jeśli to zrobisz, spowoduje to załadowanie obrazu z Internetu, ale jest jedna ważna rzecz, o której musisz wiedzieć.
W przypadku obrazu,
który został załadowany lokalnie, wspomniałem,
że React Native jest w stanie określić jego szerokość i wysokość i używa go jako domyślnego.
Dlatego w przypadku obrazu ładowanego lokalnie nie musisz ustawiać szerokości i wysokości obrazu, robimy to tutaj, ponieważ chcemy zastąpić
domyślną szerokość i wysokość, ale jeśli masz obraz, który ma już idealny
rozmiar, nie musisz ustawiać szerokości i wysokości. W przypadku obrazów z Internetu program React Native
nie jest w
stanie określić szerokości i wysokości obrazu przed jego załadowaniem, ponieważ nie jest częścią aplikacji, pochodzi z
Internetu, program React Native pobiera go
i jest to trochę niespodzianka szerokość i wysokość to. Dlatego w przypadku obrazów sieciowych, więc
w przypadku obrazów,
które pobierasz za pomocą łącza, zawsze musisz ustawić szerokość i wysokość na obiekcie
obrazu, tutaj na komponencie obrazu. W przypadku lokalnych obrazów dodanych
z wymaganiem możesz to zrobić, ponieważ robimy to, aby go
zastąpić, ale nie musisz, to ważne różnicowanie.
Być może zauważyłeś również, że w przypadku obrazów internetowych załadowany obraz zanikał, gdy został załadowany po raz pierwszy,
i jest to przyjemny efekt fabryczny React Native dodaje automatycznie obrazy sieciowe.
Pobiera ten obraz i podczas oczekiwania na zakończenie pobierania, w zasadzie nic nie pokazuje, nie może
jeszcze wyświetlić obrazu, ale gdy obraz jest załadowany, nie tylko go tam wkłada, ale
powoli zanika, w którym jest ładniejsze przejście dla załadowanego obrazu.
To fajny efekt i możesz również kontrolować to z czasem trwania zanikania, możesz ustawić
to na wartość, a domyślnie jest to
300, czyli 300 ms, ale możesz ustawić inną wartość milisekundy, na przykład 1000 ms, co byłoby
jedną sekundą dla obraz zanika i tak dalej. Po pierwszym załadowaniu obraz jest buforowany,
dlatego kolejne użycie tego samego obrazu nastąpiło niemal natychmiast, ponieważ zostało
już pobrane.
Oto jak korzystać z obrazów sieciowych i o których należy pamiętać.