Flutter 调用iOS原生WebView (PlatformView)

PlatformView是 flutter 官方提供的一个可以嵌入 Android 和 iOS 平台原生 view 的小部件。
直接上代码:
1.创建webView (这里js oc flutter交互不阐述)

#import 
#import 

NS_ASSUME_NONNULL_BEGIN

@interface FlutterIosWebView : NSObject

-(instancetype)initWithWithFrame:(CGRect)frame
                  viewIdentifier:(int64_t)viewId
                       arguments:(id _Nullable)args
                 binaryMessenger:(NSObject*)messenger;
@end

NS_ASSUME_NONNULL_END
#import "FlutterIosWebView.h"
#import 
#import "AppDelegate.h"

@interface FlutterIosWebView ()

@end

@implementation FlutterIosWebView{
    //FlutterIosTextLabel 创建后的标识
    int64_t _viewId;
    WKWebView * _webView;
}
//

//在这里只是创建了一个WKWebView
-(instancetype)initWithWithFrame:(CGRect)frame viewIdentifier:(int64_t)viewId arguments:(id)args binaryMessenger:(NSObject *)messenger{
    if ([super init]) {
        if (frame.size.width==0) {
            frame=CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height);
        }
        WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
        WKUserContentController *userController = [[WKUserContentController alloc] init];
        configuration.userContentController = userController;
        _webView =[[WKWebView alloc] initWithFrame:frame configuration:configuration];
        [_webView setUserInteractionEnabled:YES];
        NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:@"https://blog.csdn.net/MHTios"]];
        [_webView loadRequest:request];
        _webView.scrollView.bounces = NO;
        _webView.UIDelegate = self;
        _webView.navigationDelegate = self;
        [_webView setOpaque:YES];
        _viewId = viewId;
        [userController addScriptMessageHandler:self name:@"FlutterChannel"];
    }
    return self;
    
}

- (nonnull WKWebView *)view {
    return _webView;
}

2.创建 Factory

#import 
#import 

NS_ASSUME_NONNULL_BEGIN

@interface FlutterIosWebViewFactory : NSObject
- (instancetype)initWithMessenger:(NSObject*)messager;

@end

NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewFactory.h"
#import "FlutterIosWebView.h"

@implementation FlutterIosWebViewFactory
{
    NSObject*_messenger;
}
- (instancetype)initWithMessenger:(NSObject *)messager{
    self = [super init];
    if (self) {
        _messenger = messager;
    }
    return self;
}

//设置参数的编码方式
-(NSObject *)createArgsCodec{
    return [FlutterStandardMessageCodec sharedInstance];
}

//用来创建 ios 原生view
- (nonnull NSObject *)createWithFrame:(CGRect)frame viewIdentifier:(int64_t)viewId arguments:(id _Nullable)args {
    //args 为flutter 传过来的参数
    FlutterIosWebView *webView = [[FlutterIosWebView alloc] initWithWithFrame:frame viewIdentifier:viewId arguments:args binaryMessenger:_messenger];
    return webView;
}
@end

3.创建Plugin

#import 
#import 

NS_ASSUME_NONNULL_BEGIN

@interface FlutterIosWebViewPlugin : NSObject

@end

NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewPlugin.h"
#import "FlutterIosWebViewFactory.h"

@implementation FlutterIosWebViewPlugin
+ (void)registerWithRegistrar:(nonnull NSObject *)registrar {
    
    //注册插件
    //注册 FlutterIosTextLabelFactory
    //com.flutter_to_native_test_textview 为flutter 调用此  textLabel 的标识
    [registrar registerViewFactory:[[FlutterIosWebViewFactory alloc] initWithMessenger:registrar.messenger] withId:@"com.flutter_to_native_webView"];
}
@end

4.注册

#import 
#import "FlutterIosWebViewPlugin.h"
#import 
NS_ASSUME_NONNULL_BEGIN

@interface FlutterIosWebViewRegistran : NSObject
+ (void)registerWithRegistry:(NSObject*)registry;
@end

NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewRegistran.h"

@implementation FlutterIosWebViewRegistran
+(void)registerWithRegistry:(NSObject *)registry{
    //注册插件
    [FlutterIosWebViewPlugin registerWithRegistrar:[registry registrarForPlugin:@"FlutterIosWebViewPlugin"]];
}
@end

5.AppDelegate 添加注册代码

[GeneratedPluginRegistrant registerWithRegistry:self];
[FlutterIosWebViewRegistran registerWithRegistry:self];

到这里ios 原生基本结束了,接下来Flutter调用

Widget webView = Container(
    width: double.infinity,
    height: double.infinity,
    child: UiKitView(viewType: "com.flutter_to_native_webView"),
  );

你可能感兴趣的:(Dart,Flutter从零到未来)