TouchabelOpacity funktioniert gut auf iOS, aber die onPress-Methode funktioniert bei mir nicht auf Android.
Meine React-native Version: 0.57.4
Mein Code:
const initDrawer = navigation => (
<TouchableOpacity
style={{ left: 16 }}
onPress={() => onPressDrawerButton(navigation)}
>
<Ionicons name="ios-menu" color="white" size={30} />
</TouchableOpacity>
);
Ich hatte ein ähnliches Problem. Achten Sie darauf, woher Sie Ihre “TouchableOpacity” importieren. Als ich “TouchableOpacity” von “react-native-gesture-handler” auf “react-native” änderte, funktionierte es für mich (für Android-Plattform)
Ich empfehle, eine eslint no-restricted-imports-Regel hinzuzufügen, die den Import von React-native-gesture-handler verbietet. 'no-restricted-imports': [ 'error', { paths: [ { name: 'react-native-gesture-handler', importNames: ['TouchableOpacity'], message: 'Import TouchableOpacity from react-native instead', }, ], }, ],
– Sampo
7. April 2020 um 8:04 Uhr
Bei mir hat es funktioniert, als ich von React-Native zu React-Native-Gesture-Handler gewechselt bin
– Amog Jahagirdar
6. September 2020 um 7:54 Uhr
Dieser automatische Import des rn-Gesten-Handlers ist unglaublich nervig
– jowan
19. März 2021 um 15:54 Uhr
Vielen Dank für Ihre Rückmeldungen, Jungs, ich freue mich sehr, Ihnen mit dieser kurzen, aber wichtigen Antwort zu helfen und Ihren Tag zu retten
– Ali
29. Mai 2021 um 7:12 Uhr
Ich hätte Stunden brauchen können, um es herauszufinden. Danke für den Hinweis. @ Ali
– Ahmad Habib
21. Oktober 2022 um 11:18 Uhr
Ich hatte das gleiche Problem, alle TouchableOpacity-Schaltflächen funktionierten einwandfrei im iOS-Build, aber es gab eine in Android, die nicht ausgelöst wurde. Ich bin über diese Antwort hier gestolpert, die das erwähnt hat position: absolute würde den Abzug vermasseln. Es hat mein Problem gelöst.
Ich habe mein Problem ähnlich gelöst. In Bezug auf die Hierarchie hatte ich eine Ansicht innerhalb einer berührbaren Opazität; Ich fügte der Ansicht eine Positionierung hinzu, während ich annahm, dass die berührbare Opazität auch ihre untergeordnete Positionierung übernehmen würde, und dort lag mein Problem. Das Tippen auf die Ansicht würde meine Methode nicht ausführen, da die berührbare Opazität eine andere Positionierung hatte als ihr untergeordnetes Element. Ich habe es gelöst, indem ich auf Touchable Opacity statt auf View positioniert habe. Hoffe, das hilft jemandem.
– Benutzer4414149
20. Februar 2020 um 14:40 Uhr
Dies war auch mein Problem. Die absolute Position verhinderte das Auslösen der onPress-Funktion. Danke für die Hilfe Homie.
– Jo Mama
2. Juni 2021 um 1:06 Uhr
Das funktioniert für mich, vielen Dank!
– olawalejuwonm
10. Januar 2022 um 21:00 Uhr
Chris, du verdienst eine Medaille.
– Yuniac
2. September 2022 um 14:27 Uhr
tae ha
Beenden den Metro-Server (falls er gerade läuft) und dann Betrieb alles wieder (wie unten) hat bei mir funktioniert.
auf der Konsole, auf der der Metro-Server läuft, beenden Es
ctrl + c
dann auf der anderen Konsole, laufen Ihre Anwendung
react-native run-android
oder
npx react-native run-android
Edler Kuz
Überprüfen Sie die Bibliothek, aus der Sie die berührbare Deckkraft importieren. Importiere es von “react-native”. nicht von “react-native-gesture-handler”
Benutze das
import { TouchableOpacity } from 'react-native';
an Stelle von
import { TouchableOpacity } from 'react-native-gesture-handler';
Bei mir hat es funktioniert, aber der berührbare Bereich war sehr klein. Irgendwie war der Bereich in iOS größer als in Android.
Am Ende vergrößerte ich den berührbaren Bereich mit dem hitSlop Eigentum wie folgt:
<TouchableOpacity
onPress={() => {}}
hitSlop={{ top: 30, bottom: 30, left: 30, right: 30 }}
>
<Icon name="eye" />
</TouchableOpacity>
Jeder scheint schnell Importe zu wechseln, ohne zu fragen, warum es behoben wird. In meinem Fall musste ich die native Version verwenden, da die React-Native-Gesture-Handler-Version nicht gerne animiert wurde. Die Antwort von Mateo war für mich der richtige Ansatz, da die Trefferfläche auf Android null war, während es auf iOS die Größe seiner Kinder übernahm. In meinem Fall hatte der Inhalt eine feste Höhe, sodass ich einfach die Höhe der TouchableOpacity entsprechend einstellen konnte.
– tdous
6. Januar 2022 um 14:20 Uhr
Aayush Bhattacharya
In meinem Fall habe ich die TouchableOpacity von ‘react-native-gesture-handler’ importiert, nachdem ich sie von ‘react-native’ hinzugefügt hatte, es funktionierte
Jeder scheint schnell Importe zu wechseln, ohne zu fragen, warum es behoben wird. In meinem Fall musste ich die native Version verwenden, da die React-Native-Gesture-Handler-Version nicht gerne animiert wurde. Die Antwort von Mateo war für mich der richtige Ansatz, da die Trefferfläche auf Android null war, während es auf iOS die Größe seiner Kinder übernahm. In meinem Fall hatte der Inhalt eine feste Höhe, sodass ich einfach die Höhe der TouchableOpacity entsprechend einstellen konnte.
– tdous
6. Januar 2022 um 14:20 Uhr
Matt Yoon
Überprüfen Sie, ob das längere Drücken des Touchable funktioniert. In meinem Fall habe ich auf einem Android-Telefon getestet und mehrere gerendert TouchableOpacity verlangsamte das Telefon, dass, wenn ich die Komponente zu kurz berührte, es nicht als gültiges Drücken registriert wurde.
Laut dem offiziellen Dokument auf onPresswird ungültiges Drücken abgebrochen:
https://reactnative.dev/docs/touchablewithoutfeedback#onpress
In diesem Fall können Sie verwenden onPressOut oder onPressIn anstatt onPress um sicherzustellen, dass Ihre Berührung immer gültig ist.
vielen Dank, das hat bei mir funktioniert und ich war so nah dran, verrückt zu werden 🙂
– yasin demir
21. September 2021 um 7:59 Uhr
Ich hatte ein ähnliches Problem nur für Geräte der Samsung S-Serie. Meine TochableOpacity funktionierte uneinheitlich und hatte einige Monate lang Mühe, eine Lösung zu finden. Dies hat es behoben. Danke
– Saran Raj
10. Oktober 2021 um 9:04 Uhr
Ich kann bestätigen, dass es auf Android mit Version 0.57.7 gut funktioniert. Können Sie sich ein Upgrade leisten?
– Benoît
29. November 2018 um 23:16 Uhr