1
00:00:02,230 --> 00:00:12,550
Je veux donc avoir un bouton de sauvegarde dans mon en-tête et pour cela bien sûr, nous devons ajouter des options de navigation à l'écran de la

2
00:00:12,550 --> 00:00:19,620
carte et utiliser le formulaire de fonction là-bas, afin que nous ayons accès à cette navigation, cet objet avec

3
00:00:20,070 --> 00:00:25,500
l'objet de navigation et là-bas , Je veux retourner mon objet de configuration.

4
00:00:25,500 --> 00:00:28,070
Vous pouvez ajouter un titre d'en-tête, mais je suis en fait

5
00:00:28,200 --> 00:00:32,040
heureux sans celui-ci, mais je veux définir l'en-tête ici et maintenant important, ici vous pouvez bien sûr

6
00:00:32,190 --> 00:00:39,960
utiliser des boutons d'en-tête et rendre une belle icône mais en fait, je vais rendre du texte ici. Je vais donc importer le composant texte ou m'assurer

7
00:00:40,350 --> 00:00:46,080
que vous l'avez bien importé. Je vais restituer du texte ici où

8
00:00:46,330 --> 00:00:51,720
je dirai simplement enregistrer et vous pouvez bien sûr également ajouter une vérification de

9
00:00:51,720 --> 00:00:53,050
la plate-forme

10
00:00:53,130 --> 00:01:02,510
pour rendre ce majuscule sur Android si vous le souhaitez, je dirai simplement enregistrer comme ça, puis ajouter un style ici où J'ajoute le

11
00:01:02,510 --> 00:01:09,050
style de texte de mon bouton d'en-tête et autour de cela, je veux avoir une vue tactile,

12
00:01:09,050 --> 00:01:15,770
donc je vais utiliser l'opacité tactile ici que vous devez donc également importer, pas à partir de

13
00:01:15,770 --> 00:01:24,050
là mais en fait à partir de React Native, donc l'opacité tactile doit être importée de React Native et avec celui importé,

14
00:01:24,050 --> 00:01:31,770
nous pouvons envelopper ce texte pour créer nos propres boutons pour ainsi dire et là, je veux également ajouter un

15
00:01:31,770 --> 00:01:40,270
style et ce style aura un identifiant de bouton d'en-tête, disons. Maintenant, en appuyant sur cela, je veux enregistrer ce que nous avons ajouté ou enregistrer notre emplacement que nous avons choisi,

16
00:01:40,270 --> 00:01:46,780
mais c'est quelque chose que je ferai dans une seconde, pour le moment, stylisons cela. Donc là-bas dans la feuille de style, pour le bouton d'en-tête qui

17
00:01:46,780 --> 00:01:53,440
est cette opacité tactile, j'ajouterai une marge horizontale de 20 pour avoir un certain espacement autour du bouton à gauche et à droite et sur le

18
00:01:53,440 --> 00:01:58,060
texte du bouton d'en-tête ici, c'est bien sûr en haut à vous ce que vous voulez ajouter là-bas,

19
00:01:58,060 --> 00:02:05,920
mais je vais ajouter une taille de police de 16 disons et important, la couleur. Pour cela, j'ai besoin de l'API de plate-forme car la couleur

20
00:02:05,920 --> 00:02:11,440
doit différer, car c'est sur l'en-tête qui a un fond uni sur Android mais pas sur iOS,

21
00:02:11,500 --> 00:02:19,960
je peux définir ma couleur ici, ma couleur de texte sur Platform. OS est égal à Android, donc pour vérifier cela et sur Android, je le

22
00:02:19,960 --> 00:02:26,550
définirai sur blanc et sinon, je le définirai sur Couleurs. primaire et pour cela,

23
00:02:26,620 --> 00:02:32,610
comme toujours, assurez-vous d'importer vos couleurs constantes de là-haut.

24
00:02:32,690 --> 00:02:38,180
Alors maintenant, nous avons le bouton Enregistrer, lorsque nous appuyons sur le bouton Enregistrer, je veux déclencher une fonction qui devrait être définie

25
00:02:38,180 --> 00:02:43,370
dans le composant et c'est aussi quelque chose que nous avons fait plusieurs fois au cours, je vous ai montré comment

26
00:02:43,370 --> 00:02:50,360
vous pouvez communiquer entre votre composant et aussi vos options de navigation ici. Nous pouvons donc essentiellement ajouter une nouvelle fonction

27
00:02:50,390 --> 00:03:00,090
ici, enregistrer le gestionnaire d'emplacement choisi, quel que soit le nom que vous souhaitez lui donner et cette fonction ou une référence à cette fonction doit

28
00:03:00,110 --> 00:03:05,100
être transmise aux options de navigation et pour cela, nous pouvons utiliser le

29
00:03:05,100 --> 00:03:12,150
bon crochet de l'ancien effet d'utilisation et utilisez le rappel pour éviter cette boucle infinie si vous vous en

30
00:03:12,150 --> 00:03:21,520
souvenez et nous pouvons donc envelopper cela avec utiliser le rappel et ensuite utiliser l'effet ici pour dire à nos options de navigation à ce sujet

31
00:03:21,520 --> 00:03:32,600
en utilisant les paramètres de navigation des accessoires et ensuite je veux définir mon paramètre de localisation de sauvegarde ici au gestionnaire d'emplacement de sauvegarde choisi, donc passez une référence

32
00:03:32,610 --> 00:03:39,390
à cette fonction, à ce paramètre ou avec ce paramètre à mes en-têtes et l'effet d'utilisation dépend bien

33
00:03:39,390 --> 00:03:46,590
sûr de la fonction de gestionnaire d'emplacement de choix d'enregistrement, donc je vais l'ajouter comme dépendance ici et important

34
00:03:46,590 --> 00:03:55,040
maintenant, utiliser le rappel ici a également un tableau de dépendances car ici, je veux essentiellement quitter cette page et revenir en arrière,

35
00:03:55,160 --> 00:04:00,130
donc ici je peux utiliser la navigation des accessoires pour revenir en arrière

36
00:04:00,230 --> 00:04:05,630
et nous allons le modifier dans une seconde mais pour l'instant, nous peut le faire.

37
00:04:06,940 --> 00:04:13,420
Et donc, normalement bien sûr, cette fonction de retour serait ma dépendance mais pour éviter une boucle infinie, avec cette approche que nous

38
00:04:13,450 --> 00:04:18,180
devons utiliser en utilisant des paramètres pour mettre à jour le composant sur lequel nous sommes déjà,

39
00:04:18,370 --> 00:04:24,280
je vais en fait ajouter un tableau vide ici en tant que dépendance, afin que cette fonction ne soit pas reconstruite

40
00:04:24,310 --> 00:04:25,420
en ce moment.

41
00:04:25,480 --> 00:04:30,790
Donc, avec cela, nous pouvons extraire ce paramètre d'emplacement de sauvegarde dans notre en-tête.

42
00:04:30,790 --> 00:04:41,190
Alors ici, je veux pointer ma fonction de sauvegarde que j'obtiens avec navData. la navigation. getParam pointant sur l'identifiant de l'emplacement de

43
00:04:41,190 --> 00:04:48,480
sauvegarde, puis la fonction de sauvegarde est la fonction que je connecte au gestionnaire onPress

44
00:04:48,480 --> 00:04:50,050
sur l'opacité tactile.

45
00:04:50,070 --> 00:04:59,030
Donc, cela devrait déclencher cette fonction de sauvegarde, cette fonction de gestionnaire d'emplacement choisi ici. Avec cela enregistré si nous revenons en arrière, essayons, allons

46
00:04:59,060 --> 00:05:00,710
chercher sur la

47
00:05:00,740 --> 00:05:08,210
carte et si je clique maintenant sur enregistrer, il devrait simplement revenir en arrière et c'est le cas.

48
00:05:08,240 --> 00:05:13,280
Cela fonctionne, mais bien sûr, pour l'instant, je ne sauvegarde aucun emplacement, je n'utilise aucun emplacement, c'est

49
00:05:13,280 --> 00:05:15,080
la prochaine étape et pour

50
00:05:15,080 --> 00:05:21,110
cela, nous devons passer l'emplacement choisi par l'utilisateur à l'écran précédent. Avec revenir en arrière, c'est relativement difficile, mais à

51
00:05:21,110 --> 00:05:25,970
la place, nous pouvons utiliser un modèle que je n'avais pas vraiment utilisé auparavant dans ce

52
00:05:26,540 --> 00:05:34,010
cours, je peux également utiliser la navigation ici pour revenir en arrière. Je peux accéder à mon nouvel écran de lieu avec le nouvel identifiant

53
00:05:34,070 --> 00:05:41,810
de lieu configuré ici dans mon navigateur de lieux et puisque je suis déjà sur un écran avant ce nouvel écran de lieu, n'oubliez pas qu'il s'agit

54
00:05:41,810 --> 00:05:42,990
d'une pile d'écrans

55
00:05:43,070 --> 00:05:48,260
et je suis sur un écran au-dessus du nouvel écran de position, cela ne poussera pas en fait

56
00:05:48,290 --> 00:05:53,040
ce nouvel écran de position au-dessus de l'écran existant, nous pourrions forcer cela avec push mais

57
00:05:53,270 --> 00:05:56,020
je ne veux pas, au lieu de cela, il

58
00:05:56,030 --> 00:06:03,890
reviendra mais maintenant en utilisant la navigation, je peux ajouter quelques paramètres ici. Je peux ajouter mon emplacement choisi et là, pointez

59
00:06:04,040 --> 00:06:12,980
sur mon accessoire d'emplacement sélectionné qui, espérons-le, contient mon emplacement choisi. Maintenant que j'utilise l'emplacement sélectionné ici et que cela change, je vais l'ajouter

60
00:06:12,980 --> 00:06:18,320
comme dépendance pour utiliser le rappel afin que cette fonction soit recréée lorsque nous avons choisi

61
00:06:18,650 --> 00:06:23,900
un nouvel emplacement et je veux m'assurer que nous avons un emplacement ici , donc je

62
00:06:23,900 --> 00:06:30,800
vais vérifier si l'emplacement sélectionné ou pour être précis, si nous n'en avons pas, donc si ce n'est pas défini,

63
00:06:30,830 --> 00:06:32,300
ce qui signifie

64
00:06:32,330 --> 00:06:37,580
que l'utilisateur n'en a pas encore choisi, alors je reviendrai et ne continuerai pas et

65
00:06:37,820 --> 00:06:44,750
nous pouvons également montrer une alerte ici si on veut. Maintenant, je ne le ferai pas ici, mais vous pouvez afficher

66
00:06:44,780 --> 00:06:46,780
une alerte si vous le souhaitez.

67
00:06:46,950 --> 00:06:52,110
Alors maintenant, nous ne pourrons cliquer sur enregistrer que si nous avons choisi un emplacement, mais si nous le

68
00:06:52,110 --> 00:06:54,740
faisons, nous le définirons en fait sur les paramètres de

69
00:06:54,750 --> 00:06:57,250
notre action de retour. Essayons, allons-y, cliquez

70
00:06:57,250 --> 00:07:03,250
sur picK sur la carte et maintenant veuillez noter que je n'ai pas encore choisi de lieu, je n'ai encore

71
00:07:03,280 --> 00:07:04,630
cliqué nulle part, donc si

72
00:07:04,630 --> 00:07:09,160
je clique sur enregistrer, rien ne se passe. Si je choisis un emplacement et clique sur Enregistrer, je reviens cependant.

73
00:07:09,970 --> 00:07:17,560
Alors maintenant, nous pouvons utiliser les données que nous renvoyons de l'écran de la carte dans notre sélecteur de position pour mettre à jour l'aperçu de la carte

74
00:07:17,590 --> 00:07:18,890
là-bas, c'est donc la

75
00:07:18,910 --> 00:07:20,290
prochaine chose que je ferai.