fluttter和android混編

0、創建flutter module項目

命令行執行lutter create -t module flutter_module

或者用android studio創建

1、setting.gradle添加一下代碼，要注意更換成自己的項目

setBinding(new Binding([gradle:this]))
evaluate(new File(
        settingsDir.parentFile,
        'flutter_module/.android/include_flutter.groovy'
))

 

2、修改build.gradle

 文件位置

 

minSdkVersion 改爲  16

配置編譯版本,在android{}裏添加

compileOptions{
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}

dependencies裏最後一行添加
implementation project(':flutter')

3、點擊sync now同步腳本

4、run，run成功後說明混編環境配置好

如果遇到下面錯誤

Installation failed with message Invalid File:

參考https://mp.csdn.net/postedit/102985511

 

 

5、android mainactivity代碼

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        findViewById(R.id.test).setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                FragmentTransaction tx = getSupportFragmentManager().beginTransaction();
                tx.replace(R.id.someContainer,Flutter.createFragment("{name:'devio',dataList:['aa']}"));
                tx.commit();
            }
        });
    }
}

佈局中代碼

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Test" />
    <FrameLayout
        android:id="@+id/someContainer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"></FrameLayout>

</LinearLayout>

6、main.dart 中代碼

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

void main() => runApp(MyApp(androidParams: window.defaultRouteName));

class MyApp extends StatelessWidget {
  final String androidParams;

  MyApp({Key key,this.androidParams}):super(key:key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: this.androidParams??""),
    );
  }
}

7、啓用flutter模塊的熱重載

打開一個模擬器,運行android項目

進入到flutter模塊的根目錄的命令行下運行flutter attach -d emulator-5554 ，這裏換成你的模擬器名字

等命令行出現Waiting for a connection from Flutter on Android SDK built for x86...

打開flutter編寫的頁面，會出現

Syncing files to device Android SDK built for x86...                    
 2,707ms (!)                                       

🔥  To hot reload changes while running, press "r". To hot restart (and rebuild state), press "R".
An Observatory debugger and profiler on Android SDK built for x86 is available at: http://127.0.0.1:61581/06WC6YnSW2w=/
For a more detailed help message, press "h". To detach, press "d"; to quit, press "q".
 

此時修改flutter代碼

然後命令行輸入r，就可以看到代碼熱重載了

命令行輸入R，表示熱重啓

 

8、調試dart代碼

關閉app

flutter工程下點擊按鈕，

沒有該按鈕的話，需要自己添加上，實際上就是菜單欄Run->flutter attach

打開app

flutter工程裏添加斷點就可以調試了