TouchabelOpacity funciona bien en iOS, pero el método onPress no me funciona en Android.
Mi versión nativa de reacción: 0.57.4
Mi código:
const initDrawer = navigation => (
<TouchableOpacity
style={{ left: 16 }}
onPress={() => onPressDrawerButton(navigation)}
>
<Ionicons name="ios-menu" color="white" size={30} />
</TouchableOpacity>
);
Tuve un problema similar. Presta atención desde dónde importa tu “TouchableOpacity”. Cuando cambié “TouchableOpacity” de “react-native-gesture-handler” a “react-native”, funcionó para mí (para la plataforma Android)
-
Recomiendo agregar una regla de importaciones no restringidas de eslint que prohíba la importación desde react-native-gesture-handler.
'no-restricted-imports': [ 'error', { paths: [ { name: 'react-native-gesture-handler', importNames: ['TouchableOpacity'], message: 'Import TouchableOpacity from react-native instead', }, ], }, ],
– Sampo
7 de abril de 2020 a las 8:04
-
Para mí, funcionó cuando cambié de react-native a react-native-gesture-handler
– Amogh Jahagirdar
6 de septiembre de 2020 a las 7:54
-
esta importación automática del controlador de gestos rn es increíblemente molesta
– Jován
19 de marzo de 2021 a las 15:54
-
gracias por sus comentarios chicos, estoy muy feliz de ayudarlos y salvarles el día con esta breve pero importante respuesta
– Alí
29 de mayo de 2021 a las 7:12
-
Podría haberme tomado horas averiguarlo. Gracias por mencionarlo. @Ali
– Ahmad Habib
21 oct 2022 a las 11:18
Tuve el mismo problema, todos los botones TouchableOpacity funcionaban bien en la compilación de iOS, pero había uno en Android que no se activaba. Me topé con esta respuesta aquí que mencionaba que position: absolute
estropearía el gatillo. Resolvió mi problema.
-
Resolví mi problema de una manera similar. En términos de jerarquía, tenía una vista dentro de una opacidad táctil; Estaba agregando posicionamiento a la Vista asumiendo que Touchable Opacity también adoptaría su posicionamiento secundario, y ahí es donde estaba mi problema, tocar la vista no ejecutaría mi método porque Touchable Opacity tenía un posicionamiento diferente al de su hijo. Lo resolví haciendo posicionamiento en Touchable Opacity en lugar de View. Espero que esto ayude a alguien.
– usuario4414149
20 de febrero de 2020 a las 14:40
-
Este fue mi problema también. La posición absoluta impidió que se activara la función onPress. Gracias por la ayuda homie.
– Jo Mamá
2 de junio de 2021 a las 1:06
-
Esto funciona para mí, muchas gracias!
– olawalejuwonm
10/01/2022 a las 21:00
-
Chris, te mereces una medalla.
– Yuniac
2 de septiembre de 2022 a las 14:27
tae ha
terminación el servidor de metro (en caso de que se esté ejecutando actualmente) y luego correr todo de nuevo (como a continuación) funcionó para mí.
en la consola que ejecuta el servidor metro, Terminar él
ctrl + c
luego en la otra consola, correr tu aplicación
react-native run-android
o
npx react-native run-android
Noble Kuz
Compruebe la biblioteca desde la que está importando la opacidad táctil. Importarlo desde “react-native”. no de “react-native-gesture-handler”
Utilizar esta
import { TouchableOpacity } from 'react-native';
en lugar de esto
import { TouchableOpacity } from 'react-native-gesture-handler';
Para mí, funcionaba, pero el área táctil era muy pequeña. De alguna manera, el área en iOS era más grande que en Android.
Terminé aumentando el área táctil usando el hitSlop
propiedad de la siguiente manera:
<TouchableOpacity
onPress={() => {}}
hitSlop={{ top: 30, bottom: 30, left: 30, right: 30 }}
>
<Icon name="eye" />
</TouchableOpacity>
-
Todo el mundo parece cambiar rápidamente las importaciones sin preguntar por qué lo soluciona. En mi caso, tuve que usar la versión nativa ya que la versión react-native-gesture-handler no disfrutaba de la animación. La respuesta de Mateo fue el enfoque correcto para mí, ya que el área de impacto en Android era cero, mientras que en iOS adoptaba el tamaño de sus hijos. En mi caso, el contenido tenía una altura fija, por lo que solo podía establecer la altura de TouchableOpacity para que coincidiera.
– tdous
6 de enero de 2022 a las 14:20
Aayush Bhattacharya
en mi caso, importé TouchableOpacity de ‘react-native-gesture-handler’ después de agregarlo de ‘react-native’ funcionó
-
Todo el mundo parece cambiar rápidamente las importaciones sin preguntar por qué lo soluciona. En mi caso, tuve que usar la versión nativa ya que la versión react-native-gesture-handler no disfrutaba de la animación. La respuesta de Mateo fue el enfoque correcto para mí, ya que el área de impacto en Android era cero, mientras que en iOS adoptaba el tamaño de sus hijos. En mi caso, el contenido tenía una altura fija, por lo que solo podía establecer la altura de TouchableOpacity para que coincidiera.
– tdous
6 de enero de 2022 a las 14:20
Matt Yoon
Verifique si presionar el Touchable por más tiempo funciona. En mi caso, estaba probando en un teléfono Android y renderizando múltiples TouchableOpacity
ralentizó el teléfono que si tocaba el componente demasiado brevemente, no se registraría como una pulsación válida.
Según el documento oficial de onPress
cancelará la pulsación inválida:
https://reactnative.dev/docs/touchablewithoutfeedback#onpress
En ese caso puedes usar onPressOut
o onPressIn
en lugar de onPress
para que tu toque sea siempre válido.
-
muchas gracias, eso funcionó para mí y estuve tan cerca de volverme loco 🙂
– yasin demir
21 de septiembre de 2021 a las 7:59
-
Tuve un problema similar solo para los dispositivos de la serie Samsung S. Mi TochableOpacity funcionaba de manera inconsistente y luché por encontrar una solución durante un par de meses. Esto lo arregló. Gracias
– Sara Raj
10 oct 2021 a las 9:04
Puedo confirmar que funciona bien en Android con la versión 0.57.7. ¿Puede permitirse el lujo de actualizar?
– Benoit
29 de noviembre de 2018 a las 23:16