Flutter 第三方SDK集成(友盟统计,极光推送,百度地图)

Flutter 第三方SDK集成(友盟统计,极光推送,百度地图)

八归少年 4,069 2020-09-15

友盟统计

Flutter SDK集成

  • 首先创建一个项目,接着去友盟工作台添加应用。添加成功后会得到AppKey。
集成友盟+ Flutter SDK
umeng_sdk:
 path: ./umeng_sdk/
  • 修改umeng_sdk文件夹下iOS目录下的umeng_sdandroidk.podspec文件。
  //对应版本号去umeng_sdk/android/libs目录下对应版本
  s.dependency 'UMCCommon' ,  '2.1.8'
  s.dependency 'UMCAnalytics', '8.1.4'
  • 在你自己Flutter项目的main.dart示例代码中,在_incrementCounter加入以下代码
  void _incrementCounter() {
    setState(() {
      // This call to setState tells the Flutter framework that something has
      // changed in this State, which causes it to rerun the build method below
      // so that the display can reflect the updated values. If we changed
      // _counter without calling setState(), then the build method would not be
      // called again, and so nothing would appear to happen.
      _counter++;
    });
//    UmengSdk.onEvent('myevent', {'name':'jack', 'age':18, 'male':true});
    // 取消用户账号
    UmengSdk.onProfileSignOff();
    // 如果需要使用页面统计,则先打开该设置
    UmengSdk.setPageCollectionModeManual();
    // 进入页面统计
    UmengSdk.onPageStart("MyApp");
    // 离开页面统计
    UmengSdk.onPageEnd("MyApp");
    // 错误发送
    UmengSdk.reportError("后台程序执行时间过长");
  }
  • 在自己项目的ios/AppDelegate.m中加入iOS的初始化代码
#import "GeneratedPluginRegistrant.h"
#import <UMCommonLog/UMCommonLogHeaders.h>
#import <UMCommon/UMConfigure.h>
- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    [UMCommonLogManager setUpUMCommonLogManager];
    [UMConfigure setLogEnabled:YES];
    [UMConfigure initWithAppkey:@"5861e5daf5ade41326001eab" channel:@"App Store"];
  [GeneratedPluginRegistrant registerWithRegistry:self];
  // Override point for customization after application launch.
  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}
Android 配置
  • 在AndroidManifest.xml设置权限、添加MainApplication/MyActivity、设置Appkey和Channel。
public class MainApplication extends FlutterApplication {
    @Override
    public void onCreate() {
        super.onCreate();
        //App Key会在新建应用成功时产生,App Channel自己命名
        UMConfigure.init(this, "Your App Key", "Your App Channel", UMConfigure.DEVICE_TYPE_PHONE, null);
        UMConfigure.setLogEnabled(true);
    }
}

Channel命名规则

1.可以由英文字母、阿拉伯数字、下划线、中划线、空格、括号组成,可以含汉字以及其他明文字符,但是不建议使用中文命名,会出现乱码。

2.首尾字符不可以为空格。

3.不要使用纯数字作为渠道ID。

4.最多256个字符。

5.”unknown” 及其各种大小写形式,作为友盟保留的字段,不可以作为渠道名。

<manifest>
  <uses-permission android:name="android.permission.INTERNET"/>
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
  <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
  <uses-permission android:name="android.permission.READ_PHONE_STATE"/>
  <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
  <uses-permission android:name="android.permission.CHANGE_WIFI_MULTICAST_STATE"/>
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
      <!--修改为新建的Application-->
    <application android:name=".MainApplication" ...>
  </application>
  ...
</manifest>

MainActivity

public class MainActivity extends FlutterActivity {
    @Override
    public void configureFlutterEngine(@NonNull FlutterEngine flutterEngine) {
        GeneratedPluginRegistrant.registerWith(flutterEngine);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        com.example.umeng_sdk.UmengSdkPlugin.setContext(this);
    }

    @Override
    protected void onPause() {
        super.onPause();
        MobclickAgent.onPause(this);
    }

    @Override
    protected void onResume() {
        super.onResume();
        MobclickAgent.onResume(this);
    }
}
iOS 配置

极光推送

Flutter SDK集成

  • 首先去友盟工作台添加一个应用。添加成功后会得到AppKey。接着去设置推送设置,将新建项目的包名填入。

  • 在自己项目的pubspec.yaml 文件中加入以下代码 Pub get。

jpush_flutter: 0.5.5
Android 配置
  • /android/app/build.gradle 文件中添加下列代码。
android: {
  ....
  defaultConfig {
    applicationId "替换成自己应用 ID"
    ...
    ndk {
	//选择要添加的对应 cpu 类型的 .so 库。
	abiFilters 'armeabi', 'armeabi-v7a', 'x86', 'x86_64', 'mips', 'mips64', 'arm64-v8a',        
    }

    manifestPlaceholders = [
        JPUSH_PKGNAME : applicationId,
        JPUSH_APPKEY : "appkey", // NOTE: JPush 上注册的包名对应的 Appkey.
        JPUSH_CHANNEL : "developer-default", //暂时填写默认值即可.
    ]
  }    
}
iOS配置
  • 在 xcode8 之后需要点开推送选项: TARGETS -> Capabilities -> Push Notification 设为 on 状态。

  • 在main.dart中添加如下代码。
 String debugLable = 'Unknown';
  final JPush jpush = new JPush();
  @override
  void initState() {
    super.initState();
    initPlatformState();
  }

  // Platform messages are asynchronous, so we initialize in an async method.
  Future<void> initPlatformState() async {
    String platformVersion;

    try {
      jpush.addEventHandler(
          onReceiveNotification: (Map<String, dynamic> message) async {
            setState(() {
              debugLable = "flutter onReceiveNotification: $message";
            });
          }, onOpenNotification: (Map<String, dynamic> message) async {
        setState(() {
          debugLable = "flutter onOpenNotification: $message";
        });
      }, onReceiveMessage: (Map<String, dynamic> message) async {
        setState(() {
          debugLable = "flutter onReceiveMessage: $message";
        });
      }, onReceiveNotificationAuthorization:
          (Map<String, dynamic> message) async {
        setState(() {
          debugLable = "flutter onReceiveNotificationAuthorization: $message";
        });
      });
    } on PlatformException {
      platformVersion = 'Failed to get platform version.';
    }

    jpush.setup(
      appKey: "your AppKey", //你自己应用的 AppKey
      channel: "theChannel",
      production: false,
      debug: true,
    );
    jpush.applyPushAuthority(
        new NotificationSettingsIOS(sound: true, alert: true, badge: true));

    // Platform messages may fail, so we use a try/catch PlatformException.
    jpush.getRegistrationID().then((rid) {
      setState(() {
        debugLable = "flutter getRegistrationID: $rid";
      });
    });

    // If the widget was removed from the tree while the asynchronous platform
    // message was in flight, we want to discard the reply rather than calling
    // setState to update our non-existent appearance.
    if (!mounted) return;

    setState(() {
      debugLable = platformVersion;
    });
  }

  • 最后在极光推送后台消息推送模块发送通知或自定义消息,打开手机通知栏可查看到。在推送后台也可查看推送历史,是否成功。
  • Demo地址:https://github.com/jpush/jpush-flutter-plugin

百度地图

  • 首先创建一个项目,接着去百度地图开发平台创建一个应用。

  • 指定应用类型为Android SDK时开发版SHA1和发布版SHA1获取

开发版SHA1获取

  • 用Android Studio打开项目Android目录,点击右上角侧边栏gradle,进入到android/app/android,双击signingReport,就会得到开发版SHA1。

发布版SHA1获取

指定应用类型为iOS SDK时安全码获取(Bundle Identifier)

安全码获取

设置Android和iOS端API_Key
  • 在Android目录清单文件的application节点中设置Android端AK,添加如下代码
<meta-data
    android:name="com.baidu.lbsapi.API_KEY"
    android:value="开发者申请的AK" />
  • 在dart文件中,通过对外接口setApiKey设置iOS端AK,可参考百度定位Flutter插件Demo。代码如下。
@override
void initState() {
  super.initState();

  _locationPlugin.requestPermission();
  //动态申请定位权限

  LocationFlutterPlugin.setApiKey("开发者申请的AK");
  //设置iOS端AK, Android端AK可以直接在清单文件中配置
}

定位

Flutter SDK 集成
  • 在自己项目的pubspec.yaml文件添加如下代码。Pub get。
flutter_bmflocation: ^1.0.2
Map<String, Object> _loationResult;
  BaiduLocation _baiduLocation; // 定位结果

  StreamSubscription<Map<String, Object>> _locationListener;

  LocationFlutterPlugin _locationPlugin = new LocationFlutterPlugin();

  @override
  void initState() {
    super.initState();

    /// 动态申请定位权限
    _locationPlugin.requestPermission();

    /// 设置ios端ak, android端ak可以直接在清单文件中配置
    LocationFlutterPlugin.setApiKey("百度地图开放平台申请的ios端ak");

    _locationListener = _locationPlugin
        .onResultCallback()
        .listen((Map<String, Object> result) {
      setState(() {
        _loationResult = result;
        try {
          _baiduLocation = BaiduLocation.fromMap(result); // 将原生端返回的定位结果信息存储在定位结果类中
        } catch (e) {
          print(e);
        }
      });
    });

  }

  @override
  void dispose() {
    super.dispose();
    if (null != _locationListener) {
      _locationListener.cancel(); // 停止定位
    }
  }
/// 启动定位
  void _startLocation() {
    if (null != _locationPlugin) {
      _setLocOption();
      _locationPlugin.startLocation();
    }
  }

  /// 停止定位
  void _stopLocation() {
    if (null != _locationPlugin) {
      _locationPlugin.stopLocation();
    }
  }
  /// 设置android端和ios端定位参数
  void _setLocOption() {
    /// android 端设置定位参数
    BaiduLocationAndroidOption androidOption = new BaiduLocationAndroidOption();
    androidOption.setCoorType("bd09ll"); // 设置返回的位置坐标系类型
    androidOption.setIsNeedAltitude(true); // 设置是否需要返回海拔高度信息
    androidOption.setIsNeedAddres(true); // 设置是否需要返回地址信息
    androidOption.setIsNeedLocationPoiList(true); // 设置是否需要返回周边poi信息
    androidOption.setIsNeedNewVersionRgc(true); // 设置是否需要返回最新版本rgc信息
    androidOption.setIsNeedLocationDescribe(true); // 设置是否需要返回位置描述
    androidOption.setOpenGps(true); // 设置是否需要使用gps
    androidOption.setLocationMode(LocationMode.Hight_Accuracy); // 设置定位模式
    androidOption.setScanspan(1000); // 设置发起定位请求时间间隔

    Map androidMap = androidOption.getMap();

    /// ios 端设置定位参数
    BaiduLocationIOSOption iosOption = new BaiduLocationIOSOption();
    iosOption.setIsNeedNewVersionRgc(true); // 设置是否需要返回最新版本rgc信息
    iosOption.setBMKLocationCoordinateType("BMKLocationCoordinateTypeBMK09LL"); // 设置返回的位置坐标系类型
    iosOption.setActivityType("CLActivityTypeAutomotiveNavigation"); // 设置应用位置类型
    iosOption.setLocationTimeout(10); // 设置位置获取超时时间
    iosOption.setDesiredAccuracy("kCLLocationAccuracyBest");  // 设置预期精度参数
    iosOption.setReGeocodeTimeout(10); // 设置获取地址信息超时时间
    iosOption.setDistanceFilter(100); // 设置定位最小更新距离
    iosOption.setAllowsBackgroundLocationUpdates(true); // 是否允许后台定位
    iosOption.setPauseLocUpdateAutomatically(true); //  定位是否会被系统自动暂停

    Map iosMap = iosOption.getMap();

    _locationPlugin.prepareLoc(androidMap, iosMap);
  }

地图

Flutter SDK集成
  • 在自己项目的pubspec.yaml文件添加如下代码。Pub get。
  # 百度地图
  flutter_bmfmap:  ^1.0.2
  # 计算工具
  flutter_bmfutils: ^1.0.2
Android配置
  • 在Android环境下初始化地图SDK,新建一个自定义的Application,在AndroidManifest.xml文件中声明该Application,代码如下。
public class MyApplication extends BmfMapApplication{
    @Override
    public void onCreate() {
        super.onCreate();
    }
}
  • Android端在app的build.gradle中android内添加如下代码。
 sourceSets {
        main {
            jniLibs.srcDirs 'jnilibs'
        }
    }

    packagingOptions{
        pickFirst 'lib/armeabi-v7a/libapp.so'
        pickFirst 'lib/armeabi/libapp.so'
        pickFirst 'lib/arm64-v8a/libapp.so'
        pickFirst 'lib/x86/libapp.so'
    }
  • 在main.dart中添加如下代码。
///BMFMapOptions构造,BMFMapOptions包含了创建地图所需要的各种状态参数
///经纬度需要自己通过定位获取,参考定位集成。默认为(39.917215, 116.380341);
BMFMapOptions mapOptions = BMFMapOptions(
        center: BMFCoordinate(39.917215, 116.380341),
        zoomLevel: 12,
        mapPadding: BMFEdgeInsets(left: 30, top: 0, right: 30, bottom: 0));
///地图Flutter Widget构造,BMFMapWidget是地图Flutter插件封装的一个支持AndroidView和UiKitView的Widget。
Container(
      height: screenSize.height,
      width: screenSize.width,
      child: BMFMapWidget(
        onBMFMapCreated: (controller) {
          onBMFMapCreated(controller);
        },
        mapOptions: mapOptions,
      ),
    );

Copyright: 采用 知识共享署名4.0 国际许可协议进行许可

Links: https://www.yanghujun.com/archives/fluttersdk