Android - GoogleMap ScaleView - 顯示比例尺

Android - GoogleMap ScaleView - 顯示比例尺

https://github.com/pengrad/MapScaleView

當被要求要顯示比例尺之後,才發現,Android GoogleMap 的原生,竟然沒有比例尺這種東西呀。

幸好還能從網路上找到這個解。

首先,得在build.gradle(Module:app層)加入,該libirary的dependencies

dependencies {
    implementation 'com.github.pengrad:mapscaleview:1.3.1'
}

再來更改原本由AndroidStudio預設建立的GoogleMap Layout改為如下

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <fragment
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </fragment>
    <com.github.pengrad.mapscaleview.MapScaleView
        android:id="@+id/scaleView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="4dp"/>
</FrameLayout>

並在onCreate的時使,設定該變數資料

    private GoogleMap mMap;
    public MapScaleView scaleView = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_maps);
        // Obtain the SupportMapFragment and get notified when the map is ready to be used.
        scaleView = (MapScaleView) findViewById(R.id.scaleView);

        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

並實作三個事件設定

implements OnMapReadyCallback, GoogleMap.OnCameraChangeListener,GoogleMap.OnCameraMoveListener,GoogleMap.OnCameraIdleListener

覆寫三個方法


    @Override
    public void onCameraMove() {
        CameraPosition cameraPosition = mMap.getCameraPosition();
        scaleView.update(cameraPosition.zoom, cameraPosition.target.latitude);
    }

    @Override
    public void onCameraIdle() {
        CameraPosition cameraPosition = mMap.getCameraPosition();
        scaleView.update(cameraPosition.zoom, cameraPosition.target.latitude);
    }


    @Override
    public void onCameraChange(CameraPosition cameraPosition) {
        scaleView.update(cameraPosition.zoom, cameraPosition.target.latitude);
    }

OnMapReady的時候取得Map,也順便更新scaleView及設定事件

    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;
        // Add a marker in Sydney and move the camera
        LatLng default= new LatLng( 23.973875, 120.982024);
        mMap.moveCamera(CameraUpdateFactory.newLatLng(default));
        mMap.setOnCameraMoveListener(this);
        mMap.setOnCameraIdleListener(this);
        mMap.setOnCameraChangeListener(this);

        CameraPosition cameraPosition = mMap.getCameraPosition();
        // need to pass zoom and latitude
        scaleView.update(cameraPosition.zoom, cameraPosition.target.latitude);
    }

這樣就能有ScaleView,以上實測過,該Library真的有用。