1
00:00:02,520 --> 00:00:08,550
Zanim przejdziemy do procesu kompilacji lub publikacji, a tym samym dostarczymy go do sklepów z

2
00:00:08,550 --> 00:00:10,300
aplikacjami, kontynuujmy konfigurowanie tego.

3
00:00:10,300 --> 00:00:15,330
Na przykład, istnieją tutaj pewne puste pola, takie jak brakujący opis, który można

4
00:00:15,330 --> 00:00:16,440
dodać, dodając

5
00:00:16,440 --> 00:00:21,540
tutaj klucz opisu z jakimś tekstem, a byłby to opis, który się tutaj pojawi.

6
00:00:21,660 --> 00:00:24,640
Ważne, to nie jest opis, który pojawia się

7
00:00:24,640 --> 00:00:28,950
w sklepach z aplikacjami, to po prostu opis, który pojawia się tutaj i

8
00:00:28,950 --> 00:00:34,200
możesz dowiedzieć się więcej o opisie, wszystkich innych kluczach, które możesz ustawić tutaj na tej stronie.

9
00:00:34,230 --> 00:00:37,110
W końcu można ustawić wiele ustawień.

10
00:00:37,110 --> 00:00:42,780
Teraz interesuje mnie teraz ikona i część ekranu powitalnego, ponieważ jest to ikona, którą ludzie

11
00:00:42,780 --> 00:00:44,610
zobaczą na ekranie głównym,

12
00:00:44,610 --> 00:00:49,920
oczywiście jeszcze nie, ponieważ teraz nie publikujemy aplikacji w App Store, ale to się

13
00:00:50,700 --> 00:00:51,670
zmieni i

14
00:00:51,690 --> 00:00:54,140
ekran powitalny - to właśnie widzą użytkownicy,

15
00:00:54,330 --> 00:00:58,620
gdy ładuje się nasza aplikacja, i oba te elementy zazwyczaj chcesz dostosować.

16
00:00:58,680 --> 00:01:05,810
Teraz expo daje Ci ikonę i ekran powitalny po wyjęciu z pudełka, ale oba są po prostu pustym miejscem zastępczym, prawda,

17
00:01:05,820 --> 00:01:08,720
więc to nie jest zbyt niesamowite, zamiast

18
00:01:08,730 --> 00:01:12,590
tego chcemy udostępnić naszą własną ikonę, nasz własny ekran powitalny tutaj.

19
00:01:12,600 --> 00:01:17,850
Teraz jesteś bardzo elastyczny w kwestii tego, co tu podajesz, ale ogólnie

20
00:01:17,850 --> 00:01:22,840
dobrym pomysłem jest zapewnienie ikony w rozdzielczości 1024 x 1024, więc kwadratową

21
00:01:22,890 --> 00:01:30,720
ikonę jako dane wejściowe, a dla ekranu powitalnego możesz zbudować ekran powitalny jako opisane w oficjalnych dokumentach, w których

22
00:01:30,720 --> 00:01:35,550
można dowiedzieć się więcej o tym, jak zbudować taki ekran powitalny,

23
00:01:35,550 --> 00:01:38,520
jak go zbudować i tak dalej.

24
00:01:38,520 --> 00:01:45,600
Teraz przygotowałem dla ciebie coś, co możesz wykorzystać, a teraz nie powinieneś używać go do rzeczywistego wdrożenia, ponieważ

25
00:01:45,660 --> 00:01:51,930
te zasoby są tylko na ten kurs, a nie do użycia w aplikacji, którą planujesz

26
00:01:51,930 --> 00:01:57,870
wdrożyć i dla tego, co znajdziesz ikony. plik zip.

27
00:01:58,000 --> 00:02:04,270
Teraz, jeśli go rozpakujesz, znajdziesz tam miejsca. Plik png, który możesz oczywiście przeciągnąć i upuścić

28
00:02:04,270 --> 00:02:05,500
w folderze

29
00:02:05,500 --> 00:02:08,840
zasobów, możesz również usunąć ikonę. tam plik png, jeśli chcesz.

30
00:02:08,890 --> 00:02:15,460
Możesz także usunąć splash. plik png, ponieważ w tym załączonym folderze znajduje

31
00:02:15,580 --> 00:02:19,720
się również ikona powitania. plik png, który oczywiście możesz również przeciągnąć i upuścić tutaj.

32
00:02:19,720 --> 00:02:24,030
Teraz to tylko niektóre ikony, które utworzyłem, których możemy używać teraz

33
00:02:24,280 --> 00:02:29,590
i ponownie w aplikacji. plik json, możemy teraz wskazać niestandardowe ikony. Ważne, powinieneś dostarczyć pliki

34
00:02:29,600 --> 00:02:31,720
png, ponieważ robię to tutaj.

35
00:02:31,720 --> 00:02:38,170
Teraz dla ikony możemy wskazać zasoby / miejsca. png, a dla powitania możemy wskazać

36
00:02:38,260 --> 00:02:46,840
ten zasób / splash_icon. png Teraz jako kolor tła możemy użyć ciemnego czarnego

37
00:02:46,840 --> 00:02:47,940
koloru, takiego

38
00:02:48,010 --> 00:02:55,180
jak kod szesnastkowy # 171717, powinien to być kolor szesnastkowy taki jak ten, a tryb zmiany rozmiaru można ustawić

39
00:02:55,180 --> 00:03:00,610
tak, aby zawierał lub zakrywał, okładka zasadniczo rozciągnie ikonę, aby wziąć pełna dostępna szerokość

40
00:03:00,610 --> 00:03:06,190
i wysokość, zawierać będzie zachować rozmiar ikony, wyśrodkować ją i mieć kolor tła za ikoną.

41
00:03:06,190 --> 00:03:10,090
Teraz, jeśli to zrobimy, możemy zobaczyć wynik tego, jeśli po

42
00:03:10,240 --> 00:03:18,730
prostu npm uruchomimy to, więc serwer, jak to robiliśmy wiele razy w tym kursie lub expo, a następnie uruchamiamy to na emulatorze,

43
00:03:18,730 --> 00:03:26,010
Androidzie lub iOS ponownie, gdy I robię to tutaj. Teraz to uruchamia go tam i teraz widzisz, to jest

44
00:03:26,200 --> 00:03:31,510
ekran powitalny, który już robi nowy, z obrazem, który jest nasz duży, ale jest celowy,

45
00:03:31,520 --> 00:03:35,920
abyśmy mogli go wyraźnie zobaczyć, a kolor tła jest nieco inny, więc że

46
00:03:35,920 --> 00:03:40,180
masz również szansę to zobaczyć, oczywiście możesz wybrać ten sam kolor, aby

47
00:03:40,180 --> 00:03:42,480
mieć tutaj płynny ekran powitalny.

48
00:03:42,520 --> 00:03:45,510
Więc to działa i poczekajmy na to, aby

49
00:03:45,710 --> 00:03:50,160
się skończyło, a aplikacja jest uruchomiona, a teraz zobaczysz swoją ikonę tutaj,

50
00:03:50,170 --> 00:03:55,240
jeśli przejdziesz do przełącznika zadań. Widzisz, nie wygląda tak dobrze z tłem,

51
00:03:55,240 --> 00:03:56,720
ale możemy to poprawić,

52
00:03:56,740 --> 00:04:02,740
ale tutaj jest ikona, więc działa, widzimy zarówno ekran powitalny, jak i ikonę, a na iOS

53
00:04:02,770 --> 00:04:05,610
byłoby to samo. Teraz, jak widać,

54
00:04:05,610 --> 00:04:08,230
ikona na Androida nie wygląda tak dobrze.

55
00:04:08,250 --> 00:04:13,260
Powodem tego jest to, że Android w zależności od wersji Androida uruchomionej

56
00:04:13,650 --> 00:04:20,310
na urządzeniu używa różnych ikon, nowsze nowsze wersje Androida używają tak zwanych ikon adaptacyjnych, które są

57
00:04:20,310 --> 00:04:25,980
zaokrąglonymi ikonami, na których ikona znajduje się pośrodku a potem jakiś kolor tła lub

58
00:04:25,980 --> 00:04:28,060
obraz tła, nawet za

59
00:04:28,110 --> 00:04:30,900
nimi, starsze wersje używałyby kwadratowych ikon.

60
00:04:30,900 --> 00:04:38,930
Teraz możesz to zrobić, udostępniając bardziej szczegółową konfigurację dla systemu Android, a także

61
00:04:39,000 --> 00:04:45,770
dla systemu iOS, jeśli chcesz. Zamiast mieć tutaj ten ogólny klucz do ikon, możesz skonfigurować ustawienia specyficzne dla platformy

62
00:04:45,770 --> 00:04:48,800
i jest to również coś, czego nauczyłeś się w oficjalnych dokumentach.

63
00:04:48,870 --> 00:04:55,380
Znajdziesz tam informacje o tym, jak możesz skonfigurować powitanie ikony, to miłe, ale

64
00:04:55,380 --> 00:05:01,150
także o tym, jak możesz skonfigurować iOS w określony sposób,

65
00:05:01,260 --> 00:05:07,310
a tam możesz ustawić ikonę specyficzną dla iOS, jeśli chcesz tego użyć.

66
00:05:07,480 --> 00:05:13,710
Oczywiście to samo dotyczy ekranu powitalnego, więc możesz w zasadzie dodać węzeł iOS do swojej

67
00:05:13,720 --> 00:05:21,910
konfiguracji, mamy już to tutaj, a tam, możesz również dodać ikonę, a następnie także konfigurację powitalną, która wygląda dokładnie lub

68
00:05:21,910 --> 00:05:27,450
która wyglądałoby dokładnie tak, jak tutaj mamy konfigurację roota, ale teraz możesz

69
00:05:27,520 --> 00:05:33,730
w zasadzie zastąpić te ogólne ustawienia poziomu roota i mieć specjalną ikonę dla iOS i

70
00:05:33,730 --> 00:05:36,170
specjalny ekran powitalny dla iOS.

71
00:05:36,190 --> 00:05:41,620
To jest coś, co możesz zrobić, to samo dotyczy Androida i oczywiście znajdziesz to również

72
00:05:41,620 --> 00:05:42,820
w oficjalnych dokumentach.

73
00:05:43,000 --> 00:05:49,050
Możesz dodać klucz Androida tutaj do swojej aplikacji. plik json, a następnie zawiera obiekt, więc

74
00:05:49,060 --> 00:05:55,780
można powiedzieć, że można również skonfigurować ikonę i konfigurację powitalną, tak jak to wyjaśniłem dla iOS, a

75
00:05:55,840 --> 00:05:58,900
teraz te ustawienia zostaną przyjęte dla Androida, iOS,

76
00:05:59,140 --> 00:06:04,120
ponieważ nie ma określonych ustawień w moim przykładzie tutaj nadal używałbym ogólnych

77
00:06:04,120 --> 00:06:05,190
ustawień tam.

78
00:06:05,200 --> 00:06:10,690
Ciekawą rzeczą jest to, że na Androida nie można po prostu ustawić konkretnego ekranu

79
00:06:10,780 --> 00:06:18,580
powitalnego ikony, można także ustawić tutaj ikonę adaptacyjną z konfiguracją ikony adaptacyjnej, która nie jest dostępna dla iOS, ponieważ

80
00:06:18,580 --> 00:06:21,820
ikony adaptacyjne są dostępne wyłącznie dla Androida.

81
00:06:21,820 --> 00:06:29,450
Ikona adaptacyjna pobiera obiekt JavaScript, który można powiedzieć jako wartość konfiguracyjną, a nie ciąg, a obiekt ten

82
00:06:29,680 --> 00:06:35,950
może mieć trzy klucze - obraz pierwszego planu, kolor tła lub obraz tła.

83
00:06:35,950 --> 00:06:40,960
Teraz masz kolor tła lub obraz tła, ale zawsze powinieneś mieć obraz

84
00:06:40,960 --> 00:06:41,850
pierwszego planu.

85
00:06:41,890 --> 00:06:46,780
Teraz możemy dodać obraz pierwszego planu, więc ten klucz tutaj

86
00:06:46,780 --> 00:06:53,410
i kolor tła, który powinien być sześciocyfrowym kodem szesnastkowym, jak widać, i zróbmy to

87
00:06:53,520 --> 00:06:59,590
szybko tutaj, a teraz możemy ustawić kolor tła, powiedzmy, że kod # 171717

88
00:06:59,590 --> 00:07:04,750
i obraz pierwszego planu można teraz ustawić na naszą ikonę, chociaż

89
00:07:04,750 --> 00:07:07,900
w tym celu zaleciłbym użycie konkretnej ikony,

90
00:07:08,020 --> 00:07:16,990
którą również tutaj dołączasz, miejsca-adaptacji. plik png, który można przeciągać i upuszczać w folderze zasobów i który dostosowuje się do miejsc. Plik png może być teraz używany tutaj

91
00:07:17,410 --> 00:07:23,800
jako obraz pierwszego planu, dzięki czemu możemy wskazywać na zasoby, a następnie dostosowywać się do

92
00:07:23,830 --> 00:07:25,630
miejsc. png

93
00:07:25,690 --> 00:07:30,550
Teraz ta ikona, ikona dostosowująca miejsca jest przezroczysta, nadal jest ikoną, ale

94
00:07:30,550 --> 00:07:34,990
ma przezroczyste tło, w przeciwieństwie do innej ikony, dzięki czemu Android

95
00:07:34,990 --> 00:07:39,640
może umieścić ją przed tym kolorem tła lub obrazem tła, który podałeś

96
00:07:39,640 --> 00:07:43,650
i automatycznie za rogami dla ciebie i tak dalej.

97
00:07:43,660 --> 00:07:51,400
Więc jeśli teraz to zapiszemy, a to odbuduje i dla bezpieczeństwa, że to naprawdę bierze to pod uwagę,

98
00:07:51,430 --> 00:07:53,910
zrestartuję tutaj mój serwer expo.

99
00:07:54,040 --> 00:08:00,370
Jeśli teraz uruchomimy to na Androidzie i w tym celu zamknę również klienta expo, a

100
00:08:03,390 --> 00:08:05,490
następnie uruchomię go ponownie

101
00:08:05,490 --> 00:08:08,990
na Androidzie, powinniśmy zobaczyć, że po ponownym uruchomieniu

102
00:08:09,000 --> 00:08:12,540
mamy teraz ładniejszą ikonę, która wygląda nieco lepiej.

103
00:08:12,600 --> 00:08:14,060
Poczekajmy, aż to się

104
00:08:14,070 --> 00:08:19,560
uruchomi, to wciąż ekran powitalny, tak jak go wcześniej konfigurowaliśmy, nie ustawiłem też ekranu powitalnego dla Androida, co

105
00:08:19,560 --> 00:08:21,700
oczywiście możemy, ale tutaj nie zrobiłem,

106
00:08:21,720 --> 00:08:25,810
więc oczywiście otrzymaliśmy to samo ekran powitalny, jak wcześniej w tym module, a jeśli

107
00:08:26,110 --> 00:08:31,440
spojrzysz teraz na ikonę, możesz niestety nadal zobaczyć stary. Nowa zostanie wzięta pod uwagę,

108
00:08:31,440 --> 00:08:37,320
gdy zbudujemy tę aplikację jako samodzielną aplikację i rozpowszechnimy ją w sklepach z aplikacjami.

109
00:08:38,100 --> 00:08:43,110
Ogólnie zaleca się, aby dla Androida ustawić taką ikonę adaptacyjną, ponieważ obejmuje ona

110
00:08:43,110 --> 00:08:49,470
więcej wersji Androida, co oczywiście nie boli. Ustawienie takiej ogólnej ikony również nie jest złym pomysłem i oczywiście możemy

111
00:08:49,470 --> 00:08:50,040
albo

112
00:08:50,070 --> 00:08:54,780
użyć jednej i tej samej ikony zarówno dla iOS, jak i Androida, lub ustawić określone ikony dla

113
00:08:54,810 --> 00:09:01,110
iOS i Androida, jak wspomniano w przypadku Androida, ewentualnie ikonę adaptacyjną. Jeśli chcesz dowiedzieć się więcej o procesie

114
00:09:01,110 --> 00:09:06,180
tworzenia ikon i ekranów powitalnych oraz zarządzania nimi, w załączeniu znajdziesz oficjalne dokumenty

115
00:09:06,180 --> 00:09:11,160
expo, które zagłębiają się w różne dostępne opcje i to, co powinieneś rozważyć.