1 00:00:02,100 --> 00:00:07,110 Maintenant, cette application React Native est construite à l'aide de l'expo comme vous le savez. Maintenant, comme je l'ai mentionné au 2 00:00:07,110 --> 00:00:12,690 début du cours, il s'agit toujours d'une application React Native standard, donc expo tout 3 00:00:12,690 --> 00:00:19,170 comme un wrapper supplémentaire qui offre de nombreuses fonctionnalités pratiques qui facilitent la construction de cette 4 00:00:19,170 --> 00:00:20,820 application et c'est 5 00:00:20,820 --> 00:00:27,770 comme un shell, une application dans laquelle notre application s'exécute, ce qui rend donc plus facile et surtout 6 00:00:27,780 --> 00:00:31,860 plus facile à configurer de nombreuses fonctionnalités natives de l'appareil. 7 00:00:31,860 --> 00:00:37,380 Maintenant, comme je l'ai également mentionné au début de ce module, dans un module séparé, je vais vous montrer comment vous 8 00:00:37,380 --> 00:00:40,590 pouvez ajouter des fonctionnalités de périphérique natif à des applications non-expo, mais 9 00:00:40,890 --> 00:00:46,170 en fait, si vous n'avez pas de raison de ne pas utiliser expo, je le ferais nous vous recommandons fortement 10 00:00:46,170 --> 00:00:53,400 de l'utiliser, car expo si vous vérifiez leurs documents, possède de nombreuses fonctionnalités intégrées et de nombreux modules natifs intégrés que vous pouvez utiliser, de sorte que 11 00:00:53,400 --> 00:00:54,570 les fonctionnalités des 12 00:00:54,570 --> 00:00:56,460 appareils natifs vous pouvez facilement ajouter et 13 00:00:57,090 --> 00:01:01,620 vous voyez une liste complète ici en allant aux docs et là à la référence API. 14 00:01:01,620 --> 00:01:07,650 Ici, vous voyez un tas de choses que vous pouvez ajouter à votre application et ce sont principalement 15 00:01:08,070 --> 00:01:11,220 des fonctionnalités d'appareil natives qui sont toutes fournies par expo, 16 00:01:11,340 --> 00:01:16,770 donc vous devrez toujours installer quelque chose mais vous n'aurez pas besoin de manuel configuration et 17 00:01:16,770 --> 00:01:23,700 comme vous le verrez dans la création d'une application sans module expo, il y a pas mal de configuration que vous 18 00:01:23,790 --> 00:01:30,270 devrez peut-être faire si vous ajoutez des modules natifs, des packages de fonctionnalités de périphérique natif à une application non 19 00:01:30,270 --> 00:01:32,560 expo, donc c'est vraiment adorable ici. 20 00:01:32,650 --> 00:01:38,360 Maintenant, je veux utiliser un appareil photo et en effet il y a un package d'appareil photo que vous pouvez ajouter. 21 00:01:38,610 --> 00:01:42,510 Nous pourrions en fait l'utiliser pour accéder à la caméra de 22 00:01:42,510 --> 00:01:43,620 l'appareil, c'est 23 00:01:43,620 --> 00:01:49,620 parfait si vous devez créer une application qui a vraiment besoin de faire beaucoup avec la caméra, si 24 00:01:49,620 --> 00:01:55,440 vous construisez comme Instagram, comme une application où vous voulez vraiment contrôler la l'écran de la caméra 25 00:01:55,440 --> 00:02:00,760 et le flux de la caméra, ce n'est pas ce que je veux faire ici. 26 00:02:00,780 --> 00:02:02,960 Je veux utiliser l'appareil photo ordinaire de l'appareil, 27 00:02:02,970 --> 00:02:04,660 je n'ai besoin de rien de 28 00:02:04,740 --> 00:02:08,150 spécial là-bas, je me soucie simplement d'obtenir une image que l'utilisateur peut prendre 29 00:02:08,230 --> 00:02:13,620 et pour cela, nous obtenons en fait le sélecteur d'image. Cela nous permet également d'utiliser l'appareil photo de l'appareil, mais cela 30 00:02:13,620 --> 00:02:16,200 ne nous permet pas de personnaliser autant l'appareil photo, mais 31 00:02:16,200 --> 00:02:18,450 c'est exactement ce dont j'ai besoin ici. 32 00:02:18,450 --> 00:02:25,050 Maintenant, tout ce que nous devons faire pour y accéder est d'exécuter cette commande expo install, qui est en fait comme 33 00:02:25,170 --> 00:02:30,750 npm install, juste pour s'assurer qu'elle installe une version du paquet qui est garantie de fonctionner avec 34 00:02:30,750 --> 00:02:38,070 notre version spécifique de expo que nous utilisons dans cette application. Je vais donc simplement copier cette commande puis dans 35 00:02:38,090 --> 00:02:45,530 ce projet, nous pouvons exécuter expo install expo image picker. Appuyez sur Entrée et cela installera maintenant ce package avec 36 00:02:45,530 --> 00:02:49,580 npm install dans les coulisses, c'est ce qu'il fait ici, juste 37 00:02:49,610 --> 00:02:55,880 dans une version qui correspond à notre SDK expo où nous utilisons dans ce projet et cela 38 00:02:55,880 --> 00:02:58,190 va maintenant l'installer et c'est tout, 39 00:02:58,190 --> 00:03:00,410 aucune configuration supplémentaire n'est nécessaire. 40 00:03:00,410 --> 00:03:02,800 Nous n'avons pas besoin de toucher à un 41 00:03:02,810 --> 00:03:04,570 fichier de configuration, nous n'avons rien 42 00:03:04,640 --> 00:03:07,970 d'autre à faire, cela nous permet d'utiliser cette fonctionnalité et c'est 43 00:03:07,970 --> 00:03:09,690 bien sûr très facile. 44 00:03:09,770 --> 00:03:15,280 Avec cela, nous pouvons commencer à l'utiliser et je veux commencer à l'utiliser ici sur le nouvel écran de lieu où 45 00:03:15,350 --> 00:03:17,270 nous avons le droit de saisie 46 00:03:17,270 --> 00:03:22,480 de texte, là, je veux également ajouter maintenant un bouton sur lequel l'utilisateur peut appuyer pour ouvrir la caméra. 47 00:03:22,490 --> 00:03:27,680 Maintenant, bien sûr, pour toutes ces fonctionnalités natives de l'appareil et aussi pour les nombreuses fonctionnalités que nous ne pouvons bien 48 00:03:27,680 --> 00:03:32,660 sûr pas couvrir dans ce cours, vous avez toujours appris comment vous pouvez les utiliser ici dans vos documents 49 00:03:32,660 --> 00:03:38,260 officiels d'exposition, là, vous avez appris quelles méthodes et propriétés vous pouvez accéder vous y trouverez de courts exemples pour de nombreux packages, 50 00:03:38,300 --> 00:03:43,220 c'est donc certainement quelque chose que vous devriez vérifier. Pour l'appareil photo, bien sûr, vous pouvez 51 00:03:43,220 --> 00:03:46,920 également suivre, car nous allons l'utiliser ensemble ici pour prendre une photo. 52 00:03:46,970 --> 00:03:54,830 Je vais en fait créer un nouveau composant, ImageSelector. js, vous pouvez le nommer comme vous voulez 53 00:03:54,830 --> 00:04:05,810 dans lequel j'importe React de React et où j'importe une vue et un bouton et aussi un texte de React Native et aussi la feuille 54 00:04:06,290 --> 00:04:11,710 de style bien sûr parce que je veux styler mon sélecteur d'images. 55 00:04:11,870 --> 00:04:16,130 Appelons le sélecteur d'images, j'aime ça, mon composant sélecteur d'images. 56 00:04:16,790 --> 00:04:23,570 Donc ici, le sélecteur d'images est alors un composant régulier bien sûr où je veux 57 00:04:23,580 --> 00:04:31,290 configurer certains styles avec la feuille de style. créer une méthode et où à la fin j'exporte le composant sélecteur d'image. 58 00:04:31,310 --> 00:04:37,510 Maintenant, que va-t-il se passer ici dans le composant sélecteur d'images? À la fin, ici, je vais retourner 59 00:04:37,780 --> 00:04:44,750 une vue qui devrait ensuite contenir une autre vue où je peux afficher un aperçu de l'image. 60 00:04:44,770 --> 00:04:50,500 Donc, là-dedans, je veux avoir le composant texte où je dis qu'aucune image n'a encore été sélectionnée, ce qui est mon contenu de 61 00:04:50,530 --> 00:04:52,840 secours si aucune image n'a encore été sélectionnée, sinon 62 00:04:52,930 --> 00:04:54,920 je vais afficher une image, donc nous 63 00:04:54,940 --> 00:04:59,700 devrons également importer le composant image à partir de React Native et en dessous de cette vue, je 64 00:04:59,710 --> 00:05:09,180 vais ajouter un bouton avec un titre de prise d'image où je veux définir la couleur sur Couleurs. primaire, donc pour cela, assurez-vous 65 00:05:09,190 --> 00:05:17,410 d'importer ces couleurs constantes et sur une pression, je veux ouvrir 66 00:05:17,500 --> 00:05:27,530 la caméra et l'afficher à l'utilisateur. Je vais donc également ajouter une constante ici, prendre le gestionnaire d'image et c'est une 67 00:05:27,530 --> 00:05:29,480 fonction qui devrait ouvrir la 68 00:05:29,480 --> 00:05:33,140 caméra et c'est la fonction que je lierai à ce bouton. 69 00:05:33,170 --> 00:05:42,470 Maintenant, un certain style serait bien. Sur cette vue extérieure, je vais ajouter un style de sélecteur d'images, 70 00:05:42,800 --> 00:05:45,860 sur cette vue intérieure qui affiche un 71 00:05:45,860 --> 00:05:55,020 aperçu de mon image, je vais ajouter un style de prévisualisation d'image. Ensuite, ce texte ici pourrait également être stylisé, mais je n'ai en fait besoin 72 00:05:55,020 --> 00:06:02,910 d'aucun style spécial là-bas et bien sûr, je veux également afficher une image ici et je vais bientôt ajouter une condition if / else 73 00:06:02,910 --> 00:06:05,120 pour afficher uniquement le texte ou 74 00:06:05,270 --> 00:06:09,030 l'image et ce devrait également obtenir un style d'image peut-être juste. 75 00:06:09,030 --> 00:06:13,620 Alors maintenant, nous avons trois identificateurs de style que nous devons ajouter à 76 00:06:13,890 --> 00:06:17,440 la feuille de style, nous obtenons le sélecteur d'image 77 00:06:17,610 --> 00:06:22,440 pour le composant global, obtenons l'aperçu de l'image et ensuite nous avons l'image elle-même. 78 00:06:22,440 --> 00:06:28,560 L'image elle-même est simple, là je veux juste définir une largeur de 100% et une hauteur de 100% pour 79 00:06:28,560 --> 00:06:32,670 qu'elle prenne toute la largeur et la hauteur du conteneur d'aperçu environnant. 80 00:06:32,670 --> 00:06:36,750 Ce conteneur peut alors bien sûr être configuré comme vous le souhaitez, je vais 81 00:06:36,870 --> 00:06:41,550 lui donner une largeur de 100% et une hauteur de 200 pixels mais bien sûr vous 82 00:06:41,550 --> 00:06:47,880 pouvez changer cela ou le calculer dynamiquement avec l'API dimensions. Ajoutez une marge au bas de 10 83 00:06:47,880 --> 00:06:55,400 et assurez-vous que mon texte d'espace réservé serait effectivement centré en ajoutant justifier le centre de contenu 84 00:06:55,400 --> 00:06:59,470 et aligner le centre des éléments ici et en 85 00:06:59,730 --> 00:07:08,460 plus de cela, j'ajouterai également une bordure ici avec une couleur de bordure gris clair et une largeur de bordure 86 00:07:08,460 --> 00:07:09,500 de un. 87 00:07:09,720 --> 00:07:15,270 Maintenant, pour le composant sélecteur d'images en général, je vais simplement définir cela pour aligner le centre des éléments 88 00:07:15,270 --> 00:07:19,020 pour vous assurer que tous les éléments sont centrés horizontalement, mais 89 00:07:19,080 --> 00:07:22,910 maintenant nous sommes tous là pour vraiment ouvrir la caméra de l'appareil, non? 90 00:07:23,010 --> 00:07:28,680 Donc, avant de faire quoi que ce soit d'autre ici concernant l'aperçu et ainsi 91 00:07:28,700 --> 00:07:40,720 de suite, assurons-nous qu'ici dans le gestionnaire de prise d'image, nous ouvrons réellement la caméra et pour cela, importons tout comme sélecteur d'image depuis le sélecteur d'image expo, donc à 92 00:07:41,500 --> 00:07:48,460 partir de ce package que vous venez d'installer. Maintenant que j'ai utilisé le sélecteur d'images ici et 93 00:07:48,490 --> 00:07:54,360 aussi pour le composant, nous aurons un conflit de noms, donc je vais nommer ce sélecteur 94 00:07:54,390 --> 00:07:59,860 d'img ici juste pour éviter ce conflit de noms qui autrement causerait des problèmes, changez-le 95 00:07:59,920 --> 00:08:02,910 également ici lors de l'exportation de cours. 96 00:08:02,920 --> 00:08:06,610 Alors maintenant, avec le sélecteur d'images importé ici, nous pouvons l'utiliser ici, 97 00:08:06,610 --> 00:08:07,700 sélecteur d'images et 98 00:08:07,840 --> 00:08:10,930 là, nous pouvons appeler le lancement de la caméra asynchrone. 99 00:08:10,960 --> 00:08:13,810 Vous pouvez également ouvrir la galerie à la place 100 00:08:13,810 --> 00:08:18,000 si vous le souhaitez, mais ici, je vais appeler le lancement de la caméra asynchrone. 101 00:08:18,140 --> 00:08:25,070 Maintenant, cela ouvrira la caméra de l'appareil et la partie asynchrone implique ici qu'il s'agit d'une 102 00:08:25,070 --> 00:08:26,120 opération asynchrone. 103 00:08:26,120 --> 00:08:31,550 En effet, cela renvoie une promesse, ce qui est logique car cela ouvre la caméra et nous 104 00:08:31,550 --> 00:08:33,740 ne savons pas quand l'utilisateur aura 105 00:08:33,740 --> 00:08:39,920 fini de prendre l'image, il enregistrera donc simplement une fonction qu'il devrait exécuter une fois que l'utilisateur aura terminé et 106 00:08:39,920 --> 00:08:44,930 résolu la promesse d'exécuter cette fonction une fois que cela se produit, une fois que l'utilisateur 107 00:08:44,930 --> 00:08:51,400 a terminé ou bien sûr une fois que l'utilisateur annule. Nous pouvons gérer tout cela et le résultat et ainsi de 108 00:08:51,400 --> 00:08:57,450 suite plus tard, pour l'instant voyons si cela fonctionne et pour cela, incluons le composant sélecteur d'images dans le nouvel écran de lieu. 109 00:08:57,490 --> 00:09:03,670 Donc là, nous pouvons importer le sélecteur d'images et ici, bien sûr, nous pouvons utiliser ce nom 110 00:09:03,670 --> 00:09:10,960 parce que nous n'utilisons pas le package de sélecteur d'images ici, l'importer à partir de composants, du composant sélecteur d'images et 111 00:09:10,990 --> 00:09:17,780 ajouter ce sélecteur d'images ici en dessous de notre entrée de texte comme un composant à fermeture automatique comme celui-ci. 112 00:09:17,800 --> 00:09:22,300 Maintenant, si nous enregistrons cela, jetons un coup d'œil. Ici, ce texte et ainsi 113 00:09:22,320 --> 00:09:27,720 de suite, qui n'est pas positionné correctement, nous n'avons pas besoin de nous en soucier pour 114 00:09:27,720 --> 00:09:35,930 le moment, pressons plutôt de prendre l'image et ce que vous verrez, c'est que rien ne se passe mais je reçois un avertissement - 115 00:09:35,960 --> 00:09:45,360 caméra manquante ou autorisation de roulage de la caméra. Sur Android, si je l'essaye, on me demande si je veux accorder des autorisations. J'ai besoin d'appuyer sur autoriser ici et 116 00:09:45,360 --> 00:09:51,240 avec cela, la caméra s'ouvre. Donc c'est bien, ça marche généralement, je peux 117 00:09:51,240 --> 00:09:52,450 l'utiliser, je peux 118 00:09:52,470 --> 00:09:56,790 donc appuyer sur ce bouton puis confirmer l'image que j'ai prise mais sur 119 00:09:57,090 --> 00:10:04,440 iOS ça ne marche pas et pourquoi est-ce le cas? Eh bien sur iOS, nous avons eu une erreur d'autorisation ici 120 00:10:04,480 --> 00:10:05,260 et cela 121 00:10:05,320 --> 00:10:10,810 se produit simplement parce que les autorisations sont importantes mais qu'elles fonctionnent différemment sur iOS et Android. 122 00:10:11,500 --> 00:10:12,100 Sur 123 00:10:12,100 --> 00:10:18,600 Android, vous configurerez également les autorisations à l'avance et puisque nous utilisons cette application expo où expo fournit ce 124 00:10:18,600 --> 00:10:26,440 wrapper, expo fait en fait toutes ces autorisations configurées et nous demande. Pour iOS, le système d'autorisation fonctionne un 125 00:10:26,440 --> 00:10:28,310 peu différemment. 126 00:10:28,360 --> 00:10:34,390 Vous ne le configurez pas vraiment de telle sorte que vous ayez un fichier de configuration dans lequel vous définissez toutes les autorisations à 127 00:10:34,390 --> 00:10:34,900 l'avance 128 00:10:34,900 --> 00:10:38,540 et c'est tout, à la place, vous devez demander la permission au moment de l'exécution. 129 00:10:38,590 --> 00:10:43,040 En passant, dans certaines versions d'Android, vous devriez également le faire maintenant. 130 00:10:43,210 --> 00:10:49,600 Toujours là, expo comme vous le voyez le fait pour vous, donc pour Android, cela fonctionne comme ça, sur iOS 131 00:10:49,600 --> 00:10:56,050 non, vous devez demander à l'utilisateur la permission d'accéder à la caméra et c'est simplement quelque chose que nous devons 132 00:10:56,050 --> 00:10:59,890 faire ici et nous pouvons le faire avec l'aide d'un autre package 133 00:10:59,890 --> 00:11:02,680 expo et c'est le package des autorisations. 134 00:11:02,710 --> 00:11:08,890 Vous devez également l'installer avec cette commande ici dans votre projet afin de pouvoir demander des 135 00:11:08,890 --> 00:11:10,230 autorisations à l'utilisateur. 136 00:11:10,420 --> 00:11:12,640 Alors faisons-le ici dans le projet, 137 00:11:12,640 --> 00:11:19,570 exécutons les autorisations expo install expo qui est à nouveau juste ce wrapper autour de npm install pour installer les autorisations pour 138 00:11:19,570 --> 00:11:26,050 ce projet ou pour installer ce package pour ce projet, puis dans le sélecteur d'images avant d'essayer de lancer le 139 00:11:26,050 --> 00:11:33,580 caméra et en ouvrant la caméra, nous devrons demander des autorisations. Pour cela, je vais ajouter une 140 00:11:33,580 --> 00:11:41,260 nouvelle constante ici, obtenir ou vérifier les autorisations et ceci est une fonction qui 141 00:11:41,430 --> 00:11:47,310 contient une fonction qui utilisera ce package d'autorisations nouvellement ajouté. 142 00:11:47,310 --> 00:11:52,050 Donc ici, j'importe tout en tant qu'autorisations à partir des autorisations expo, donc le 143 00:11:52,050 --> 00:11:55,280 même type d'importation que nous l'avons pour le 144 00:11:55,590 --> 00:12:00,420 sélecteur d'images, puis là, nous pouvons utiliser des autorisations et demander de manière asynchrone. 145 00:12:00,420 --> 00:12:06,270 Encore une fois, c'est une tâche asynchrone qui renvoie une promesse car cela ouvrira une invite et avant que 146 00:12:06,270 --> 00:12:08,810 l'utilisateur n'ait choisi une réponse, rien ne se 147 00:12:08,820 --> 00:12:14,760 passera, donc nous avons une promesse qui se résout ou est rejetée une fois que l'utilisateur a confirmé ou refusé. 148 00:12:16,560 --> 00:12:20,090 Donc, ici, nous devons alors être plus précis sur les autorisations dont 149 00:12:20,100 --> 00:12:26,940 nous avons besoin, alors nous passons quelque chose à demander async et c'est une constante que nous obtenons de l'objet d'autorisations que nous importons 150 00:12:26,940 --> 00:12:27,270 ici. 151 00:12:27,660 --> 00:12:33,630 Donc, avec la notation par points ici, nous pouvons accéder à différents types d'autorisations et ici, tous ces noms en majuscules 152 00:12:33,690 --> 00:12:36,660 sont les différentes autorisations que vous pouvez demander et 153 00:12:36,660 --> 00:12:41,660 ici, nous avons besoin de l'autorisation de la caméra parce que nous voulons accéder à la caméra. 154 00:12:41,710 --> 00:12:46,340 Si vous vouliez accéder à la galerie, ce serait d'ailleurs la permission de rouler la caméra. 155 00:12:47,850 --> 00:12:49,850 Maintenant, je vais prendre la caméra 156 00:12:50,700 --> 00:12:54,390 ici et comme je l'ai dit, cela renvoie une promesse, je veux 157 00:12:54,420 --> 00:13:00,410 utiliser async attendre ici, donc je peux ajouter async ici devant la fonction, puis attendre cela et obtenir 158 00:13:00,440 --> 00:13:01,500 le résultat 159 00:13:01,500 --> 00:13:06,470 et le stocker dans une constante , l'alternative à cela serait alors d'utiliser et de 160 00:13:06,780 --> 00:13:14,010 rattraper cela et là, nous pouvons maintenant vérifier si le résultat. l'état n'est pas égal à accordé, ce qui signifie que l'utilisateur a 161 00:13:14,010 --> 00:13:16,210 refusé, l'utilisateur n'a pas accordé d'autorisations, 162 00:13:16,290 --> 00:13:18,770 dans ce cas, nous ne pouvons pas continuer. 163 00:13:18,780 --> 00:13:25,590 Alors ici, je vais lancer une alerte, alors importez l'alerte 164 00:13:25,590 --> 00:13:40,420 de React Native et lancez une alerte où je dis alerte. alerte, autorisations insuffisantes, vous devez accorder des autorisations d'application de caméra pour utiliser cette application ou toute sortie 165 00:13:40,480 --> 00:13:42,890 que vous souhaitez afficher, puis 166 00:13:43,000 --> 00:13:49,690 j'ajouterai un bouton ici où je dis OK. Maintenant, l'utilisateur devra de toute façon modifier les autorisations 167 00:13:49,690 --> 00:13:55,000 dans les paramètres système, nous ne pouvons donc pas demander à nouveau des autorisations ici une 168 00:13:55,000 --> 00:13:56,950 fois qu'elles ont été refusées. 169 00:13:56,950 --> 00:14:02,950 Donc ici, je veux retourner false parce que c'est la fonction de vérification des autorisations et je veux 170 00:14:02,950 --> 00:14:06,790 retourner false si l'utilisateur ne nous a pas accordé d'autorisations, je 171 00:14:06,790 --> 00:14:10,080 renvoie true sinon parce que maintenant nous savons que 172 00:14:10,090 --> 00:14:14,920 nous avons des autorisations Par ailleurs si nous appelons cela fonctionner plusieurs fois et 173 00:14:14,920 --> 00:14:20,050 l'utilisateur a déjà accordé des autorisations dans le passé, l'utilisateur ne sera plus présenté à cette 174 00:14:20,050 --> 00:14:27,880 invite, de la même façon si l'utilisateur a refusé, dans les deux cas, le résultat est stocké automatiquement par iOS et cette fonction ne 175 00:14:27,880 --> 00:14:33,400 fera que retourne vrai ou faux selon que l'utilisateur a refusé ou accordé l'accès dans le passé. 176 00:14:33,400 --> 00:14:37,350 Vérifiez donc que les autorisations sont maintenant simplement une fonction que nous devons appeler 177 00:14:37,350 --> 00:14:40,590 dans le gestionnaire de prise d'image avant d'essayer d'utiliser l'appareil photo. 178 00:14:40,780 --> 00:14:46,600 Donc ici, je veux aussi utiliser async wait car vérifier les autorisations est bien sûr une 179 00:14:46,660 --> 00:14:47,600 fonction qui 180 00:14:47,770 --> 00:14:55,080 retourne une promesse, donc j'attendrai ceci et je stockerai le résultat que je stockerai dans une constante nommée a permission car 181 00:14:56,100 --> 00:15:01,020 c'est vrai ou faux selon que l'utilisateur a accordé ou non des autorisations. 182 00:15:01,020 --> 00:15:05,580 Maintenant, si c'est faux, donc si ce n'est pas vrai, je reviendrai ici, je ne continuerai pas, je n'ouvrirai 183 00:15:05,580 --> 00:15:11,100 pas la caméra parce que je ne serai pas autorisé à le faire de toute façon, donc nous ne pouvons tout simplement pas 184 00:15:11,100 --> 00:15:11,580 continuer, 185 00:15:11,580 --> 00:15:12,360 c'est la chose. 186 00:15:13,500 --> 00:15:17,910 Sinon, nous pouvons continuer et maintenant nous devrions également pouvoir lancer une caméra sur iOS. 187 00:15:17,940 --> 00:15:18,810 Alors essayons, 188 00:15:18,810 --> 00:15:19,720 sauvons ça et 189 00:15:19,830 --> 00:15:25,750 maintenant avec ça changé, je vais en fait désinstaller expo ici pour m'assurer qu'en ce qui concerne les 190 00:15:25,750 --> 00:15:29,530 permissions que j'y ai accordées, c'est de retour à l'état initial. 191 00:15:29,640 --> 00:15:33,860 Vous n'avez probablement pas besoin de le faire si vous n'avez jamais accordé d'autorisations 192 00:15:33,900 --> 00:15:39,810 dans votre application expo, mais si vous avez joué avec des autorisations et des packages natifs auparavant, vous devez désinstaller puis 193 00:15:39,810 --> 00:15:44,870 réinstaller l'application expo en exécutant à nouveau votre application sur iOS en appuyant sur i dans la console 194 00:15:44,890 --> 00:15:47,910 là-bas pour vous assurer que toutes ces autorisations sont réinitialisées. 195 00:15:47,910 --> 00:15:53,220 Alors maintenant, si nous allons sur le nouvel écran de lecture et que nous cliquons sur Prendre une image, 196 00:15:53,490 --> 00:16:00,120 on me demande si je veux accorder l'accès à la caméra et ici je peux cliquer sur OK et maintenant nous obtenons toujours cette erreur. 197 00:16:01,490 --> 00:16:07,420 Maintenant, la seule raison à cela est que même si nous essayons d'accéder à la caméra ici, cela en fait et c'est juste 198 00:16:07,420 --> 00:16:12,450 quelque chose que je sais pour ce package nécessite des autorisations pour le rouleau complet de la caméra. 199 00:16:12,450 --> 00:16:16,020 Modifions cela pour demander des autorisations sur le rôle de l'appareil photo ici 200 00:16:22,830 --> 00:16:25,880 et avec cela, revenons en arrière et cliquez sur prendre une 201 00:16:25,880 --> 00:16:32,550 image, maintenant je demande si je veux autoriser l'accès aux photos et maintenant si je clique sur oui, l'appareil photo n'est pas disponible sur 202 00:16:32,560 --> 00:16:37,710 le simulateur qui est maintenant une erreur différente et est assez clair quant à ce qui est en cause, 203 00:16:37,780 --> 00:16:43,510 le simulateur iOS n'a tout simplement pas de caméra. Je vais donc continuer sur Android à 204 00:16:43,510 --> 00:16:47,380 partir de maintenant mais bien sûr vous pouvez tester cela sur 205 00:16:47,380 --> 00:16:54,250 un vrai iPhone pour voir que là, ça marche aussi. Si vous y scannez votre code à barres expo avec l'application expo et que 206 00:16:54,250 --> 00:16:56,000 vous y exécutez l'application telle que vous 207 00:16:56,050 --> 00:17:02,020 l'avez vue au début du cours, vous pouvez prendre des images avec un vrai téléphone et je ferai également la démonstration de l'application terminée à 208 00:17:02,200 --> 00:17:05,750 la fin de ce module sur les appareils iOS et Android, sur les appareils réels. 209 00:17:05,890 --> 00:17:10,600 Donc pour le moment, je vais me concentrer sur Android et là bien sûr, nous avons déjà pu l'ouvrir. 210 00:17:10,690 --> 00:17:18,530 On me demande encore ici mais maintenant je peux l'ouvrir et prendre une image. C'est bien sûr sympa mais prendre l'image comme ça n'est pas tout 211 00:17:18,530 --> 00:17:20,490 ce que je veux faire, je 212 00:17:20,570 --> 00:17:24,590 veux aussi pouvoir configurer comment je le prends et je veux pouvoir l'utiliser.