qt for android开发百度地图（一步步带图详解）

只是个~小不点

已于 2022-09-15 11:07:50 修改

阅读量4.2k

点赞数 4

分类专栏： qt for android 模拟共享单车开发之路文章标签： qt for android 百度地图开发

于 2022-04-26 13:27:36 首次发布

本文链接：https://blog.csdn.net/qq_44667165/article/details/124425313

版权

模拟共享单车开发之路同时被 2 个专栏收录

7 篇文章 2 订阅

订阅专栏

qt for android

4 篇文章 0 订阅

订阅专栏

qt for android开发百度地图

前言：qt for android开发百度地图，其实找了很多资料，基本上没有，就自己折磨弄了出来，这个过程还是很曲折的，折磨了一两个星期，没有资料，就两个字‘痛苦’，最后发现，还是挺简单的，自己走过的坑，写出来供后人借鉴吧

第一步:要进行百度地图开发者认证

第二步：接下来怎么在qt for android上打开这个html文件呢？

（一）先新建项目，选择Qt Quick Application-Empty，操作如下

（二）首先好配置qt for andorid的文件，在项目的android目录下新建一个assets的文件夹

前言：qt for android开发百度地图，其实找了很多资料，基本上没有，就自己折磨弄了出来，这个过程还是很曲折的，折磨了一两个星期，没有资料，就两个字‘痛苦’，最后发现，还是挺简单的，自己走过的坑，写出来供后人借鉴吧

qt for android 我用的是web开发，我尝试过Android SDK开发，不过失败了，官网给的开发例子是Android studio的，想用Qt for android套框架进去，还是有点难的，因为很多东西都没有，可能需要自己写了，我就放弃了

采用web开发，不用配置那么多的东西，简单，但需要会一些js，html，css，想深度开发的需要去学习一下

就说那么多，接下来开始正题

第一步:要进行百度地图开发者认证

进入官网百度地图开放平台 | 百度地图API SDK | 地图开发

登陆之后，在个人中心申请开发者认证

开发者认证成功后，创建应用，选择的是浏览器端（web）开发

最后提交即可看到创建的应用

接下来把应用的AK复制下来

编辑一个map.html文件，html内容如下

<!DOCTYPE html> 
<html>
	<head> 
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
		<title>Hello, World</title> 
		<style type="text/css"> 
		html{height:100%} 
		body{height:100%;margin:0px;padding:0px} 
		#container{height:100%} 
		</style> 
		<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=你的密匙">
		</script>
	</head> 
	  
	<body> 
		<div id="container"></div>
		<script type="text/javascript">
			var map = new BMapGL.Map("container");
			// 创建地图实例 
			var point = new BMapGL.Point(116.404, 39.915);
			// 创建点坐标 
			map.centerAndZoom(point, 15);

			//map.setTrafficOn();  //开启路况图层
			// 初始化地图，设置中心点坐标和地图级别 
		</script> 
	</body> 
</html>

然后在你的密匙处粘贴刚刚复制的AK

然后用浏览器打开这个map.html文件

到此百度地图配置完成，想要完成更多好玩的东西，如下图所示，有开发文档和例子可供参考

第二步：接下来怎么在qt for android上打开这个html文件呢？

这里是最折磨我的，具体的折磨我就不写，我要忘记这个痛苦

我使用的是qml中的webview组件来打开百度地图的html文件，也就是使用网页进行开发显示

（一）先新建项目，选择Qt Quick Application-Empty，操作如下

然后就会看到main.cpp文件，自动产生如下代码，大概意思就是，设置应用程序属性Qt :: AA_EnableHighDpiScaling 可以根据显示器的像素密度进行自动缩放。创建qml应用引擎，连接url，即qml文件，然后加载qml；

然后创建安卓默认文件目录模板

（二）首先好配置qt for andorid的文件，在项目的android目录下新建一个assets的文件夹

接下来把刚刚编辑的map.html文件放到这个文件夹中

然后来到qt这里，android添加现有文件，如下图所示

然后打开main.qml文件，把之前的内容全部删掉，复制如下内容到文件中，下面代码的含义是，创建一个webview的组件，然后用webview以浏览器形式打开map.html文件，如下所示

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtWebView 1.1
import QtQuick.Layouts 1.1
import QtQuick.Controls.Styles 1.2
import QtQuick.Window 2.0

ApplicationWindow{
    
    visible: true
    WebView {
        id: webView
        anchors.fill: parent

        url: "file:///android_asset/map.html"
        onLoadingChanged: {
            if (loadRequest.errorString)
                console.error(loadRequest.errorString);
        }
    }
}

上面代码中，安卓手机获取文件主目录下的assets目录下获取的，而且命名要规范，否则会找不到文件，如 file:///android_asset/map.html

android_asset就相当于我们刚刚建立的assets文件夹

然后编译即可，发现在如下目录生成了.apk文件