[0.80] Using Android ripple on background (default) does not work
Chưa có ai nhận issue này.
- Ngôn ngữ chính
- C++
- Star
- 127k
- Fork
- 25.3k
- Merge trung bình
- 1 ngày 23 giờ
- Pull request đã merge (30 ngày)
- 4
Mô tả
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
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Hướng nghiên cứu
Bắt đầu với reproducer bắt buộc và so sánh hành vi ripple của Android Pressable giữa React Native 0.79 và 0.80. Xác minh trường hợp được báo cáo với foreground: false trên cả hai kiến trúc; hoàn tất khi ripple nền mặc định xuất hiện trong khi sự kiện nhấn vẫn tiếp tục được kích hoạt.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- android, react-native
- Lĩnh vực
- mobile
- Loại issue
- Lỗi
- Độ khó
- 4/5
- Thời gian dự kiến
- 3-5 ngày
- Mức độ hoạt động
- Ít trao đổi
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 45/100