flutter中android子工程报错,Flutter混合Android

1.新建一个Android工程

比如工程名MyApplication

2.创建Flutter Module

在cd到当前project下运行命令:

E:\MyApplication

flutter create -t module my_flutter

3.增加配置代码

在工程setttings.gradle中增加配置:

include ':app'

setBinding(new Binding([gradle: this]))

evaluate(new File(settingsDir, 'my_flutter/.android/include_flutter.groovy'))

接下来在app的build.gradle增加依赖:

implementation project(':flutter')

可能会报错:

Error: Invoke-customs are only supported starting with Android O (--min-api 26)

在app的build.gradle的android标签下增加:

compileOptions{

sourceCompatibility JavaVersion.VERSION_1_8

targetCompatibility JavaVersion.VERSION_1_8

}

最后生成的目录结构:

Android混合Flutter.PNG

经过上面3步就已经集成Flutter了,接着看看怎么在Android工程中创建Flutter的UI

4.Android中创建Flutter UI

Flutter提供两种方法引入,一个是View,一个是Fragment,看下View的代码:

public class FlutterActivity extends AppCompatActivity {

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_flutter);

FlutterView view = Flutter.createView(this, getLifecycle(), "new_page");

FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(

FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT

);

addContentView(view, layoutParams);

}

}

第二个参数是Lifecycle对象,第三个参数是route,这个参数Flutter端可以通过window.defaultRouteName获取

看下Flutter侧的dart代码, 在my_flutter->lib目录下新建list.dart:

import 'package:flutter/material.dart';

class ListViewTest extends StatelessWidget {

@override

Widget build(BuildContext context) {

Widget divider1 = Divider(color: Colors.blue);

Widget divider2 = Divider(color: Colors.green);

return Scaffold(

appBar: AppBar(

// Here we take the value from the MyHomePage object that was created by

// the App.build method, and use it to set our appbar title.

title: Text('ListTest'),

),

body: Center(

child: ListView.separated(

itemBuilder: (BuildContext context, int index) {

return ListTile(

title: Text("$index"),

);

},

separatorBuilder: (BuildContext context, int index) {

return index % 2 == 0 ? divider1 : divider2;

},

itemCount: 100),

),

);

}

}

在main.dart中导出路由new_page:

import 'package:flutter/material.dart';

import 'list.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,

),

home: MyHomePage(title: 'Flutter Demo Home Page'),

routes: {

"new_page": (context) => ListViewTest(),

},

);

}

}

5.hot reload

进入到flutter module目录下, 执行命令 flutter attach 即可, 在这个命令窗口按r即可hot reload:

E:\MyApplication\my_flutter

λ flutter attach

Waiting for a connection from Flutter on vivo x27...

Done.

Syncing files to device vivo x27... 1,125ms

To hot reload changes while running, press "r". To hot restart (and rebuild state), press "R".

An Observatory debugger and profiler on vivo 1819 is available at: http://127.0.0.1:55515/

For a more detailed help message, press "h". To detach, press "d"; to quit, press "q".

Initializing hot reload...

Reloaded 2 of 433 libraries in 969ms.

6.总结

最后对比看下继承了Flutter和没有继承的Android工程打出来的Release包大小对比:

withFlutterApkSize.PNG

withoutFlutterApkSize.PNG

接入Flutter之后,包大小激增5M,主要是因为flutter.so这个so库。还有flutter_assets里是flutter工程产生的assets文件, isolate_snapshot_data、isolate_snapshot_instr、vm_snapshot_data、vm_snapshot_instr为特定平台的数据和指令.

你可能感兴趣的:(flutter中android子工程报错,Flutter混合Android)