Sitemap

React-Native Title Bar is Not Visible on iOS 15

Nov 3, 2021
Press enter or click to view image in full size

After upgrading to iOS 15 version the bar of react-native-navigation became transparent and the title is hardly visible. Since my app uses legacy version of react-native (0.61.2) there’s no option to update navigation package to the latest version. A quick fix was to update the RNNComponentViewController.m source file of react-native-navigation package (react-native-navigation/lib/ios/RNNComponentViewController.m):

Press enter or click to view image in full size
iOS 15 fix

In the bottom of initWithLayoutInfo method just add these lines as it’s shown in the picture above:

// a quick fix for iOS 15 version
if (@available(iOS 15, *)){
UINavigationBarAppearance *appearance = [[UINavigationBarAppearance alloc] init];
[appearance configureWithOpaqueBackground];
appearance.titleTextAttributes = @{NSForegroundColorAttributeName : UIColor.whiteColor};
appearance.backgroundColor = [UIColor colorWithRed:0.0/255.0 green:125/255.0 blue:0.0/255.0 alpha:1.0];
self.navigationItem.standardAppearance = appearance;
self.navigationItem.scrollEdgeAppearance = appearance;
self.navigationController.navigationBar.tintColor = UIColor.whiteColor;
}

--

--

No responses yet