Zacznijmy od wielkości urządzenia,
na którym pracujemy. W tej chwili mam tutaj stosunkowo duże emulatory i teraz to zmienię
i zmienię to
na Androida, ale oczywiście moglibyśmy zrobić to samo na iOS. Tutaj na Androidzie i stworzę nowe urządzenie
wirtualne, które jest o wiele mniejsze
i do tego na mojej liście obrazów podczas tworzenia nowego urządzenia wirtualnego wybiorę super małe
takie
jak ten 3. 7-calowy telefon tutaj.
Jedna ważna uwaga: możesz myśleć, że niewielu użytkowników korzysta z tak małych urządzeń, ale tak
naprawdę zależy to od rynku, na który celujesz.
Jeśli kierujesz reklamy głównie na Stany Zjednoczone, być może nie musisz tak naprawdę optymalizować aplikacji pod kątem
małych urządzeń, ale
jeśli kierujesz reklamy na cały świat lub niektóre kraje wschodzące, wygląda to inaczej, więc zdecydowanie chcesz
aby dowiedzieć się, jaki jest Twój cel i z jakich urządzeń korzystają Twoi docelowi użytkownicy.
Więc utworzę to urządzenie tutaj, stosunkowo małe, po prostu kliknij tutaj, wybierz tutaj Android ciasto jako
wersję Androida, a następnie zakończ to, a
teraz utworzy to urządzenie wirtualne, a teraz uruchomię je.
Więc teraz się uruchamia, na drugim ekranie przywrócę to za
sekundę, na chwilę zamknę
to urządzenie z Androidem, większe i oto moje mniejsze.
Pozwólcie, że trochę to zwiększę, a to tylko zwiększy rozmiar, w którym możemy
to zobaczyć, a nie rozmiar telefonu,
a jak już widać, jest to zdecydowanie mniejsze urządzenie z mniejszą liczbą pikseli dostępnych
zarówno na wysokość i szerokość.
Teraz już wróciłem do mojego projektu, nad którym pracowaliśmy w ostatnich
sekcjach, a dołączasz go na wypadek, gdybyś nie śledził
tego tutaj, a ja już uruchomiłem mój serwer expo z npm
start i przez uderzając, teraz instaluję expo, a następnie tę aplikację tutaj na tym emulatorze.
Poczekajmy, aż to się skończy i uruchomi, a oto moja aplikacja i już możemy powiedzieć, że nasza
aplikacja z pewnością nie jest zoptymalizowana dla mniejszych
ekranów, tutaj przyciski nie są tak dobrze ustawione, więc coś jest nie
tak i zobaczmy, jak to działa, gdy zaczynamy grę.
Cóż, tutaj wydaje się, że to działa, jeśli kliknę Rozpocznij grę, to na pewno działa tutaj, ale mamy problem na ekranie startowym i może tutaj chcemy również
zmienić niektóre rozmiary, może chcemy usunąć margines lub zmniejszamy margines, jaki mamy
między tą liczbą a tym polem, dzięki naszym wejściom tutaj, być może chcemy zwiększyć szerokość naszych pól
tam, nasz dziennik rund, które mieliśmy, więc może chcemy coś tam zmienić i kiedy gra jest na koniec, może chcemy
trochę zmniejszyć rozmiar obrazu, ale ponieważ jest on bardzo duży i faktycznie
ma jedną ogromną wadę, ponieważ ponieważ ta strona nie jest przewijalna, nie
mogę dotrzeć do nowego przycisku gry, więc jest
to prawdziwy łamacz gier, to
naprawdę łamie naszą grę, ta odległość tutaj jest również trochę za duża między
obrazem a tekstem.
Jest mnóstwo pracy do zrobienia tylko dlatego, że jesteśmy na
mniejszym urządzeniu, to nawet nie szanuje faktu, że nasi użytkownicy mogą obracać urządzenie, które, nawiasem mówiąc, w tej
chwili i tak jest wyłączone, więc wrócę do i jak to włączyć w sekundę.
Zacznijmy więc nad tym i dowiedzmy się, jak możemy faktycznie obliczyć dystrybuowaną przestrzeń, rozmiary, których używamy w
bardziej dynamiczny sposób i upewnić się, że nasza aplikacja wygląda dobrze na wszystkich rodzajach urządzeń.