How to disable Android default "Touchable onPress" sound from react-native code?

Question

I'm developing an app for Android in react-native with expo. I'm using expo's Audio.Sound API in order to play different sounds in my app. What annoys me is that whenever I press a TouchableOpacity component I get both my sound and the default onPress sound from Android (it disappears only if I mute the sound from the hardware buttons of my phone). I'd like to disable the default sound. Is there a way to do this programatically from react-native code?

Answer 1

You can actually use touchSoundDisabled={true} which is not covered in TouchableOpacity docs, but is part of a Button component. But it still works for touchables as well

Answer 2

I had the exact same problem using TouchableWithoutFeedback. The touchable events always play the default android button noise when clicked.

The solution I found was to instead use the onStartShouldSetResponder prop of the View component. This basically turns a view into a button and is equivalent to the 'onPress' prop.

<View onStartShouldSetResponder={() => this.onPress()}/>

Answer 3

Use Pressable instead of TouchableOpacity and add android_disableSound={true}

<Pressable android_disableSound={true} onPress={() => {}}