[0.80] Using Android ripple on background (default) does not work
Personne n'a encore pris cette issue.
- Langage dominant
- C++
- Étoiles
- 127k
- Forks
- 25.3k
- Merge moyen
- 1 j 23 h
- PR mergées (30 j)
- 4
Description
Description
When using React Native 0.80.x, the Android ripple config does not work any more when not using it on the foreground. Applying a ripple to the background is the default behaviour. When setting the foreground: true, it still works, but that is not the effect we are after.
On React Native 0.79, everything still works like expected.
Steps to reproduce
When using a bare React Native project, just add a really simple Pressable component, for example:
<Pressable android_ripple={{ color: 'blue', foreground: false }} onPress={() => console.log('Pressed!')}>
<View
style={{ width: '100%', height: 250 }}
/>
</Pressable>
Then run the app on Android.
Notice that the press event is fired correctly. You do not see any ripple effect.
When setting foreground: true, everything works like expected.
The issue is present on both the old and new architecture.
React Native Version
0.80.2 (it still persists in 0.81.0)
Affected Platforms
Runtime - Android
Output of npx @react-native-community/cli info
System:
OS: macOS 15.5
CPU: (12) arm64 Apple M2 Max
Memory: 61.47 MB / 64.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 22.16.0
path: ~/.nvm/versions/node/v22.16.0/bin/node
Yarn:
version: 1.22.22
path: ~/.nvm/versions/node/v22.16.0/bin/yarn
npm:
version: 10.9.2
path: ~/.nvm/versions/node/v22.16.0/bin/npm
Watchman: Not Found
Managers:
CocoaPods:
version: 1.16.2
path: /Users/ireumkens/.rbenv/shims/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 24.5
- iOS 18.5
- macOS 15.5
- tvOS 18.5
- visionOS 2.5
- watchOS 11.5
Android SDK:
API Levels:
- "27"
- "29"
- "32"
- "34"
- "35"
Build Tools:
- 33.0.1
- 34.0.0
- 35.0.0
- 35.0.0
- 35.0.0
- 35.0.1
- 36.0.0
System Images:
- android-27 | ARM 64 v8a
- android-27 | Intel x86_64 Atom
- android-34 | Google APIs ARM 64 v8a
- android-34 | Google Play ARM 64 v8a
- android-35 | Google Play ARM 64 v8a
- android-36 | Google Play ARM 64 v8a
Android NDK: 25.1.8937393
IDEs:
Android Studio: 2024.3 AI-243.26053.27.2432.13536105
Xcode:
version: 16.4/16F6
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.14
path: /Users/ireumkens/.jenv/shims/javac
Ruby:
version: 3.3.0
path: /Users/ireumkens/.rbenv/shims/ruby
npmPackages:
"@react-native-community/cli":
installed: 19.1.1
wanted: 19.1.1
react:
installed: 19.1.0
wanted: 19.1.0
react-native:
installed: 0.80.2
wanted: 0.80.2
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: true
newArchEnabled: false
Stacktrace or Logs
No crash - just unexpected behaviour.
MANDATORY Reproducer
https://github.com/vanHoi/android-ripple-bug
Screenshots and Videos
First I'm tapping the topmost box. Then tapping the bottom box.
https://github.com/user-attachments/assets/32c55fc9-2853-44a2-ba15-d62f0cb4f5ff
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Commencez par le reproducer obligatoire et comparez le comportement du ripple de Android Pressable entre React Native 0.79 et 0.80. Vérifiez le cas signalé avec foreground: false sur les deux architectures ; c’est terminé lorsque le ripple d’arrière-plan par défaut apparaît tandis que l’événement de pression continue de se déclencher.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- android, react-native
- Domaine
- mobile
- Type d'issue
- Bug
- Difficulté
- 4/5
- Temps estimé
- 3-5 jours
- Activité
- Calme
- Clarté
- Plutôt claire
- Accessibilité débutants
- 45/100