flutter混合(iOS)开发第一步使用(Flutter_Boost)完成页面之间的跳转传值( 三)

2,427 阅读2分钟

书接上回!!!查看上回

上回我们说到Flutter内部跳转并且完成传值这次来个Flutter跳转Native并且完成传值

Flutter TO Native

上面已经说到第二个Flutter页面了,我们继续从这里开始

class SecondRouteWidget extends StatefulWidget {
  final Map<dynamic, dynamic> params;

  SecondRouteWidget(this.params);

  @override
  _SecondRouteWidgetState createState() => _SecondRouteWidgetState();
}

<!--然后接受一下-->
class _SecondRouteWidgetState extends State<SecondRouteWidget> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('secondPage'),
      ),
      body: Center(
        child: Column(
         child: RaisedButton(
              child: Text("跳转原生界面"),
              onPressed: () {
                //          打开原生页面
                <!--这里 open 打开的东西其实就是我们原生里面 PlatformRouterImp 类里面的 open 方法,
                后面的参数就是我们 PlatformRouterImp 里面open里面的 url 通过这个 url 我们可以判断打开我们相应的界面,
                1、urlParams 传人页面的参数; 若有特殊逻辑,可以通过这个参数设置回调的id 
                2、exts 额外参数 
                3、completion 打开页面的即时回调,页面一旦打开即回调-->
                
                FlutterBoost.singleton.open("sample://LoginPage",
                    urlParams: {"userName": "ryan", "password": "123456"},
                    exts:null(也可以不写这个参数名,他是可选的));
              },
            ),
        ),
      ),
    );
  }
}

原生里面我们在 PlatformRouterImp这个类里面判断一下

func open(_ url: String, urlParams: [AnyHashable : Any], exts: [AnyHashable : Any], completion: @escaping (Bool) -> Void) {
        var animated = false;
        if exts["animated"] != nil{
            animated = exts["animated"] as! Bool;
        }
        if url.contains("sample://LoginPage") {
            let vc = JTOrderDetailViewController()
            vc.hidesBottomBarWhenPushed = true
            vc.flutterdata = urlParams
            topVC?.navigationController?.pushViewController(vc, animated: animated);
        } else {
           let vc = FLBFlutterViewContainer.init()
           vc.setName(url, params: urlParams)
           vc.navigation.bar.isHidden = true
           vc.hidesBottomBarWhenPushed = true
           topVC?.navigationController!.pushViewController(vc, animated: animated);
       }
        
        completion(true);
    }

这样就打开我们原生界面了,并且传过来的值也在urlParams这里面,额外参数我们没有做任何参数传递。

最后一步我们原生返回Flutter页面,这里我们需要自己写一个通道了。它里面没有,直接上代码 我们在原生里面监听返回按钮的点击事件然后通过FlutterBoostPlugin.sharedInstance().sendEvent这样把东西传过去

navigation.bar.backBarButtonItem?.didBack = {
        self.navigationController?.popViewController(animated: true)
        FlutterBoostPlugin.sharedInstance().sendEvent("NativeDetailPageCallback", arguments: ["name":"detailPage","number":"1000"]);
    }

我们在Dart里面

//            原生界面返回传值获取
    FlutterBoost.singleton.channel.addEventListener(
        "NativeDetailPageCallback",
            (name, arguments) {
                return handleMsg(name, arguments);
            },

这里我们就能监听到原生传过来的值了。截止到现在基本上完成了从原生到Flutter, 然后FlutterFlutter,Flutter 到原生,之间的所有联系了。

最后

我是初学者,这里是记录一下自己在学习Flutter_boost时候的学习笔记吧,和大家一起分享一下。如果不妥的地方还请路过的大佬不吝赐教!!!!!!