react-native-navigation icon indicating copy to clipboard operation
react-native-navigation copied to clipboard

topBar background component is above buttons on iOS 14

Open danilobuerger opened this issue 5 years ago • 5 comments

Issue Description

When setting a topBar background component, it is being rendered above the right buttons on iOS 14:

iOS 12.4 iOS 14.0
Simulator Screen Shot - iPhone 8 (12 4) - 2020-10-17 at 15 06 30 Simulator Screen Shot - iPhone 8 - 2020-10-17 at 15 04 41

Steps to Reproduce / Code Snippets / Screenshots

See the following playground diff as an reproduction to the above screenshots:

diff --git a/playground/src/screens/LayoutsScreen.tsx b/playground/src/screens/LayoutsScreen.tsx
index 15c9e770c..5fecf3556 100644
--- a/playground/src/screens/LayoutsScreen.tsx
+++ b/playground/src/screens/LayoutsScreen.tsx
@@ -22,9 +22,25 @@ export default class LayoutsScreen extends NavigationComponent {
     return {
       topBar: {
         testID: WELCOME_SCREEN_HEADER,
-        title: {
-          text: 'React Native Navigation',
+        background: {
+          component: {
+            name: Screens.ReactTitleView,
+            passProps: {
+              text: 'React Native Navigation Navigation Navigation',
+            },
+          },
         },
+        rightButtons: [
+          {
+            id: 'Two',
+            component: {
+              name: Screens.RoundButton,
+              passProps: {
+                title: 'Two',
+              },
+            },
+          },
+        ],
       },
       layout: {
         orientation: ['portrait', 'landscape'],


Environment

  • React Native Navigation version: master @ d9df9b5db4ee7b209ec3f1891386d0b947178de9
  • React Native version: 0.63.2
  • Platform(s) (iOS, Android, or both?): iOS
  • Device info (Simulator/Device? OS version? Debug/Release?): 14.0

danilobuerger avatar Oct 17 '20 13:10 danilobuerger

I came across this while investigation #6652.

danilobuerger avatar Oct 17 '20 13:10 danilobuerger

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. If you believe the issue is still relevant, please test on the latest version and report back. Thank you for your contributions.

stale[bot] avatar Dec 02 '20 14:12 stale[bot]

Can confirm it also happens on iOS 15. Would love to see a fix for this!

dariuscosden avatar Sep 24 '21 19:09 dariuscosden

Yes, I am facing same issue.

FawadMahmood avatar Sep 28 '22 03:09 FawadMahmood

I found this issue on https://ovio.org/projects and would love to contribute!

madisonisfan avatar Feb 27 '23 22:02 madisonisfan