{"id":25485259,"url":"https://github.com/ponnamkarthik/nativeweb","last_synced_at":"2025-10-14T00:33:16.622Z","repository":{"id":66151149,"uuid":"160907952","full_name":"ponnamkarthik/nativeweb","owner":"ponnamkarthik","description":"Build your Own Plugin using (PlatformViews) Demo for Flutter Live 2018 Extended Event - Hyderabad ","archived":false,"fork":false,"pushed_at":"2018-12-14T16:52:58.000Z","size":85,"stargazers_count":26,"open_issues_count":0,"forks_count":7,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-09T20:05:31.941Z","etag":null,"topics":["flutter","flutter-demo","flutter-example","flutter-package","flutter-plugin"],"latest_commit_sha":null,"homepage":"","language":"Objective-C","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ponnamkarthik.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-12-08T05:40:17.000Z","updated_at":"2024-10-14T11:12:41.000Z","dependencies_parsed_at":"2023-07-02T00:00:10.678Z","dependency_job_id":null,"html_url":"https://github.com/ponnamkarthik/nativeweb","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ponnamkarthik/nativeweb","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ponnamkarthik%2Fnativeweb","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ponnamkarthik%2Fnativeweb/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ponnamkarthik%2Fnativeweb/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ponnamkarthik%2Fnativeweb/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ponnamkarthik","download_url":"https://codeload.github.com/ponnamkarthik/nativeweb/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ponnamkarthik%2Fnativeweb/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279017355,"owners_count":26086052,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-13T02:00:06.723Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flutter","flutter-demo","flutter-example","flutter-package","flutter-plugin"],"created_at":"2025-02-18T18:35:28.282Z","updated_at":"2025-10-14T00:33:16.592Z","avatar_url":"https://github.com/ponnamkarthik.png","language":"Objective-C","funding_links":[],"categories":[],"sub_categories":[],"readme":"# nativeweb\n\nBuild your Own Plugin using (PlatformViews) Demo for Flutter Live 2018 Extended Event - Hyderabad \n\n## Step 1\n\n```dart\nflutter create --org io.github.ponnamkarthik --template=plugin nativeweb\n```\n\n## Step 2\n\nInside lib/nativeweb.dart file we create a WebController Class\n\n```dart\n\nclass WebController {\n\n  MethodChannel _channel;\n  \n  WebController.init(int id) {\n    _channel =  new MethodChannel('nativeweb_$id');\n  }\n\n  Future\u003cvoid\u003e loadUrl(String url) async {\n    assert(url != null);\n    return _channel.invokeMethod('loadUrl', url);\n  }\n}\n\n```\n\n## Step 3\n\nCreate a Webview callback function\n\n```dart\ntypedef void WebViewCreatedCallback(WebController controller);\n```\n\nNow in lib/nativeweb.dart we create a stateful widget\n\n```dart\n\nclass NativeWeb extends StatefulWidget {\n\n  final WebViewCreatedCallback onWebCreated;\n\n  NativeWeb({\n    Key key,\n     @required this.onWebCreated,\n  });\n\n  @override\n  _NativeWebState createState() =\u003e _NativeWebState();\n}\n\nclass _NativeWebState extends State\u003cNativeWeb\u003e {\n  @override\n  Widget build(BuildContext context) {\n    return Container(\n      \n    );\n  }\n}\n\n```\n\n## Step 4\n\nInside build function instead of returning Container we return `AndroidView` or `UiKitView` for **Android** or **iOS**\n\n```dart\n\nif(defaultTargetPlatform == TargetPlatform.android) {\n    return AndroidView(\n\n    );\n} else if(defaultTargetPlatform == TargetPlatform.iOS) {\n    return UiKitView(\n\n    );\n}\n\nreturn new Text('$defaultTargetPlatform is not yet supported by this plugin');\n\n```\n\n## Step 5\n\nAndroidView and UiKitView accepts few parameters\n\n```dart\n\nviewType: 'nativeweb',\nonPlatformViewCreated: onPlatformViewCreated,\ncreationParamsCodec: const StandardMessageCodec(),\n```\n\nAndroidView and UiKitView looks like below\n\n```dart\nif(defaultTargetPlatform == TargetPlatform.android) {\n    return AndroidView(\n        viewType: 'nativeweb',\n        onPlatformViewCreated: onPlatformViewCreated,\n        creationParamsCodec: const StandardMessageCodec(),\n    );\n} else if(defaultTargetPlatform == TargetPlatform.iOS) {\n    return UiKitView(\n        viewType: 'nativeweb',\n        onPlatformViewCreated: onPlatformViewCreated,\n        creationParamsCodec: const StandardMessageCodec(),\n    );\n}\n```\n\nThis is our onPlatFormViewCreated Function\n\n```dart\nFuture\u003cvoid\u003e onPlatformViewCreated(id) async {\n    if (widget.onWebCreated == null) {\n    return;\n    }\n    widget.onWebCreated(new WebController.init(id));\n}\n```\n\n## Step 6\n\nInside `android` folder `NativeWebPlugin.java` file\n\n```java\n/** NativewebPlugin */\npublic class NativewebPlugin implements MethodCallHandler {\n  /** Plugin registration. */\n  public static void registerWith(Registrar registrar) {\n    final MethodChannel channel = new MethodChannel(registrar.messenger(), \"nativeweb\");\n    channel.setMethodCallHandler(new NativewebPlugin());\n  }\n\n  @Override\n  public void onMethodCall(MethodCall call, Result result) {\n    if (call.method.equals(\"getPlatformVersion\")) {\n      result.success(\"Android \" + android.os.Build.VERSION.RELEASE);\n    } else {\n      result.notImplemented();\n    }\n  }\n}\n```\n\nreplace above code with this one\n\n```java\npublic class NativewebPlugin {\n\n  public static void registerWith(Registrar registrar) {\n    registrar\n            .platformViewRegistry()\n            .registerViewFactory(\n                    \"nativeweb\", new WebFactory(registrar));\n  }\n}\n```\n\n## Step 7\n\nCreate a new file `WebFactory.java`\n\n```java\npublic class WebFactory extends PlatformViewFactory {\n\n    private final Registrar mPluginRegistrar;\n\n    public WebFactory(Registrar registrar) {\n        super(StandardMessageCodec.INSTANCE);\n        mPluginRegistrar = registrar;\n    }\n\n    @Override\n    public PlatformView create(Context context, int i, Object o) {\n        return new FlutterWeb(context, mPluginRegistrar, i);\n    }\n\n}\n```\n\n## Step 8\n\nCreate a new file `FlutterWeb.java`\n\nIn this file we implement two methods `PlatformView`, `MethodCallHandler`\n\n```java\npublic class FlutterWeb implements PlatformView, MethodCallHandler {\n  \n  // ..\n  // ..\n  \n}\n```\n\n`FlutterWeb.java` constructor will be as below\n\n```java\nFlutterWeb(Context context, Registrar registrar, int id) {\n    this.context = context;\n    this.registrar = registrar;\n    webView = getWebView(registrar);\n\n    channel = new MethodChannel(registrar.messenger(), \"nativeweb_\" + id);\n    \n    channel.setMethodCallHandler(this);\n}\n```\n\nwe ovrride some default methods\n\n```java\n@Override\npublic View getView() {\n    return webView;\n}\n\n@Override\npublic void dispose() {}\n\n@Override\npublic void onMethodCall(MethodCall call, MethodChannel.Result result) {\n    switch (call.method) {\n        case \"loadUrl\":\n            String url = call.arguments.toString();\n            webView.loadUrl(url);\n            break;\n        default:\n            result.notImplemented();\n    }\n\n}\n```\n\nwe create a new function which return a webview\n\n```java\nprivate WebView getWebView(Registrar registrar) {\n    WebView webView = new WebView(registrar.context());\n    webView.setWebViewClient(new WebViewClient());\n    webView.getSettings().setJavaScriptEnabled(true);\n    return webView;\n}\n```\n\n## Step 9\n\nInside iOS folder `NativewebPlugin.m` file replace the existing code with below\n\n```\n+ (void)registerWithRegistrar:(NSObject\u003cFlutterPluginRegistrar\u003e*)registrar {\n  FlutterNativeWebFactory* webviewFactory =\n      [[FlutterNativeWebFactory alloc] initWithMessenger:registrar.messenger];\n  [registrar registerViewFactory:webviewFactory withId:@\"nativeweb\"];\n}\n```\n\n## Step 10\n\nCreate two file `FlutterWeb.h` and `FlutterWeb.m`\n\nInside `FlutterWeb.h` paste the below code\n\n```objc\n#import \u003cFlutter/Flutter.h\u003e\n#import \u003cWebKit/WebKit.h\u003e\n\n@interface FlutterWebController : NSObject \u003cFlutterPlatformView\u003e\n\n- (instancetype)initWithWithFrame:(CGRect)frame\n                   viewIdentifier:(int64_t)viewId\n                        arguments:(id _Nullable)args\n                  binaryMessenger:(NSObject\u003cFlutterBinaryMessenger\u003e*)messenger;\n\n- (UIView*)view;\n@end\n\n@interface FlutterWebFactory : NSObject \u003cFlutterPlatformViewFactory\u003e\n- (instancetype)initWithMessenger:(NSObject\u003cFlutterBinaryMessenger\u003e*)messenger;\n@end\n```\n\n\nInside `FlutterWeb.m` paste the below code\n\nWe implement `FlutterWebFactory` and `FlutterWebController`\n\n```objc\n#import \"FlutterWeb.h\"\n\n@implementation FlutterWebFactory {\n  NSObject\u003cFlutterBinaryMessenger\u003e* _messenger;\n}\n\n- (instancetype)initWithMessenger:(NSObject\u003cFlutterBinaryMessenger\u003e*)messenger {\n  self = [super init];\n  if (self) {\n    _messenger = messenger;\n  }\n  return self;\n}\n\n- (NSObject\u003cFlutterMessageCodec\u003e*)createArgsCodec {\n  return [FlutterStandardMessageCodec sharedInstance];\n}\n\n- (NSObject\u003cFlutterPlatformView\u003e*)createWithFrame:(CGRect)frame\n                                   viewIdentifier:(int64_t)viewId\n                                        arguments:(id _Nullable)args {\n  FlutterWebController* webviewController =\n      [[FlutterWebController alloc] initWithWithFrame:frame\n                                       viewIdentifier:viewId\n                                            arguments:args\n                                      binaryMessenger:_messenger];\n  return webviewController;\n}\n\n@end\n```\n\n```objc\n@implementation FlutterWebController {\n  WKWebView* _webView;\n  int64_t _viewId;\n  FlutterMethodChannel* _channel;\n}\n\n- (instancetype)initWithWithFrame:(CGRect)frame\n                   viewIdentifier:(int64_t)viewId\n                        arguments:(id _Nullable)args\n                  binaryMessenger:(NSObject\u003cFlutterBinaryMessenger\u003e*)messenger {\n  if ([super init]) {\n    _viewId = viewId;\n    _webView = [[WKWebView alloc] initWithFrame:frame];\n    NSString* channelName = [NSString stringWithFormat:@\"ponnamkarthik/flutterwebview_%lld\", viewId];\n    _channel = [FlutterMethodChannel methodChannelWithName:channelName binaryMessenger:messenger];\n    __weak __typeof__(self) weakSelf = self;\n    [_channel setMethodCallHandler:^(FlutterMethodCall* call, FlutterResult result) {\n      [weakSelf onMethodCall:call result:result];\n    }];\n\n  }\n  return self;\n}\n\n- (UIView*)view {\n  return _webView;\n}\n\n- (void)onMethodCall:(FlutterMethodCall*)call result:(FlutterResult)result {\n  if ([[call method] isEqualToString:@\"loadUrl\"]) {\n    [self onLoadUrl:call result:result];\n  } else {\n    result(FlutterMethodNotImplemented);\n  }\n}\n\n- (void)onLoadUrl:(FlutterMethodCall*)call result:(FlutterResult)result {\n  NSString* url = [call arguments];\n  if (![self loadUrl:url]) {\n    result([FlutterError errorWithCode:@\"loadUrl_failed\"\n                               message:@\"Failed parsing the URL\"\n                               details:[NSString stringWithFormat:@\"URL was: '%@'\", url]]);\n  } else {\n    result(nil);\n  }\n}\n\n- (bool)loadUrl:(NSString*)url {\n  NSURL* nsUrl = [NSURL URLWithString:url];\n  if (!nsUrl) {\n    return false;\n  }\n  NSURLRequest* req = [NSURLRequest requestWithURL:nsUrl];\n  [_webView loadRequest:req];\n  return true;\n}\n\n@end\n```\n\n## Step 12\n\nInside `example/lib` folder `main.dart` file\n\n```dart\n// create a nativeweb widget\nNativeWeb nativeWeb = new NativeWeb(\n    onWebCreated: onWebCreated,\n);\n```\n\n```dart\n// call back function on view created\nvoid onWebCreated(webController) {\n    this.webController = webController;\n    this.webController.loadUrl(\"https://flutter.io/\");\n}\n```\n\n\n\n## Step 11\n\n* Most Important\n\nInside `example/ios` folder `Info.plist` file\n\n```plist\n\u003ckey\u003eio.flutter.embedded_views_preview\u003c/key\u003e\n\u003cstring\u003eYES\u003c/string\u003e\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fponnamkarthik%2Fnativeweb","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fponnamkarthik%2Fnativeweb","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fponnamkarthik%2Fnativeweb/lists"}