NativeScript Speech Recognition
This is the plugin demo in action..
|..while recognizing Dutch 🇳🇱||.. after recognizing American-English 🇺🇸|
From the command prompt go to your app's root folder and execute:
ns plugin add nativescript-speech-recognition
NativeScript < 7:
tns plugin add firstname.lastname@example.org
You'll need to test this on a real device as a Simulator/Emulator doesn't have speech recognition capabilities.
Depending on the OS version a speech engine may not be available.
// require the pluginvar SpeechRecognition = SpeechRecognition;// instantiate the pluginvar speechRecognition = ;speechRecognition;
// import the plugin;
You can either let
startListening handle permissions when needed, but if you want to have more control
over when the permission popups are shown, you can use this function:
On iOS this will trigger two prompts:
The first prompt requests to allow Apple to analyze the voice input. The user will see a consent screen which you can extend with your own message by adding a fragment like this to
NSSpeechRecognitionUsageDescriptionMy custom recognition usage description. Overriding the default empty one in the plugin.
The second prompt requests access to the microphone:
NSMicrophoneUsageDescriptionMy custom microphone usage description. Overriding the default empty one in the plugin.
// import the options;this.speechRecognition.startListening.then,.catch;
If you're using this plugin in Angular, then note that the
onResult callback is not part of Angular's lifecycle.
So either update the UI in an
ngZone as shown here,
ChangeDetectorRef as shown here.
Demo app (Angular)
This plugin is part of the plugin showcase app I built using Angular.
Angular video tutorial
Rather watch a video? Check out this tutorial on YouTube.