Android高德自定義marker點標記與infoWindow窗體

自定義marker與infoWindow窗體

 

 

1.展示地圖布局的xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">

    <com.amap.api.maps.MapView
        android:id="@+id/map"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

2.Activity自定義marker與infowindow(代碼注釋詳細)

 

/**
 * Created by YyyyQ on 2020/3/24
 */
public class MainActivity extends AppCompatActivity implements AMap.OnMarkerClickListener, AMap.InfoWindowAdapter, AMap.OnMapClickListener {

    private MapView mapView = null;
    private AMap aMap;
    private UiSettings uiSettings;
    //存放所有點的經緯度
    LatLngBounds.Builder boundsBuilder = new LatLngBounds.Builder();
    //當前點擊的marker
    private Marker clickMaker;
    //自定義窗體
    View infoWindow = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mapView = findViewById(R.id.map);
        mapView.onCreate(savedInstanceState);
        if (aMap == null) {
            aMap = mapView.getMap();
            uiSettings = aMap.getUiSettings();
            //設置地圖屬性
            setMapAttribute();
        }

        //模擬數據源
        List<Map<String, String>> list = getData();

        //循壞在地圖上添加自定義marker
        for (int i = 0; i < list.size(); i++) {
            LatLng latLng = new LatLng(Double.parseDouble(list.get(i).get("latitude")), Double.parseDouble(list.get(i).get("longitude")));
            MarkerOptions markerOption = new MarkerOptions();
            markerOption.position(latLng);
            markerOption.title(list.get(i).get("title"));
            markerOption.snippet(list.get(i).get("content"));
            //自定義點標記的icon圖標為drawable文件下圖片
            markerOption.icon(BitmapDescriptorFactory.fromBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.ditu_yiliao)));
            markerOption.draggable(false);
            aMap.addMarker(markerOption);
            //將所有marker經緯度include到boundsBuilder中
            boundsBuilder.include(latLng);
        }
        //更新地圖狀態
        aMap.animateCamera(CameraUpdateFactory.newLatLngBounds(boundsBuilder.build(), 10));
    }


    /**
     * 設置地圖屬性
     */
    private void setMapAttribute() {
        //設置默認縮放級別
        aMap.moveCamera(CameraUpdateFactory.zoomTo(12));
        //隱藏的右下角縮放按鈕
        uiSettings.setZoomControlsEnabled(false);
        //設置marker點擊事件監聽
        aMap.setOnMarkerClickListener(this);
        //設置自定義信息窗口
        aMap.setInfoWindowAdapter(this);
        //設置地圖點擊事件監聽
        aMap.setOnMapClickListener(this);
    }

    /**
     * 模擬數據源
     */
    private List<Map<String, String>> getData() {
        List<Map<String, String>> list = new ArrayList<>();
        for (int i = 1; i < 11; i++) {
            Map<String, String> map = new HashMap<>();
            map.put("title", "標題NO." + i);
            map.put("content", "這是第" + i + "個marker的內容");
            map.put("latitude", 43 + Math.random() + "");
            map.put("longitude", 125 + Math.random() + "");
            list.add(map);
        }
        return list;
    }

    /**
     * marker點擊事件
     */
    @Override
    public boolean onMarkerClick(Marker marker) {
        clickMaker = marker;
        //點擊當前marker展示自定義窗體
        marker.showInfoWindow();
        //返回true 表示接口已響應事,無需繼續傳遞
        return true;
    }

    /**
     * 監聽自定義窗口infoWindow事件回調
     */
    @Override
    public View getInfoWindow(Marker marker) {
        if (infoWindow == null) {
            infoWindow = LayoutInflater.from(this).inflate(R.layout.amap_info_window, null);
        }
        render(marker, infoWindow);
        return infoWindow;
    }

    /**
     * 自定義infoWindow窗口
     */
    private void render(Marker marker, View infoWindow) {
        TextView title = infoWindow.findViewById(R.id.info_window_title);
        TextView content = infoWindow.findViewById(R.id.info_window_content);
        title.setText(marker.getTitle());
        content.setText(marker.getSnippet());
    }

    /**
     * 不能修改整個InfoWindow的背景和邊框，返回null
     */
    @Override
    public View getInfoContents(Marker marker) {
        return null;
    }

    /**
     * 地圖點擊事件
     * 點擊地圖區域讓當前展示的窗體隱藏
     */
    @Override
    public void onMapClick(LatLng latLng) {
        //判斷當前marker信息窗口是否顯示
        if (clickMaker != null && clickMaker.isInfoWindowShown()) {
            clickMaker.hideInfoWindow();
        }

    }
}

 

3.自定義infoWindow窗體布局

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="160dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="@drawable/infowindow"
    android:orientation="vertical">
    <!--@drawable/infowindow為.9圖-->

    <TextView
        android:id="@+id/info_window_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="5dp"
        android:textColor="#333"
        android:textSize="14sp" />

    <TextView
        android:id="@+id/info_window_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="5dp"
        android:textColor="#333"
        android:textSize="12sp" />

</LinearLayout>