在 Flutter 应用中集成 Kraken

不支持 Android 模拟器，请使用真机

在这里，我们设定环境中已经完全安装 Kraken 指定的 Flutter stable 版本，并且 flutter doctor 检测全部通过。

使用下面的命令创建一个新的 Flutter App

  1. flutter create myapp
  2. cd myapp

连接 Android 或者 iOS 手机，确保使用 flutter devices 可以看到已经连接的设备：

  1. flutter devices
  2. 1 connected devices:
  4. HWI TL00 (mobile) • 77P5T18126000120 • android-arm64 • Android 9 (API 28)

打开 pubspec.yaml 文件，然后在 dependencies 下面添加 kraken 的依赖。

  1. dependencies:
  2.   kraken: '>= 0.0.1' # 会安装最新的 kraken 依赖

然后执行下面的命令自动安装依赖：

  1. flutter pub get

在国内可能会出现安装失败的情况，如果安装失败，可以参考链接内容使用国内镜像：https://flutter.cn/community/china

打开 lib/main.dart，然后粘贴如下代码：

  1. import 'package:flutter/material.dart';
  2. import 'package:kraken/kraken.dart';
  4. void main() {
  5.   runApp(MyApp());
  6. }
  8. class MyApp extends StatelessWidget {
  9.   // This widget is the root of your application.
  10.   @override
  11.   Widget build(BuildContext context) {
  12.     Kraken kraken = Kraken(bundle: KrakenBundle.fromUrl('http://kraken.oss-cn-hangzhou.aliyuncs.com/demo/guide-styles.js'));
  14.     return MaterialApp(
  15.       title: 'Flutter Demo',
  16.       theme: ThemeData(
  17.         primarySwatch: Colors.blue,
  18.         visualDensity: VisualDensity.adaptivePlatformDensity,
  19.       ),
  20.       home: kraken
  21.     );
  22.   }
  23. }

然后再执行 flutter run 就可以运行了。