Map Swipe on Android

Start New Project

Open Android Studio and Create new project
Setup project name
Select your minimum requirment Android SDK (API 19 : Android 4.4)
Select blank activity
Fill name of activity

Getting Started

To make it general, we will make the example using code from the Android Studio. First, download our latest library or grab via gradle. (See Full instructions here)

1. Adding our repository url on your root project, build.gradle :

 allprojects {
              repositories {
                  google()
                  jcenter()
                  maven {
                      url 'https://archiva.ujuizi.com/repository/internal/'
                  }
              }
          }

2. Then on your app build.gradle, add the 'maven' plugin and our dependency.

 apply plugin: 'com.android.application'
          apply plugin: 'maven'
          
          dependencies {
              implementation 'com.ujuizi.ramani:maps-api:0.1.1-alpha'
          }

3. Sync your gradle, and now it's on your Android project. For further information about our release version, please visit our Archiva Repository

Give some permissons

In most cases, you will have to set the following authorizations in your AndroidManifest.xml:

 `<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />`

Android 6.0+ devices require you have to check for "dangerous" permissions at runtime. Ramani requires the following dangerous permissions: WRITE_EXTERNAL_STORAGE and ACCESS_COARSE_LOCATION/ACCESS_FINE_LOCATION.

Create Map Layout

Create a "src/main/res/layouts/activity_main.xml" layout like this one. With Android Studio, it probably created one already called. The default is "src/main/res/layouts/activity_main.xml":

 `<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="0dp"
    android:paddingTop="0dp"
    android:paddingRight="0dp"
    android:paddingBottom="0dp"
    tools:context="com.ujuizi.ramani.myapplication.MainActivity">

    <com.ujuizi.ramani.mapsapi.MapView
        android:id="@+id/mapView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_margin="10dp" />
</RelativeLayout>`

Write view lines of code

To start using Ramani service you need Ramani API and you can create on this page. We now create the main activity (MainActivity.java):

 `package com.ujuizi.ramani.myapplication;

import android.annotation.TargetApi;
import android.os.Build;
import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;

import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;

import com.ujuizi.ramani.mapsapi.MapView;
import com.ujuizi.ramani.mapsapi.account.RMAccountManager;
import com.ujuizi.ramani.mapsapi.services.RMMapServices;
import com.ujuizi.ramani.mapsapi.services.RMServicesManager;
import com.ujuizi.ramani.mapsapi.services.layer.RMMapTileLayer;
import com.ujuizi.ramani.mapsapi.services.layer.RMMapTileSource;

import org.oscim.android.cache.TileCache;
import org.oscim.core.GeoPoint;
import org.oscim.layers.tile.buildings.BuildingLayer;
import org.oscim.layers.tile.vector.VectorTileLayer;
import org.oscim.layers.tile.vector.labeling.LabelLayer;
import org.oscim.map.Map;
import org.oscim.theme.ThemeLoader;
import org.oscim.theme.VtmThemes;
import org.oscim.tiling.source.oscimap4.OSciMap4TileSource;

import java.io.InputStream;
import java.util.ArrayList;


public class MainActivity extends AppCompatActivity implements RMMapServices.RMServiceListener, RMAccountManager.RMAccountManagerListener, OnSeekBarChangeListener {
    private static final String TAG = MainActivity.class.getSimpleName();


    private static final String layerID = "ddl.simS3seriesCoverGlobal.coverclass";
    private Map mMap;
    private RMMapServices mapServices;
    private RMMapTileLayer bitmapTileLayer;

    private float opacity = 0.5f;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR2)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        setupMap();

        setupRamaniMaps();

        setupMapSwipeSeekBar();

    }

    private void setupMapSwipeSeekBar() {
        SeekBar mSeekBar = findViewById(R.id.seekBar);
        mSeekBar.setProgress(50);
        mSeekBar.setOnSeekBarChangeListener(this);
    }

    private void setupRamaniMaps() {
        //open https://ramani.ujuizi.com/android.html for more details
        RMAccountManager.init(this, this, "cheetah", "3e48b9f96d5690f82ced3c2db17cc275");
    }

    private void setupMap() {
        MapView mMapView = findViewById(R.id.mapView);
        mMap = mMapView.map();
        mapServices = new RMMapServices();
        mapServices.setRMServiceListener(this);
        OSciMap4TileSource tileSource = new OSciMap4TileSource();
        // tileSource = new OSciMap4TileSource("www"); or you can change it into your custom url

        mMapView.setMapPosition(new GeoPoint(51.221297, 4.399128), 7);

        // for map cache
        TileCache mCache = new TileCache(this, null, "opensciencemap-tiles.db");
        mCache.setCacheSize(512 * (1 << 10));
        tileSource.setCache(mCache);


        // your base map with building
        VectorTileLayer mBaseLayer = mMap.setBaseMap(tileSource);
        mMap.layers().add(new BuildingLayer(mMap, mBaseLayer));
        mMap.layers().add(new LabelLayer(mMap, mBaseLayer));
        mMap.setTheme(ThemeLoader.load(VtmThemes.DEFAULT), true);
        mMapView.setScaleBar(true);
    }

    @Override
    public void onStringResult(RMMapServices.Task task, String s) {

    }

    @Override
    public void onStringArrayResult(RMMapServices.Task task, ArrayList arrayList) {

    }

    @Override
    public void onByteResult(RMMapServices.Task task, InputStream inputStream) {

    }

    @Override
    public void onFailed(RMMapServices.Task task, String s) {

    }

    @Override
    public void onMapAuthDone() {
        // false if auth success and token generated
        if (RMServicesManager.getToken().isEmpty())
            return;

        // for layer id, you can choose on Maps Index https://ramani.ujuizi.com/maps/index.html
        bitmapTileLayer = new RMMapTileLayer(mMap, new RMMapTileSource(layerID));
        bitmapTileLayer.tileRenderer().setBitmapAlpha(0.5f); // layer opacity, range 0 - 1
        mMap.layers().add(2, bitmapTileLayer); //index hierarchy, 0 is basemap
        mMap.render();
    }

    @Override
    public void onProgressChanged(SeekBar seekBar, int i, boolean b) {

    }

    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {

    }

    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
        float opacity = seekBar.getProgress() / 100.0f;
        mMap.layers().remove(bitmapTileLayer);
        bitmapTileLayer.tileRenderer().setBitmapAlpha(opacity);
        mMap.layers().add(2, bitmapTileLayer);
        mMap.render();
    }
}`

And that's enough to give it a try, and see this view. to change the map view just drag the slider.
Download full source code here