Android高德SDK 地圖篇二：Marker基本用法

時間  2021-08-15 標籤 html android git api markdown ide oop 佈局 spa 翻譯

Marker就是地圖上點的標記, Marker能夠實現以下功能:html

Marker類和MarkerOptions類

當咱們建立一個Marker的時候,咱們須要使用MarkerOptions類來android

MarkerOptions options = new MarkerOptions();
//對應Marker.setIcon方法  設置Marker的圖片
options.icon(BitmapDescriptorFactory.fromBitmap(bitmap));
//對應Marker.setPosition方法 設置Marker的座標
options.position(latlng);
//而後經過下面的方法來獲取Marker Amap類能夠經過地圖控件TextureMapView.getAmap()方法
Marker marker = Amap.addMarker(options);
複製代碼

MarkerOptions文檔：git

a.amap.com/lbs/static/…api

先看Marker類的3個方法markdown

Marker文檔:a.amap.com/lbs/static/…ide

Marker的載體(地圖View)

地圖View的類有三個   oop

MapView和TextureMapView的方法都是同樣的。
因爲MapView與SurfaceView同時使用出現黑屏及透視問題
可是TextureMapView不會。因此我建議你們使用TextureMapView比較好。佈局

MapView和TextureMapView的方法都是同樣的。
因爲MapView與SurfaceView同時使用出現黑屏及透視問題
可是TextureMapView不會。因此我建議你們使用TextureMapView比較好。spa

是用在穿戴設備上的，這個我沒用過,全部就不介紹了。翻譯

MapView類的生命週期方法

上面三個MapView類有相似android生命週期的方法

TextureMapView.onCreate(savedInstanceState);
TextureMapView.onResume();
TextureMapView.onPause();
TextureMapView.onSaveInstanceState(savedInstanceState);
TextureMapView.onDestroy();
複製代碼

請在Activity或者Fragment中生命週期中調用這寫方法。

添加TextureMapView到界面上

建一個Fragment

寫以下代碼  就能夠把地圖控件添加到界面上了

/**
 * @author jikun
 *         Created by jikun on 2018/3/9.
 */

public class MarkerMapFragment extends Fragment {
    private TextureMapView textureMapView;
    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater,
       @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment_marker_map, container, false);
    }
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        textureMapView = view.findViewById(R.id.textureMapView);
        textureMapView.onCreate(savedInstanceState);
    }
    /**
     * 方法必須重寫 來實現TextureMapView的生命週期方法
     */
    @Override
    public void onResume() {
        super.onResume();
        if (null != textureMapView) {
            textureMapView.onResume();
        }
    }
    /**
     * 方法必須重寫 來實現TextureMapView的生命週期方法
     */
    @Override
    public void onPause() {
        super.onPause();
        if (null != textureMapView) {
            textureMapView.onPause();
        }
    }
    /**
     * 方法必須重寫 來實現TextureMapView的生命週期方法
     */
    @Override
    public void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        if (null != textureMapView) {
            textureMapView.onSaveInstanceState(outState);
        }
    }
    /**
     * 方法必須重寫 來實現TextureMapView的生命週期方法
     */
    @Override
    public void onDestroy() {
        super.onDestroy();
        if (null != textureMapView) {
            textureMapView.onDestroy();
        }
    }
}
複製代碼

添加Marker到TextureMapView

咱們去高德路徑拾取的網頁上找一個座標點。

請必定去高德的路徑拾取 取座標點，不要去百度的  由於高德與百度用的不是一個座標系，座標系的問題我之後再講

座標拾取地址:lbs.amap.com/console/sho…

經度longitude是104.065692

緯度latitude是30.657505

(PS:這兩個也許你會記錯,告訴你們個小竅門,
在我國 經緯度 通常都是 經度數字比緯度數字大,經度英文是longitude,英文中有個long long 翻譯爲長,固然也表明大。
那麼若是你看到一個座標 是104.065692 ,30.657505 那麼大的那個就是經度longitude 小的就是緯度latitude。
這個是我平時觀察發現的,不是很官方,可是確實很好用，這樣就不會弄錯了)

而後咱們就能夠添加Marker到TextureMapView中

代碼以下:

private void addMarker() {
    MarkerOptions options = new MarkerOptions();
    //對應Marker.setIcon方法  設置Marker的圖片
    options.icon(BitmapDescriptorFactory.fromResource(R.mipmap.ic_launcher));
    //對應Marker.setPosition方法 設置Marker的座標

    //緯度在前 經度在後
    LatLng latLng = new LatLng(30.657505, 104.065692);
    options.position(latLng);
    //而後經過下面的方法來獲取Marker Amap類能夠經過地圖控件TextureMapView.getAmap()方法
    marker = textureMapView.getMap().addMarker(options);
    moveCameraOnMap();}

/**
 * 方法必須重寫 來實現TextureMapView的生命週期方法
 */
@Override
public void onDestroy() {
    super.onDestroy();
    if (null != textureMapView) {
        textureMapView.onDestroy();
    }
    // 別忘了onDestroy 摧毀Marker.
    if (null != marker) {
        marker.destroy();
        marker=null;
    }
}
/**
 * 移動地圖到Marker標記點位置的方法。
 */
private void moveCameraOnMap() {
    LatLng latLng = new LatLng(30.657505, 104.065692);
    CameraUpdate cameraUpdate = CameraUpdateFactory.newLatLng(latLng);
    textureMapView.getMap().moveCamera(cameraUpdate);
}
複製代碼

建一個Activity繼承FragmentActivity 請不要繼承AppCompatActivity(注意)

WHY?

關於爲何不繼承AppCompatActivity,  是這樣的 在android4.4.4機型上  若是你的Activity繼承的是AppCompatActivity  再使用高德導航API 會遇到資源ID異常的崩潰BUG.  若是繼承的是FragmentActivity，就不會有

Activity代碼以下:

public class MarkerActivity extends FragmentActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_marker);
        MarkerMapFragment markerMapFragment = MarkerMapFragment.newInstance();
        getSupportFragmentManager()
                .beginTransaction()
                .replace(R.id.flContent, markerMapFragment)
                .commitAllowingStateLoss();
    }
}
複製代碼

這樣咱們添加一個marker到地圖上：

Marker的錨點比例

什麼是錨點比例,

Marker在地圖上顯示是靠座標或者像素的。 座標(像素)在地圖上實際上是一個很小的點(能夠當作1px*1px)，可是Marker卻不是一個點，他是能夠設置圖片，他是有大小的(確定比1px*1px大)。那麼Marker如何根據座標點顯示本身呢？就是根據錨點比例的設置位置來顯示

我來舉個例子:

我來總結下
當它爲 0,0的時候 marker會以座標點在marker左上位置來顯示
當它爲0,1的時候 marker會以座標點在marker左下位置來顯示
當它爲1,0的時候 marker會以座標點在marker右上位置來顯示
當它爲1,1的時候 marker會以座標點在marker右下位置來顯示
當它爲0.5,0.5的時候 marker會以座標點爲中心來顯示
錨點取值範圍 u=0到1 v=0到1。是百分比取值的
若是你不設置 那麼 默認的錨點 是 0.5,1 

設置錨點比例的方法有兩個

一個是MarkerOptions的

一個是Marker的

代碼以下：

options.anchor(0.5F,1);
或者
marker.setAnchor(0.5F,1);
複製代碼

InfoWindow

什麼是InfoWindow 以下圖

InfoWindow 是與Marker相關的

InfoWindow 有一個默認的佈局效果

顯示默認的InfoWindow

默認的 Infowindow 只顯示 Marker 對象的兩個屬性，一個是 title 和另外一個 snippet 
調用 Marker 類的 showInfoWindow() 和 hideInfoWindow() 方法能夠控制顯示和隱藏

代碼以下

private void addMarker() {
    MarkerOptions options = new MarkerOptions();
    //對應Marker.setIcon方法  設置Marker的圖片
    options.icon(BitmapDescriptorFactory.fromResource(R.mipmap.ic_launcher));
    //對應Marker.setPosition方法 設置Marker的座標

    options.title("InfoWindow標題");
    options.snippet("InfoWindow的Snippet");
    //緯度在前 經度在後
    LatLng latLng = new LatLng(30.657505, 104.065692);
    options.position(latLng);
    //而後經過下面的方法來獲取Marker Amap類能夠經過地圖控件TextureMapView.getAmap()方法
    marker = textureMapView.getMap().addMarker(options);
    //顯示InfoWindow
    marker.showInfoWindow();
    moveCameraOnMap();
}
複製代碼

效果以下:

固然默認的InfoWindow是知足不了咱們的需求的,因此咱們要自定義InfoWindow

自定義InfoWindow

自定義InfoWindow 咱們須要調用

AMap.setInfoWindowAdapter(InfoWindowAdapter);

public interface InfoWindowAdapter {
    View getInfoWindow(Marker var1);

    View getInfoContents(Marker var1);
}
複製代碼

自定義佈局所須要的資源在代碼中請下載代碼查看吧。

咱們演示一下這個說明文檔

自定義InfoWindow的佈局

R.layout.map_fast_car_info_window跟標籤佈局不設置背景

那麼你獲得效果以下：

若是設置了背景

那麼效果以下

Marker還有不少方法，但願你們能夠多去試試，我在後面的實踐中也會給你們介紹一下

下篇爲你們帶來滴滴出行 打車界面的效果

代碼下載地址：gitee.com/justforgame…

联系我们 沪ICP备13005482号-10