I'd like to show an overlay above the SFSafariViewController when I click on a link within SFSafariViewController.
An expected view is displayed below.
A similar issue has been posted in react-native-navigation. The solution is copied here:
// AppDelegate.m
[ReactNativeNavigation registerExternalComponent:@"RNNSafariViewController" callback:^UIViewController *(NSDictionary *props, RCTBridge *bridge) {
return [[RNNSafariViewController alloc] initWithProps:props];
}];
// RNNSafariViewController.m
#import "RNNSafariViewController.h"
@import SafariServices;
@implementation RNNSafariViewController {
NSURL* _url;
boolean* _readerMode;
}
- (instancetype)initWithProps:(NSDictionary *)props {
self = [super init];
_url = [[NSURL alloc] initWithString:props[@"url"]];
_readerMode = [props[@"readerMode"] boolValue];
return self;
}
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
SFSafariViewController *safariViewController = [[SFSafariViewController alloc] initWithURL:_url entersReaderIfAvailable:_readerMode];
safariViewController.delegate = self;
[self presentViewController:safariViewController animated:animated completion:nil];
}
@end
// RNNSafariViewController.h
#import <UIKit/UIKit.h>
@interface RNNSafariViewController : UIViewController<SFSafariViewControllerDelegate>
- (instancetype)initWithProps:(NSDictionary*)props;
@end
I would like to do the same in react-navigation. But I am not sure if react-navigation provides the same library RNNSafariViewController.h
as react-native-navigation does.
What would be a good way to implement this in react-navigation? Thanks!