Events
Subscribe to speech synthesis lifecycle events with utterance IDs.
Subscribe to event callbacks for speech synthesis lifecycle monitoring. Each callback receives an id property that corresponds to the utterance ID returned by speak() or speakWithOptions(). This allows you to handle events for specific speech operations independently.
Each subscription exposes a remove() method for cleanup.
Why use utterance IDs?
Utterance IDs enable precise event tracking when handling multiple concurrent or sequential speech operations:
// Start first speech
const id1 = await Speech.speak('Hello');
// Start second speech
const id2 = await Speech.speak('World');
// Handle events only for the first speech
Speech.onFinish(({id}) => {
if (id === id1) {
console.log('First speech finished');
} else if (id === id2) {
console.log('Second speech finished');
}
});onStart
Triggers when speech starts.
const startSubscription = Speech.onStart(({id}) => {
console.log(`Speech started (ID: ${id})`);
});
// Cleanup
startSubscription.remove();onFinish
Triggers when speech completes.
const finishSubscription = Speech.onFinish(({id}) => {
console.log(`Speech finished (ID: ${id})`);
});
// Cleanup
finishSubscription.remove();onPause
Triggers when speech is paused. On Android, API 26+ (Android 8+) is required.
const pauseSubscription = Speech.onPause(({id}) => {
console.log(`Speech paused (ID: ${id})`);
});
// Cleanup
pauseSubscription.remove();onResume
Triggers when speech is resumed. On Android, API 26+ (Android 8+) is required.
const resumeSubscription = Speech.onResume(({id}) => {
console.log(`Speech resumed (ID: ${id})`);
});
// Cleanup
resumeSubscription.remove();onStopped
Triggers when speech is stopped.
const stoppedSubscription = Speech.onStopped(({id}) => {
console.log(`Speech stopped (ID: ${id})`);
});
// Cleanup
stoppedSubscription.remove();onProgress
Triggers during speech with progress information. On Android, API 26+ (Android 8+) is required.
Callback parameters:
id: the utterance identifier.length: the text being spoken length.location: the current position in the spoken text.
const progressSubscription = Speech.onProgress(({id, location, length}) => {
console.log(
`Speech ${id} progress, current word length: ${length}, current char position: ${location}`,
);
});
// Cleanup
progressSubscription.remove();onProgress reports word ranges you can feed straight into the
HighlightedText component for
real-time speech visualization. See the
examples.
onError
Triggers when an error occurs.
const errorSubscription = Speech.onError(({id}) => {
console.error(`Speech error (ID: ${id})`);
});
// Cleanup
errorSubscription.remove();