Online Food ordering app ([email protected]) | Map kit | JAVA Part-2 - Huawei Developers

More information like this, you can visit HUAWEI Developer Forum​
Introduction
Online food ordering is process to deliver food from restaurants. In this article will do how to integrate Map kit in food applications. Huawei Map kit offers to work and create custom effects. This kit will work only Huawei device.
In this article, will guide you to show selected hotel locations on Huawei map.
Steps
1. Create App in Android.
2. Configure App in AGC.
3. Integrate the SDK in our new Android project.
4. Integrate the dependencies.
5. Sync project.
Map Module
Map kit covers map info more than 200 countries and it will support many languages. It will support different types of maps like Normal, Hybrid, Satellite, terrain Map.
Use Case
1. Display Map: show buildings, roads, temples etc.
2. Map Interaction: custom interaction with maps, create buttons etc.
3. Draw Map: Location markers, create custom shapes, draw circle etc.
Output
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Configuration
1. Login into AppGallery Connect, select FoodApp in My Project list.
2. Enable Map Kit APIs in manage APIs tab.
Choose Project Settings > ManageAPIs
Integration
Create Application in Android Studio.
App level gradle dependencies.
Code:
apply plugin: 'com.android.application'
apply plugin: 'com.huawei.agconnect'
Gradle dependencies
Code:
implementation 'com.huawei.hms:maps:4.0.0.301'
Root level gradle dependencies
Code:
maven <strong>{</strong>url <strong>'https://developer.huawei.com/repo/'</strong><strong>}
</strong>classpath <strong>'com.huawei.agconnect:agcp:1.3.1.300'</strong>
Add the below permissions in Android Manifest file
Code:
<manifest xlmns:android...>
...
<uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<application ...
</manifest>
Map Kit:
1. Create xml layout class define below snippet.
Code:
<com.huawei.hms.maps.MapView
android:layout_marginTop="?actionBarSize"
android:id="@+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
map:cameraZoom="8.5"
map:mapType="normal"
map:uiCompass="true"1)
map:uiZoomControls="true"/>
2. Implement OnMapReadyCallback method in activity/fragment, import onMapReady() method.
Initialize map in onCreate() then Call getMapSync().
Code:
Bundle mapViewBundle = null;
if (savedInstanceState != null) {
mapViewBundle = savedInstanceState.getBundle(BUNDLE_KEY);
}
mMapView.onCreate(mapViewBundle);
mMapView.getMapAsync(this);
4. onMapReady() method enable required settings like location button, zoom controls, title gestures, etc.
Code:
@Override
public void onMapReady(HuaweiMap huaweiMap) {
hMap = huaweiMap;
hMap.isBuildingsEnabled();
hMap.setMapType(0);
hMap.isTrafficEnabled();
hMap.setMaxZoomPreference(10);
………
}
5. addMarker() using this method we can add markers on map we can define markers position, title, icon etc. We can create custom icons.
Code:
MarkerOptions markerOptions = new MarkerOptions()
.position(new LatLng(location.lat, location.lng))
.title(response.name)
.icon(BitmapDescriptorFactory.fromResource(R.drawable.ic_hotel));
hMap.addMarker(markerOptions)
.showInfoWindow();
6. animateCamera() using this method we can animate the movement of the camera from the current position to the position which we defined.
Code:
CameraPosition build = new CameraPosition.Builder()
.target(new LatLng(location.lat, location.lng))
.zoom(15)
.bearing(90)
.tilt(30)
.build();
CameraUpdate cameraUpdate = CameraUpdateFactory.newCameraPosition(build);
hMap.animateCamera(cameraUpdate);
Result:
Conclusion
In this Article, I have explained how to integrate the Map on food application, displaying selected hotel on Map.
Reference:
Map Kit :
https://developer.huawei.com/consumer/en/doc/development/HMSCore-Guides/android-sdk-introduction-0000001050158633