Flutter集成百度定位和百度地圖

準(zhǔn)備

請(qǐng)盡量先閱讀官方文檔,本文是對(duì)官方文檔的合并整理脊僚,結(jié)合自己項(xiàng)目集成過程轩端。
插件請(qǐng)以官方最新版本為主。

《百度定位烦感、地圖Flutter插件開發(fā)文檔》

《Api中心》

在使用前請(qǐng)先去申請(qǐng)百度的 key巡社,需要提供應(yīng)用 IOS 的 Bundle Identifier(包名),和 Android 的 SHA1 及包名《Android SHA1 文檔》

一啸盏、項(xiàng)目中引入插件

  flutter_bmflocation: ^1.0.4
  flutter_baidu_mapapi_map: ^2.0.1
  flutter_baidu_mapapi_search: ^2.0.1
  flutter_baidu_mapapi_utils: ^2.0.1

二重贺、配置 Android

  1. 新建 MyApplication 繼承 BmfMapApplication
import com.baidu.mapapi.base.BmfMapApplication
/**
 *
 * @author wapchief
 * @date 4/6/21
 */
class MyApplication : BmfMapApplication() {
    override fun onCreate() {
        super.onCreate()
    }
}
  1. 配置 AndroidManifest.xml
  • 替換 application 標(biāo)簽下的 name 為新建的 MyApplication;
  • 同時(shí)新增一條 meta-data 標(biāo)簽回懦,填寫百度申請(qǐng)的 key;
  • 添加 permission 定位權(quán)限
    <!-- 這個(gè)權(quán)限用于進(jìn)行網(wǎng)絡(luò)定位 -->
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
    <!-- 這個(gè)權(quán)限用于訪問GPS定位 -->
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<application
        android:name=".MyApplication">
           <meta-data
            android:name="com.baidu.lbsapi.API_KEY"
            android:value="百度AK" />
    </application>

三次企、配置 iOS

  1. info.plist 配置定位權(quán)限
    <key>NSLocationUsageDescription</key>
    <string></string>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string></string>
    <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
        <string>請(qǐng)求定位權(quán)限怯晕,獲取當(dāng)前位置</string>
        <key>NSLocationAlwaysUsageDescription</key>
        <string>請(qǐng)求定位權(quán)限,獲取當(dāng)前位置</string>
        <key>NSLocationWhenInUseUsageDescription</key>
        <string>請(qǐng)求定位權(quán)限缸棵,獲取當(dāng)前位置</string>
  1. 用 Xcode 打開 ios 文件
  2. 引入下面系統(tǒng)文件舟茶,在TARGETS->General->Linked Frameworks and Libraries 中點(diǎn)擊“+”


CoreLocation.framework
SystemConfiguration.framework
Security.framework
libsqlite3.0.tbd(xcode7以前為 libsqlite3.0.dylib)
CoreTelephony.framework
libc++.tbd(因需適配iOS12,需要將libstdc++.6.0.9.tbd 更新為libc++.tbd)
AdSupport.framework


image.png
  1. 在TARGETS->Build Settings->Other Linker Flags 中添加-ObjC


    image.png

4堵第、初始化

建議在 main 里初始化

    if (Platform.isAndroid) {
      BMFMapSDK.setCoordType(BMF_COORD_TYPE.BD09LL);
    }else if (Platform.isIOS) {
      BMFMapSDK.setApiKeyAndCoordType('替換為百度ios-AK', BMF_COORD_TYPE.BD09LL);
      LocationFlutterPlugin.setApiKey("替換為百度ios-AK");
    }

運(yùn)行 app吧凉,如果控制臺(tái)出現(xiàn)


ios-經(jīng)緯度類型設(shè)置成功
ios-啟動(dòng)引擎成功
ios-授權(quán)成功
ios-聯(lián)網(wǎng)成功


則表示配置成功

五、定位踏志,并獲取位置

  1. 請(qǐng)求定位權(quán)限
    可以使用 百度提供的權(quán)限獲取方法
LocationFlutterPlugin _locationPlugin = new LocationFlutterPlugin();
_locationPlugin.requestPermission();

本地可以對(duì)結(jié)果判斷是否有權(quán)限阀捅,而啟動(dòng)定位。

  1. 訂閱監(jiān)聽定位
StreamSubscription<Map<String, Object>> subscription;
subscription = locationUtils.onResultCallback().listen((Map<String, Object> result) {
      LogUtils.v("baiduLocationResult:$result");
      try {
        baiduLocation = BaiduLocation.fromMap(result);
        setState(() {});
      } catch (e) {
        print("errorLoaction:$e");
      }
    });
  1. 配置定位參數(shù)并啟動(dòng)定位
  /// 設(shè)置android端和ios端定位參數(shù)
  static _setLocOption() {
    /// android 端設(shè)置定位參數(shù)
    BaiduLocationAndroidOption androidOption = new BaiduLocationAndroidOption();
    androidOption.setCoorType("bd09ll"); // 設(shè)置返回的位置坐標(biāo)系類型
    androidOption.setIsNeedAltitude(true); // 設(shè)置是否需要返回海拔高度信息
    androidOption.setIsNeedAddres(true); // 設(shè)置是否需要返回地址信息
    androidOption.setIsNeedLocationPoiList(true); // 設(shè)置是否需要返回周邊poi信息
    androidOption.setIsNeedNewVersionRgc(true); // 設(shè)置是否需要返回最新版本rgc信息
    androidOption.setIsNeedLocationDescribe(true); // 設(shè)置是否需要返回位置描述
    androidOption.setOpenGps(true); // 設(shè)置是否需要使用gps
    androidOption.setLocationMode(LocationMode.Hight_Accuracy); // 設(shè)置定位模式
    androidOption.setScanspan(1000); // 設(shè)置發(fā)起定位請(qǐng)求時(shí)間間隔
    androidOption.setIsNeedLocationPoiList(true); //顯示周邊poi信息
    Map androidMap = androidOption.getMap();

    /// ios 端設(shè)置定位參數(shù)
    BaiduLocationIOSOption iosOption = new BaiduLocationIOSOption();
    iosOption.setIsNeedNewVersionRgc(true); // 設(shè)置是否需要返回最新版本rgc信息
    iosOption.setBMKLocationCoordinateType("BMKLocationCoordinateTypeBMK09LL"); // 設(shè)置返回的位置坐標(biāo)系類型
    iosOption.setActivityType("CLActivityTypeAutomotiveNavigation"); // 設(shè)置應(yīng)用位置類型
    iosOption.setLocationTimeout(10); // 設(shè)置位置獲取超時(shí)時(shí)間
    iosOption.setDesiredAccuracy("kCLLocationAccuracyBest"); // 設(shè)置預(yù)期精度參數(shù)
    iosOption.setReGeocodeTimeout(100); // 設(shè)置獲取地址信息超時(shí)時(shí)間
    iosOption.setDistanceFilter(100); // 設(shè)置定位最小更新距離
    iosOption.setAllowsBackgroundLocationUpdates(true); // 是否允許后臺(tái)定位
    iosOption.setPauseLocUpdateAutomatically(true); //  定位是否會(huì)被系統(tǒng)自動(dòng)暫停
    Map iosMap = iosOption.getMap();

    locationPlugin.prepareLoc(androidMap, iosMap);
  }
    ///啟動(dòng)定位
    if (null != locationPlugin) {
      _setLocOption();
      locationPlugin.startLocation();
    }

如果定位成功针余,baiduLocation將接收到定位結(jié)果饲鄙,并且會(huì)返回 經(jīng)緯度 等數(shù)據(jù)凄诞,如果要在地圖上顯示坐標(biāo),則必須要先定位忍级。

  1. 最后離開的時(shí)候別忘了取消訂閱帆谍,關(guān)閉定位
  @override
  void dispose() {
    super.dispose();
    if (null != subscription) {
      subscription.cancel();
    }
    if (null != locationPlugin) {
      locationPlugin.stopLocation();
    }
  }

六、在地圖上顯示定位

  1. 創(chuàng)建地圖組建
AspectRatio(
                        aspectRatio: 1 / 1,
                        child: BMFMapWidget(
                          onBMFMapCreated: onBMFMapCreated,
                          mapOptions: mapOptions ?? BMFMapOptions(),
                        ),
                      )
  1. 監(jiān)聽地圖繪制成功轴咱,初始化參數(shù)
  /// 創(chuàng)建完成回調(diào)
  void onBMFMapCreated(BMFMapController controller) {
    myMapController = controller;

    /// 地圖加載回調(diào)
    myMapController?.setMapDidLoadCallback(callback: () {
      print('mapDidLoad-地圖加載完成');
      //開啟定位汛蝙,配置地圖參數(shù)
      initMap();
    });
  }
  BMFMapController myMapController;
  BMFMapOptions mapOptions;
  initMap() {
    //需要提供經(jīng)緯度,可以參考上面定位朴肺,在定位結(jié)果回調(diào)里設(shè)置即可
    mapOptions = BMFMapOptions(
      center: BMFCoordinate(latitude, longitude),
      zoomLevel: 12,
    );
    myMapController?.updateMapOptions(mapOptions);
    //設(shè)置定位參數(shù)
    BMFLocation location = BMFLocation(
        coordinate: BMFCoordinate(latitude, longitude),
        altitude: 0,
        horizontalAccuracy: 5,
        verticalAccuracy: -1.0,
        speed: -1.0,
        course: -1.0);
    BMFUserLocation userLocation = BMFUserLocation(
      location: location,
    );
    myMapController?.updateLocationData(userLocation);
    //設(shè)置定位圖層樣式
    BMFUserLocationDisplayParam displayParam = BMFUserLocationDisplayParam(
        locationViewOffsetX: 0,
        locationViewOffsetY: 0,
        accuracyCircleFillColor: Colors.red,
        accuracyCircleStrokeColor: Colors.blue,
        isAccuracyCircleShow: true,
        locationViewImage: R.assetsImagesIconMark,
        //本地資源圖標(biāo)路徑
        locationViewHierarchy: BMFLocationViewHierarchy.LOCATION_VIEW_HIERARCHY_BOTTOM);
    myMapController?.updateLocationViewWithParam(displayParam);
  }

其它

POI 檢索等其它方法請(qǐng)參考官方文檔
http://lbsyun.baidu.com/index.php?title=flutter/guide/search/poi

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末患雇,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子宇挫,更是在濱河造成了極大的恐慌苛吱,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,214評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件器瘪,死亡現(xiàn)場(chǎng)離奇詭異翠储,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)橡疼,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,307評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門援所,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人欣除,你說我怎么就攤上這事住拭。” “怎么了历帚?”我有些...
    開封第一講書人閱讀 152,543評(píng)論 0 341
  • 文/不壞的土叔 我叫張陵滔岳,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我挽牢,道長(zhǎng)谱煤,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,221評(píng)論 1 279
  • 正文 為了忘掉前任禽拔,我火速辦了婚禮刘离,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘睹栖。我一直安慰自己硫惕,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,224評(píng)論 5 371
  • 文/花漫 我一把揭開白布野来。 她就那樣靜靜地躺著恼除,像睡著了一般。 火紅的嫁衣襯著肌膚如雪梁只。 梳的紋絲不亂的頭發(fā)上缚柳,一...
    開封第一講書人閱讀 49,007評(píng)論 1 284
  • 那天埃脏,我揣著相機(jī)與錄音,去河邊找鬼秋忙。 笑死彩掐,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的灰追。 我是一名探鬼主播堵幽,決...
    沈念sama閱讀 38,313評(píng)論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼弹澎!你這毒婦竟也來了朴下?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,956評(píng)論 0 259
  • 序言:老撾萬榮一對(duì)情侶失蹤苦蒿,失蹤者是張志新(化名)和其女友劉穎殴胧,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體佩迟,經(jīng)...
    沈念sama閱讀 43,441評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡团滥,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,925評(píng)論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了报强。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片灸姊。...
    茶點(diǎn)故事閱讀 38,018評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖秉溉,靈堂內(nèi)的尸體忽然破棺而出力惯,到底是詐尸還是另有隱情,我是刑警寧澤召嘶,帶...
    沈念sama閱讀 33,685評(píng)論 4 322
  • 正文 年R本政府宣布父晶,位于F島的核電站,受9級(jí)特大地震影響苍蔬,放射性物質(zhì)發(fā)生泄漏诱建。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,234評(píng)論 3 307
  • 文/蒙蒙 一碟绑、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧茎匠,春花似錦格仲、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,240評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至汽馋,卻和暖如春侮东,著一層夾襖步出監(jiān)牢的瞬間圈盔,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,464評(píng)論 1 261
  • 我被黑心中介騙來泰國(guó)打工悄雅, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留驱敲,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,467評(píng)論 2 352
  • 正文 我出身青樓宽闲,卻偏偏與公主長(zhǎng)得像众眨,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子容诬,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,762評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容