PlatformView是 flutter 官方提供的一個可以嵌入 Android 和 iOS 平臺原生 view 的小部件。
直接上代碼:
1.創建webView (這裏js oc flutter交互不闡述)
#import <Foundation/Foundation.h>
#import <Flutter/Flutter.h>
NS_ASSUME_NONNULL_BEGIN
@interface FlutterIosWebView : NSObject<FlutterPlatformView>
-(instancetype)initWithWithFrame:(CGRect)frame
viewIdentifier:(int64_t)viewId
arguments:(id _Nullable)args
binaryMessenger:(NSObject<FlutterBinaryMessenger>*)messenger;
@end
NS_ASSUME_NONNULL_END
#import "FlutterIosWebView.h"
#import <WebKit/WebKit.h>
#import "AppDelegate.h"
@interface FlutterIosWebView ()<WKUIDelegate,WKNavigationDelegate,WKScriptMessageHandler>
@end
@implementation FlutterIosWebView{
//FlutterIosTextLabel 創建後的標識
int64_t _viewId;
WKWebView * _webView;
}
//
//在這裏只是創建了一個WKWebView
-(instancetype)initWithWithFrame:(CGRect)frame viewIdentifier:(int64_t)viewId arguments:(id)args binaryMessenger:(NSObject<FlutterBinaryMessenger> *)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 <Foundation/Foundation.h>
#import <Flutter/Flutter.h>
NS_ASSUME_NONNULL_BEGIN
@interface FlutterIosWebViewFactory : NSObject<FlutterPlatformViewFactory>
- (instancetype)initWithMessenger:(NSObject<FlutterBinaryMessenger>*)messager;
@end
NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewFactory.h"
#import "FlutterIosWebView.h"
@implementation FlutterIosWebViewFactory
{
NSObject<FlutterBinaryMessenger>*_messenger;
}
- (instancetype)initWithMessenger:(NSObject<FlutterBinaryMessenger> *)messager{
self = [super init];
if (self) {
_messenger = messager;
}
return self;
}
//設置參數的編碼方式
-(NSObject<FlutterMessageCodec> *)createArgsCodec{
return [FlutterStandardMessageCodec sharedInstance];
}
//用來創建 ios 原生view
- (nonnull NSObject<FlutterPlatformView> *)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 <Foundation/Foundation.h>
#import <Flutter/Flutter.h>
NS_ASSUME_NONNULL_BEGIN
@interface FlutterIosWebViewPlugin : NSObject<FlutterPlugin>
@end
NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewPlugin.h"
#import "FlutterIosWebViewFactory.h"
@implementation FlutterIosWebViewPlugin
+ (void)registerWithRegistrar:(nonnull NSObject<FlutterPluginRegistrar> *)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 <Foundation/Foundation.h>
#import "FlutterIosWebViewPlugin.h"
#import <Flutter/Flutter.h>
NS_ASSUME_NONNULL_BEGIN
@interface FlutterIosWebViewRegistran : NSObject
+ (void)registerWithRegistry:(NSObject<FlutterPluginRegistry>*)registry;
@end
NS_ASSUME_NONNULL_END
#import "FlutterIosWebViewRegistran.h"
@implementation FlutterIosWebViewRegistran
+(void)registerWithRegistry:(NSObject<FlutterPluginRegistry> *)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"),
);