Skip to content

Instantly share code, notes, and snippets.

@oovz

oovz/expo-speech-getAvailableVoicesAsync.jsx

Last active May 3, 2025 04:50
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save oovz/71b07d4beb6a85e7e3f86e65052f65fc to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save oovz/71b07d4beb6a85e7e3f86e65052f65fc to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. oovz revised this gist May 3, 2025. 1 changed file with 3 additions and 4 deletions.
    7 changes: 3 additions & 4 deletions expo-speech-getAvailableVoicesAsync.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -8,7 +8,6 @@ export default function App() {
    const [isLoading, setIsLoading] = useState(true);

    useEffect(() => {
    // Define an async function inside useEffect
    const fetchNumber = async () => {
    try {
    const voices = await Speech.getAvailableVoicesAsync();
    @@ -17,12 +16,12 @@ export default function App() {
    console.error("Error fetching voices.length:", error);
    setVoicesNumber('Error');
    } finally {
    setIsLoading(false); // Set loading to false in both success and error cases
    setIsLoading(false);
    }
    };

    fetchNumber(); // Call the async function
    }, []); // Runs once on mount
    fetchNumber();
    }, []);

    return (
    <SafeAreaView style={styles.container}>
  2. oovz created this gist May 2, 2025.
    49 changes: 49 additions & 0 deletions expo-speech-getAvailableVoicesAsync.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,49 @@
    import { Text, SafeAreaView, StyleSheet, ActivityIndicator, View } from 'react-native';
    import React, { useState, useEffect } from 'react';

    import * as Speech from 'expo-speech';

    export default function App() {
    const [voicesNumber, setVoicesNumber] = useState(null);
    const [isLoading, setIsLoading] = useState(true);

    useEffect(() => {
    // Define an async function inside useEffect
    const fetchNumber = async () => {
    try {
    const voices = await Speech.getAvailableVoicesAsync();
    setVoicesNumber(voices.length);
    } catch (error) {
    console.error("Error fetching voices.length:", error);
    setVoicesNumber('Error');
    } finally {
    setIsLoading(false); // Set loading to false in both success and error cases
    }
    };

    fetchNumber(); // Call the async function
    }, []); // Runs once on mount

    return (
    <SafeAreaView style={styles.container}>
    <View style={styles.loadingContainer}>
    {isLoading ? (
    <ActivityIndicator size="large" color="#0000ff" />
    ) : (
    <Text style={styles.numberDisplay}>
    Voice length is: {voicesNumber}
    </Text>
    )}
    </View>
    </SafeAreaView>
    );
    }

    const styles = StyleSheet.create({
    container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
    }
    });