Bạn Đang Xem: Giới thiệu về Mapbox SDK

Tất cả chúng ta đã thân thuộc với Google Map SDK và khi thử tìm hiểu một vector maps khác cho Android để trả lời cho vướng mắc “Còn tồn tại thư viện vector map nào tốt nữa không?” Lời giải đáp: Mapbox SDK

1. Create MapboxDemoApp in Android Studio

• Trước tiên bạn cần phải tạo MapboxDemoApp trong Android Studio với những setting đơn mặc định (chỉ với sau vài click Next) Như Ảnh:

2. Create Access token

• Tiếp theo cần 1 access token:

• Open Homepage >> Sign up một tài khoản >> Get Access Token
• Trong trường hợp bạn cần phải tạo mới 1 access token dùng riêng cho từng Apps: click Create a new token

check box một vài Option bạn muốn + nhập tên của token.

Bạn chỉ việc click extend tên token bạn vừa tạo ra sẽ thấy token cần lấy.

3. Installing Mapbox

Tùy chỉnh thiết lập trong App >> Gradle như sau:

dependencies { compile fileTree(dir: ‘libs’, include: [‘*.jar’]) androidTestCompile(‘com.android.support.test.espresso:espresso-core:2.2.2’, { exclude group: ‘com.android.support’, module: ‘support-annotations’ }) compile ‘com.android.support:appcompat-v7:25.0.0’ testCompile ‘junit:junit:4.12’ // Mapbox SDK compile (‘com.mapbox.mapboxsdk:mapbox-android-sdk:4.2.0-beta.4@aar’){ transitive=true } }

Nhìn vào compile cho mapbox ta thấy phiên bản tất cả chúng ta đang sử dụng trong apps là beta 4.2 đây là bản thử nghiệm tiên tiến nhất của nhà cung cấp.

Nếu muốn dùng bản chạy ổn định nhất ngày nay thì bạn làm như sau: open Homepage >> view Gradle >> click Stable

Xem Thêm : Hướng Dẫn về Quỹ Phòng Xa Trung Ương (CPF) tại Singapore

Kết quả:

compile (‘com.mapbox.mapboxsdk:mapbox-android-sdk:4.1.1@aar’){ transitive=true }

4. Code and Build project

• Thêm một số permission và service cấp thiết vào AndroidManifest.xml

<uses-permission android:name=”android.permission.ACCESS_NETWORK_STATE” /> <uses-permission android:name=”android.permission.INTERNET” /> <uses-permission android:name=”android.permission.ACCESS_COARSE_LOCATION” /> <uses-permission android:name=”android.permission.ACCESS_FINE_LOCATION” /> <application android:allowBackup=”true” android:icon=”@mipmap/ic_launcher” android:label=”@string/app_name” android:supportsRtl=”true” android:theme=”@style/AppTheme”> <activity android:name=”.MainActivity”> <intent-filtervàgt; <action android:name=”android.intent.action.MAIN” /> <category android:name=”android.intent.category.LAUNCHER” /> </intent-filtervàgt; </activityvàgt; <!-targeting Android Marshmallow (API 23) or later it’s necessary to request permissions at runtime.-> <service android:name=”com.mapbox.mapboxsdk.telemetry.TelemetryService” /> </applicationvàgt;

• Input access token trong string.xml

<resourcesvàgt; <string name=”app_name”>MapboxDemoAppvàlt;/stringvàgt; <string name=”access_token”>pk.eyJ1IjoibWFwaW9uIiwiYSI6ImNpdzB1MG9rZDAwM2QyenBqeWc2cmx3eXQifQ.9l4QV3KaEQ_xWEMg7Y8YaQvàlt;/stringvàgt; </resourcesvàgt;

• Cần add MapboxAccountManager

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); MapboxAccountManager.start(this, getString(R.string.access_token)); setContentView(R.layout.activity_main); …

• Edit lại giao diện một tẹo và sử dụng MapView cho activity_main.xml

Ngay lúc này chúng ta cũng có thể thấy view sample của Mapbox hiện ra

Handle MapView

Chúng ta cũng có thể change style, custom style, change location , camera position, add markers….

• Lifecycle methods:

  onCreate();

  onResume();

  Xem Thêm : Senior trong cấp bậc công việc là gì? Phân biệt Senior và Junior

  onPause();

  onSaveInstanceState();

  onLowMemory();

  onDestroy();

• Edit lại MainActivity như sau :

@Override protected void onCreate(Bundle savedInstanceState) { // Create a mapView mapView = (MapView) findViewById(R.id.mapview); mapView.onCreate(savedInstanceState); mapView.getMapAsync(new OnMapReadyCallback() { Override public void onMapReady(MapboxMap mapboxMap) { // Customize map with markers, polylines, etc. mapboxMap.setStyleUrl(Style.LIGHT); } }); } Override public void onResume() { super.onResume(); mapView.onResume(); } Override public void onPause() { super.onPause(); mapView.onPause(); } Override public void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); mapView.onSaveInstanceState(outState); } Override public void onLowMemory() { super.onLowMemory(); mapView.onLowMemory(); } Override protected void onDestroy() { super.onDestroy(); mapView.onDestroy(); }

• Thay đổi location bằng phương pháp sau:

Hanoi: (lat = 21.027764 , long = 105.834160)

nước Nhật: (lat = 36.204824 , long = 138.252924)

• Edit activity_main.xml

<com.mapbox.mapboxsdk.maps.MapView mapbox:center_latitude=”21.027764″ mapbox:center_longitude=”105.834160″ mapbox:style_url=”@string/style_mapbox_streets” mapbox:tilt=”20″ mapbox:zoom=”12″ … />

• Cách thay đổi style cho mapbox đơn giản như sau: thêm vào string.xml

<string name=”mapbox_style_url”>mapbox://styles/mapbox/light-v9vàlt;/stringvàgt;

Sau đó bạn set trong file layout của mình. (yeah)

Với bài san sẻ của mình trên đây mong rằng có thể trợ giúp các bạn có thêm một dụng cụ mới khi cần sử dụng map

– The End –