Android项目引入Flutter组件

Android已有项目引入Flutter组件

引入flutter组件有两种方式,将flutter module文件夹直接引入,将flutter module打包为aar文件引入或将aar包上传到maven库引入。

一、直接引入flutter module

1、使用Android studio打开已有Android项目,创建flutter module。
对于已经存在的项目创建Flutter module
创建成功后在项目同级目录下会生成module包
原项目、flutter module文件夹目录
查看项目setting.gradle文件,发现有以下变化

include ':app'
setBinding(new Binding([gradle: this]))
evaluate(new File(
  settingsDir,
  '../flutter_module/.android/include_flutter.groovy'
))
rootProject.name='My Application'

include ':flutter_module'
project(':flutter_module').projectDir = new File('../flutter_module')

项目app下build.gradle增加了

implementation project(path: ':flutter')

至此作为module引入flutter组件已经完成,如果flutter已经存在,可以直接将module复制到项目同级目录下,相应的修改setting.gradle、build.gradle文件即可。

二、作为aar文件引入flutter组件

flutter module打包为aar文件不再详述。
内容编辑中

原生Activity唤起Flutter页面

1、配置flutter页面

按照路由的方式修改main.dart文件,在那时创建了两个页面:默认页面、page1页面。
主要是MaterialApp中routes的用法。

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,
      ),
      routes: {
        "/": (context) => DefaultPageView(title: '路由默认页面'),
        'route_page':(context) => RoutPageView(title: '路由页面Page1'),
      },
    );
  }
}

2、修改Android项目

我们使用FlutterActivity完成启动Flutter页面。
修改AndroidManifest.xml文件,增加

 <activity
            android:name="io.flutter.embedding.android.FlutterActivity"
            android:theme="@style/AppTheme"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize"
            />

FlutterActivity唤起flutter页面的方式有两种:
1、唤起flutter默认路由

startActivity(
                        FlutterActivity.createDefaultIntent(MainActivity.this) //唤起默认路由页面
                );

2、唤起指定路由页面

startActivity(
                        FlutterActivity
                                .withNewEngine()
                                .initialRoute("route_page") //指定路由页面
                                .build(MainActivity.this)
                );

另:第二种方式中如果路由名称错误,会唤起默认路由页面。
这两种方式唤起Flutter页面的方式存在一个致命缺陷,页面唤起太慢,页面切换有空白出现,体验效果极差。

使用FlutterEngine

FlutterEngine字面页面我们可以理解为flutter启动加速器,可以配置flutter默认启动路由页面。

public class MyApplication extends Application {

    public static final String ENGINEID = "my_engine_id";

    @Override
    public void onCreate() {
        super.onCreate();

        initFlutterEngine();
    }


    private void initFlutterEngine(){
        // Instantiate a FlutterEngine.
        FlutterEngine flutterEngine = new FlutterEngine(this);
        flutterEngine.getNavigationChannel().setInitialRoute("route_page");// 配置默认启动路由

        // Start executing Dart code to pre-warm the FlutterEngine.
        flutterEngine.getDartExecutor().executeDartEntrypoint(
                DartExecutor.DartEntrypoint.createDefault()
        );

        // Cache the FlutterEngine to be used by FlutterActivity.
        FlutterEngineCache
                .getInstance()
                .put(ENGINEID, flutterEngine);
    }
}

使用方式

findViewById(R.id.btn_flutter_def).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                startActivity(
                        FlutterActivity
                                .withCachedEngine(MyApplication.ENGINEID)
                                .build(MainActivity.this)
                );
            }
        });

使用FlutterFragment

public class MyActivity extends FragmentActivity {

    private static final String TAG_FLUTTER_FRAGMENT = "flutter_fragment";

    // Declare a local variable to reference the FlutterFragment so that you
    // can forward calls to it later.
    private FlutterFragment flutterFragment;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my);

        FragmentManager fragmentManager = getSupportFragmentManager();

        // Create and attach a FlutterFragment if one does not exist.
        if (flutterFragment == null) {
            initFragment();

            fragmentManager
                    .beginTransaction()
                    .add(
                            R.id.fragment_container,
                            flutterFragment,
                            TAG_FLUTTER_FRAGMENT
                    )
                    .commit();
        }

    }

    void initFragment() {
        //默认启动方式
        flutterFragment = FlutterFragment.createDefault();

        //指定路由页面
        flutterFragment = FlutterFragment.withNewEngine()
                .initialRoute("route_page")
                .build();

        //使用FlutterEngine
        flutterFragment = FlutterFragment.withCachedEngine(MyApplication.ENGINEID)
                .renderMode(RenderMode.surface)
                .build();
    }

    @Override
    public void onPostResume() {
        super.onPostResume();
        flutterFragment.onPostResume();
    }

    @Override
    protected void onNewIntent(@NonNull Intent intent) {
        flutterFragment.onNewIntent(intent);
    }

    @Override
    public void onBackPressed() {
        flutterFragment.onBackPressed();
    }

    @Override
    public void onRequestPermissionsResult(
            int requestCode,
            @NonNull String[] permissions,
            @NonNull int[] grantResults
    ) {
        flutterFragment.onRequestPermissionsResult(
                requestCode,
                permissions,
                grantResults
        );
    }

    @Override
    public void onUserLeaveHint() {
        flutterFragment.onUserLeaveHint();
    }

    @Override
    public void onTrimMemory(int level) {
        super.onTrimMemory(level);
        flutterFragment.onTrimMemory(level);
    }

}
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值