Une bibliothèque de synthèse vocale pour React Native.
fil ajouter @react-native-voice/voice# ornpm i @react-native-voice/voice --save
Lier le package iOS
installation du pod npx
Enchaînement
Lier manuellement Android
Lier manuellement iOS
Plugin de pré-construction
Usage
Exemple
API
Événements
Autorisations
Androïde
IOS
Contributeurs
Lier manuellement ou automatiquement le NativeModule
lien de réaction natif @react-native-voice/voice
Dans android/setting.gradle
... include ':@react-native-voice_voice', ':app'project(':@react-native-voice_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-voice/ voix/android')
Dans android/app/build.gradle
...dépendances {... compiler le projet(':@react-native-voice_voice') }
Dans MainApplication.java
importer android.app.Application; importer com.facebook.react.ReactApplication; importer com.facebook.react.ReactPackage; ... importer com.wenkesj.voice.VoicePackage ; // <------ Ajoutez ceci !...classe publique MainActivity extends Activity implémente ReactApplication { ...@Overrideprotected List<ReactPackage> getPackages() { return Arrays.<ReactPackage>asList(new MainReactPackage(),new VoicePackage() // <------ Ajoutez ceci !); } }
Faites glisser le Voice.xcodeproj du dossier @react-native-voice/voice/ios vers le groupe Bibliothèques sur Xcode dans votre projet. Liaison manuelle
Cliquez sur le fichier de votre projet principal (celui qui représente le .xcodeproj), sélectionnez Build Phases et faites glisser la bibliothèque statique, lib.Voice.a, du dossier Libraries/Voice.xcodeproj/Products vers Link Binary With Libraries.
Ce package ne peut pas être utilisé dans l'application « Expo Go » car il nécessite un code natif personnalisé.
Après avoir installé ce package npm, ajoutez le plugin de configuration au tableau plugins
de votre app.json
ou app.config.js
:
{ "expo": {"plugins": ["@react-native-voice/voice"] } }
Ensuite, reconstruisez votre application comme décrit dans le guide « Ajout de code natif personnalisé ».
Le plugin fournit des accessoires pour une personnalisation supplémentaire. Chaque fois que vous modifiez les accessoires ou les plugins, vous devrez reconstruire (et prebuild
) l'application native. Si aucune propriété supplémentaire n’est ajoutée, les valeurs par défaut seront utilisées.
speechRecognition
( string | false ) : définit le message pour la clé NSSpeechRecognitionUsageDescription
dans le message Info.plist
. Lorsqu'il n'est pas défini, un message d'autorisation par défaut sera utilisé. Lorsque false
, l’autorisation sera ignorée.
microphone
( string | false ) : définit le message pour la clé NSMicrophoneUsageDescription
dans Info.plist
. Lorsqu'il n'est pas défini, un message d'autorisation par défaut sera utilisé. Lorsque false
, le android.permission.RECORD_AUDIO
ne sera pas ajouté au AndroidManifest.xml
et l'autorisation iOS sera ignorée.
{ "plugins": [ [ "@react-native-voice/voice", {"microphonePermission": "CUSTOM : autoriser $(PRODUCT_NAME) à accéder au microphone","speechRecognitionPermission": "CUSTOM : autoriser $(PRODUCT_NAME) à reconnaître en toute sécurité la parole de l'utilisateur" } ] ] }
Exemple complet pour Android et iOS.
importer la voix depuis '@react-native-voice/voice'; importer React, {Component} depuis 'react'; la classe VoiceTest étend le composant { constructeur (props) {Voice.onSpeechStart = this.onSpeechStartHandler.bind(this);Voice.onSpeechEnd = this.onSpeechEndHandler.bind(this);Voice.onSpeechResults = this.onSpeechResultsHandler.bind(this); } onStartButtonPress(e){Voice.start('en-US'); } ...}
Accès statique à l'API vocale.
Toutes les méthodes renvoient désormais une new Promise
pour la compatibilité async/await
.
Nom de la méthode | Description | Plate-forme |
---|---|---|
Voix.isAvailable() | Vérifie si un service de reconnaissance vocale est disponible sur le système. | Android, iOS |
Voice.start (locale) | Commence à écouter la parole pour une région spécifique. Renvoie null si aucune erreur ne se produit. | Android, iOS |
Voix.stop() | Arrête d'écouter la parole. Renvoie null si aucune erreur ne se produit. | Android, iOS |
Voix.cancel() | Annule la reconnaissance vocale. Renvoie null si aucune erreur ne se produit. | Android, iOS |
Voix.destroy() | Détruit l'instance actuelle de SpeechRecognizer. Renvoie null si aucune erreur ne se produit. | Android, iOS |
Voice.removeAllListeners() | Nettoie/annule les méthodes statiques Voice remplacées. | Android, iOS |
Voice.isRecognizing() | Renvoie si SpeechRecognizer reconnaît. | Android, iOS |
Voice.getSpeechRecognitionServices() | Renvoie une liste des moteurs de reconnaissance vocale disponibles sur l'appareil. (Exemple : ['com.google.android.googlequicksearchbox'] si Google est le seul disponible.) | Androïde |
Rappels invoqués lors de l'émission d'un événement natif.
Nom de l'événement | Description | Événement | Plate-forme |
---|---|---|---|
Voice.onSpeechStart (événement) | Invoqué lorsque .start() est appelé sans erreur. | { error: false } | Android, iOS |
Voice.onSpeechRecognized (événement) | Invoqué lorsque la parole est reconnue. | { error: false } | Android, iOS |
Voice.onSpeechEnd (événement) | Invoqué lorsque SpeechRecognizer arrête la reconnaissance. | { error: false } | Android, iOS |
Voice.onSpeechError (événement) | Invoqué lorsqu'une erreur se produit. | { error: Description of error as string } | Android, iOS |
Voice.onSpeechResults (événement) | Invoqué lorsque SpeechRecognizer a fini de reconnaître. | { value: [..., 'Speech recognized'] } | Android, iOS |
Voice.onSpeechPartialResults (événement) | Invoqué lorsque des résultats sont calculés. | { value: [..., 'Partial speech recognized'] } | Android, iOS |
Voice.onSpeechVolumeChanged (événement) | Invoqué lorsque la hauteur reconnue a changé. | { value: pitch in dB } | Androïde |
Sans doute la partie la plus importante.
Bien que l'application VoiceTest
incluse fonctionne sans vérifications ni demandes d'autorisations explicites, il peut être nécessaire d'ajouter une demande d'autorisation pour RECORD_AUDIO
pour certaines configurations. Depuis Android M (6.0), l'utilisateur doit accorder l'autorisation au moment de l'exécution (et non lors de l'installation de l'application). Par défaut, l'appel de la méthode startSpeech
invoquera la fenêtre contextuelle d'autorisation RECORD AUDIO
à l'utilisateur. Cela peut être désactivé en passant REQUEST_PERMISSIONS_AUTO: true
dans l'argument options.
Si vous exécutez une application expo/expokit éjectée, vous pouvez rencontrer des problèmes d'autorisations sur Android et obtenir l'erreur suivante host.exp.exponent.MainActivity cannot be cast to com.facebook.react.ReactActivity startSpeech
. Ce problème peut être résolu en demandant l'autorisation à l'aide du package expo-permission
avant de commencer la reconnaissance.
import { Autorisations } from "expo";async componentDidMount() {const { status, expires, permissions } = wait Permissions.askAsync(Permissions.AUDIO_RECORDING);if (status !== "granted") {//Autorisations non accordées. N'affichez pas le bouton de démarrage de l'enregistrement car cela poserait des problèmes s'il est enfoncé.this.setState({showRecordButton: false});} else {this.setState({showRecordButton: true});}}
Remarques sur Android
Même une fois que toutes les autorisations sont correctes sur Android, il reste une dernière chose à faire pour vous assurer que cette bibliothèque fonctionne correctement sur Android. Veuillez vous assurer que l'appareil dispose d'un moteur de reconnaissance vocale Google tel que com.google.android.googlequicksearchbox
en appelant Voice.getSpeechRecognitionServices()
. Étant donné que les téléphones Android peuvent être configurés avec de nombreuses options, même si un appareil dispose du moteur Googlequicksearchbox, il peut être configuré pour utiliser d'autres services. Vous pouvez vérifier quel service est utilisé pour l'application d'assistance vocale en suivant les étapes suivantes pour la plupart des téléphones Android :
Settings > App Management > Default App > Assistive App and Voice Input > Assistive App
Le débit ci-dessus peut varier en fonction des modèles et des fabricants d'Android. Pour les téléphones Huawei, il est possible que l'appareil ne puisse pas installer les services Google.
Comment puis-je obtenir com.google.android.googlequicksearchbox
dans l'appareil ?
Veuillez demander aux utilisateurs d'installer l'application Google Search.
Besoin d'inclure les autorisations pour NSMicrophoneUsageDescription
et NSSpeechRecognitionUsageDescription
dans Info.plist pour iOS. Consultez le VoiceTest
inclus pour savoir comment gérer ces cas.
<dict> ... <key>NSMicrophoneUsageDescription</key> <string>Description de la raison pour laquelle vous avez besoin d'utiliser le microphone</string> <key>NSSpeechRecognitionUsageDescription</key> <string>Description de la raison pour laquelle vous avez besoin d'utiliser la reconnaissance vocale</string> ... </dict>
Veuillez consulter la documentation fournie par ReactNative pour cela : PermissionsAndroid
@asafron
@BrendanFDMoore
@brudny
@chitezh
@ifsnow
@jamsch
@misino
@Noitidart
@ohtangza & @hayanmind
@rudiedev6
@tdonia
@wenkesj