Flutter與Android的混合開發（3）Flutter如何跳轉到Activity，如何傳值

時間  2019-11-06
標籤 flutter android 混合 開發 如何 轉到 activity 欄目 Android 简体版
原文   原文鏈接
  1. 如何在現有Android項目裏嵌入Flutter Module
  2. Activity如何跳轉到Flutter頁面，如何傳值
  3. Flutter如何跳轉到Activity，如何傳值
  4. Android模塊與Flutter模塊的交互

所有源碼已上傳githubandroid

Flutter跳轉Activity有2種方式：ios

  1. 經過Channel通知Android層跳轉
  2. 直接讓Flutter頁面嵌入Android的View

Flutter如何跳轉到Activity，如何傳值

咱們修改一下以前的MainActivity，增長咱們此次的示例代碼git

Android代碼

MainActivity.kt

package com.liuhc.myapplication

import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import io.flutter.view.FlutterMain
import kotlinx.android.synthetic.main.activity_main.*
import org.jetbrains.anko.startActivity

/** * 描述:首頁 * 做者:liuhc * 建立日期：2019-09-05 on 11:21 AM */
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        //強烈建議放到Application裏初始化,初始化一次便可,放這裏只是舉個例子
        FlutterMain.startInitialization(this)
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        //addContentView方式添加FlutterView
        page1.setOnClickListener {
            startActivity<Page1Activity>()
        }

        //普通Fragment方式添加FlutterView
        page2.setOnClickListener {
            startActivity<Page2Activity>()
        }

        //使用FlutterFragmentActivity
        page3.setOnClickListener {
            startActivity<PageFlutterFragmentActivity>()
        }

        //使用FlutterActivity
        page4.setOnClickListener {
            startActivity<PageFlutterActivity>()
        }

        //addContentView方式添加FlutterView並傳遞參數
        page1Param.setOnClickListener {
            startActivity<Page1ParamActivity>()
        }

        //解決debug模式下黑屏的另外一種方式
        noBlack.setOnClickListener {
            startActivity<DebugNoBlackActivity>()
        }

        //進入Flutter頁面演示經過Channel跳轉到Activity
        jumpByChannel.setOnClickListener {
            startActivity<JumpActivityFlutterWidget>()
        }

        //進入嵌入了Android平臺的View的Flutter頁面
        insertAndroidView.setOnClickListener {
            startActivity<InsertAndroidViewFlutterWidget>()
        }
    }

}
複製代碼

JumpActivityFlutterWidget.kt

package com.liuhc.myapplication

import android.os.Bundle
import io.flutter.app.FlutterActivity
import io.flutter.plugin.common.MethodChannel
import io.flutter.view.FlutterMain
import org.jetbrains.anko.startActivity

/** * 描述:這個頁面包含FlutterView,而後點擊FlutterView中的按鈕跳轉到另外一個Activity, * 這種方式其實只是調用Channel通訊而已 * * 做者:liuhc * 建立日期：2019-09-04 on 23:30 */
class JumpActivityFlutterWidget : FlutterActivity() {

    private lateinit var methodChannel: MethodChannel

    override fun onCreate(savedInstanceState: Bundle?) {
        //強烈建議放到Application裏初始化,初始化一次便可,放這裏只是舉個例子
        FlutterMain.startInitialization(this)
        //intent的參數設置必須在super.onCreate以前,由於super.onCreate裏會取這些參數
        intent.action = "android.intent.action.RUN"
        intent.putExtra("route", "page4")
        super.onCreate(savedInstanceState)
        initMethodChannel()
        //調用super.onCreate(savedInstanceState)以後flutterView纔有值,
        //因此若是須要註冊插件,則應該放到super.onCreate(savedInstanceState)代碼以後才能夠
        flutterView.enableTransparentBackground()
    }

    //Flutter跳轉Activity的方式1,使用Channel
    private fun initMethodChannel() {
        methodChannel = MethodChannel(
            this.registrarFor("pluginKeyMainActivity").messenger(),
            "MainActivityMethodChannel"
        )
        methodChannel.setMethodCallHandler { methodCall, result ->
            if (methodCall.method == "jumpTestActivity") {
                startActivity<TestActivity>()
            }
        }
    }
}
複製代碼

TestActivity.kt

package com.liuhc.myapplication

import android.annotation.SuppressLint
import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.widget.LinearLayout
import android.widget.TextView

/** * 描述: * 做者:liuhc * 建立日期：2019-09-05 on 14:31 */
class TestActivity : AppCompatActivity() {

    @SuppressLint("SetTextI18n")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val linearLayout = LinearLayout(this)
        val layoutParam = LinearLayout.LayoutParams(
            LinearLayout.LayoutParams.MATCH_PARENT,
            LinearLayout.LayoutParams.MATCH_PARENT
        )
        val textView = TextView(this)
        textView.text = "TestActivity:我被跳轉過來了"
        val viewParam = LinearLayout.LayoutParams(
            LinearLayout.LayoutParams.WRAP_CONTENT,
            LinearLayout.LayoutParams.WRAP_CONTENT
        )
        linearLayout.addView(textView, viewParam)
        setContentView(linearLayout, layoutParam)
    }

}
複製代碼

InsertAndroidViewFlutterWidget.kt

package com.liuhc.myapplication

import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import io.flutter.view.FlutterMain
import kotlinx.android.synthetic.main.activity_main.*
import org.jetbrains.anko.startActivity

/** * 描述:首頁 * 做者:liuhc * 建立日期：2019-09-05 on 11:21 AM */
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        //強烈建議放到Application裏初始化,初始化一次便可,放這裏只是舉個例子
        FlutterMain.startInitialization(this)
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        //addContentView方式添加FlutterView
        page1.setOnClickListener {
            startActivity<Page1Activity>()
        }

        //普通Fragment方式添加FlutterView
        page2.setOnClickListener {
            startActivity<Page2Activity>()
        }

        //使用FlutterFragmentActivity
        page3.setOnClickListener {
            startActivity<PageFlutterFragmentActivity>()
        }

        //使用FlutterActivity
        page4.setOnClickListener {
            startActivity<PageFlutterActivity>()
        }

        //addContentView方式添加FlutterView並傳遞參數
        page1Param.setOnClickListener {
            startActivity<Page1ParamActivity>()
        }

        //解決debug模式下黑屏的另外一種方式
        noBlack.setOnClickListener {
            startActivity<DebugNoBlackActivity>()
        }

        //進入Flutter頁面演示經過Channel跳轉到Activity
        jumpByChannel.setOnClickListener {
            startActivity<JumpActivityFlutterWidget>()
        }

        //進入嵌入了Android平臺的View的Flutter頁面
        insertAndroidView.setOnClickListener {
            startActivity<InsertAndroidViewFlutterWidget>()
        }
    }

}
複製代碼

Dart代碼

main.dart

import 'dart:convert';
import 'dart:ui';

import 'package:flutter/material.dart';

import 'insert_android_view_page.dart';
import 'invoke_method_page.dart';
import 'jump_activity_page.dart';
import 'my_home_page.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      //方式1
      home: _getWidgetByRoute(window.defaultRouteName),
      //方式2 若是route相同,優先匹配routes而不是home
      routes: <String, WidgetBuilder>{
        "page1": (context) => MyHomePage(
              title: "匹配到了page1",
              message: "經過routes變量",
            ),
        "page2": (context) => MyHomePage(
              title: "匹配到了page2",
              message: "經過routes變量",
            ),
        "page3": (context) => MyHomePage(
              title: "匹配到了page3",
              message: "經過routes變量",
            ),
        "page4": (context) => JumpActivityPage(),
        "page5": (context) => InsertAndroidViewPage(),
      },
      //當經過routes和home的返回值都爲null的話,纔會從onUnknownRoute尋找
      onUnknownRoute: (RouteSettings settings) {
        return new PageRouteBuilder(pageBuilder: (BuildContext context, _, __) {
          //這裏爲返回的Widget
          return MyHomePage(
            title: "沒有匹配到",
            message: "經過onUnknownRoute變量",
          );
        });
      },
    );
  }
}

//若是要接收平臺層發送的參數,除了使用Channel之外(這種方式不是正常的方式,強烈不推薦),就只能經過window.defaultRouteName了,
//由於routes的route只能提早定義好,沒法動態判斷
Widget _getWidgetByRoute(String jsonStr) {
  print("json=$jsonStr");
  String _route;
  Map<String, dynamic> jsonMap;
  try {
    jsonMap = json.decode(jsonStr);
    _route = jsonMap["path"];
  } catch (e) {
    print(e);
    _route = jsonStr;
  }
  switch (_route) {
    //接收到了匹配的規則，跳轉到flutter指定頁面
    case 'page1':
      return MyHomePage(
        title: "匹配到了page1",
        message: "經過home變量",
      );
    case 'page1Param':
      return MyHomePage(
        title: "匹配到了page1Param",
        message: jsonMap["param"],
      );
    case "InvokeMethodPage":
      return InvokeMethodPage(
        title: jsonMap["title"],
        channelName: jsonMap["channelName"],
        androidMethod: jsonMap["androidMethod"],
      );
    default:
      return MyHomePage(
        title: "沒有匹配到",
        message: "經過home變量",
      );
  }
}
複製代碼

jump_activity_page.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class JumpActivityPage extends StatefulWidget {
  @override
  _JumpActivityPageState createState() => _JumpActivityPageState();
}

class _JumpActivityPageState extends State<JumpActivityPage> {

  MethodChannel _methodChannel;

  @override
  void initState() {
    _methodChannel = MethodChannel("MainActivityMethodChannel");
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("我是Flutter頁面"),
      ),
      body: RaisedButton(
        child: Text("點我經過發送Channel消息通知Android層跳轉頁面"),
        onPressed: (){
          _methodChannel.invokeMethod("jumpTestActivity");
        },
      ),
    );
  }
}
複製代碼

insert_android_view_page.dart

import 'dart:io' show Platform;

import 'package:flutter/material.dart';

/// 描述:嵌入AndroidView
/// 做者:liuhc
/// 建立日期：2019-09-05 on 3:20 PM
class InsertAndroidViewPage extends StatefulWidget {
  @override
  _InsertAndroidViewPageState createState() => _InsertAndroidViewPageState();
}

class _InsertAndroidViewPageState extends State<InsertAndroidViewPage> {
  GlobalKey key = GlobalKey();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("我來演示如何嵌入AndroidView"),
        ),
        body: Platform.isAndroid ? AndroidView(key: key, viewType: 'InsertAndroidView') : Text("ios和Android實現原理同樣"));
  }
}
複製代碼

歡迎加入Flutter開發羣457664582，點擊加入，你們一塊兒學習討論github

Flutter開發

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程