1. 程式人生 > >Unity呼叫百度地圖(可實現模型、UI覆蓋)

Unity呼叫百度地圖(可實現模型、UI覆蓋)

相信如果在看我這篇部落格的朋友應該都已經將度娘上【Unity】+【百度地圖】下的搜尋結果的都看過一遍了,大概列舉一下:
1、使用百度地圖的Android SDK,將自己寫好的建立地圖View的方法打成jar包,並在Unity中呼叫。
2、使用百度地圖的靜態圖連結上傳引數,返回相應的靜態圖。
3、使用百度地圖的網頁版,相當於在Unity中開啟網頁操作。
分析一下這三種方法:
第一種方法是大家所能想到的最直接的接入百度地圖的方法,應該說實用性也比較好,但是由於是AddView操作,所以不能實現模型、UI的覆蓋(因為Unity最終實現也是一個View,我曾經想嘗試找到讓兩個View進行類似Alpha混合的方法)。
第二種方法可以實現模型、UI的覆蓋,但是由於下載靜態圖需要花費相對較多的時間,所以會有一段等待時間,說白了就是載入不同的圖片,效果比較差。
來看看最後一種方法,我們先說說Unity開啟網頁的外掛,最著名的就是uWebKit和UniWebView了,但是他們在安卓端開啟網頁的實現原理都是呼叫了安卓的WebView,所以這種方式又該被否決了。但是最近發現了一個叫CoherentUI的外掛,該外掛的意圖就是讓Web中製作的UI以View的形式與Unity進行互動。該外掛在android端開啟網頁的實現方式有兩種,一種是呼叫WebView,另一種則是使用Surface,也就是本文重點要闡述的物件。
使用CoherentUI外掛的MobileSurfaceUIView開啟的網頁,雖然不能直接和Unity進行互動,但它可以作為材質貼圖使用(本人不太瞭解Surface)。在幾番尋找之後終於在該外掛的論壇中找到了一篇關於間接互動的文章:

https://forums.coherent-labs.com/index.php/topic,194.msg560.html,大概意思就是所有輸入事件都由Unity進行判斷,如果是網頁點選事件的話就將座標點傳給Web,由Web進行輸入事件的生成和分發。這樣即實現了模型覆蓋,又避免了因為層級混合引發的輸入響應問題(點選螢幕時到底是Unity做出響應還是Web做出響應)。

最後貼出Unity中的指令碼和Web程式碼以註明間接互動的方式避免大家踩坑:

MobileSurface.cs

using UnityEngine;
#if UNITY_EDITOR || COHERENT_UNITY_STANDALONE
using Coherent.UI.Binding; using CoherentUI = Coherent.UI; #elif UNITY_IPHONE || UNITY_ANDROID using Coherent.UI.Mobile.Binding; using CoherentUI = Coherent.UI.Mobile; using Coherent.UI; #endif public class MobileSurface : MonoBehaviour { private MobileSurfaceView m_View; public GameObject cube; void
Start() { // 新增安卓聯網許可權 string a = SystemInfo.deviceUniqueIdentifier; m_View = GetComponent<MobileSurfaceView>(); } void Update() { cube.transform.Rotate(Vector3.up,1,Space.World); } /// <summary> /// 更新View /// </summary> [CoherentUI.CoherentMethod("myUpdateView")] private void myUpdateView() { m_View.UpdateView(); } /// <summary> /// 放大 /// </summary> public void ZoomIn() { m_View.View.ExecuteScript("zoomIn();"); m_View.UpdateView(); } /// <summary> /// 縮小 /// </summary> public void ZoomOut() { m_View.View.ExecuteScript("zoomOut();"); m_View.UpdateView(); } }

map.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="http://api.map.baidu.com/api?v=2.0&ak=申請的Key"></script>
</head>  

<body>  
<div id="container"></div> 
    <script type="text/javascript" src="javascript/coherent.js"></script>
<script type="text/javascript"> 
var map = new BMap.Map("container");
var point = new BMap.Point(116.404, 39.915);  
map.centerAndZoom(point, 15);
     engine.call("myUpdateView");                 
 function zoomIn()
{
     map.zoomIn();
}

 function zoomOut()
{
     map.zoomOut();
}

</script>  
</body>  
</html>

註明:
Unity調Web程式碼:
View.ExecuteScript(“方法”);

Web調Unity程式碼:
在Unity中為該方法新增[CoherentUI.CoherentMethod(“方法”)]屬性;
在Web程式碼中新增<script type="text/javascript" src="javascript/coherent.js"></script>
最後在Web中engine.call(“方法”);