لایه نقاط مورد علاقه

پروژه‌ی آموزشی نحوه‌ استفاده از SDK نقشه نشان

لایه نقاط مورد علاقه (POI)

هدف از این بخش از پروژه بررسی نحوه فعال‌سازی و غیرفعال‌سازی لایه نقاط مورد علاقه و بررسی دو حالت نمایش روشن و تاریک در این لایه است.

• activity_poi_layer.xml

در این صفحه، علاوه بر المان نقشه نشان، یک ToggleButton برای فعال‌ یا غیرفعال کردن لایه نقاط مورد علاقه وجود دارد. همچنین یک ImageView برای تغییر استایل نقشه و به طور همزمان تغییر استایل لایه نقاط مورد علاقه وجود دارد.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".activity.POILayer">

    <org.neshan.ui.MapView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:id="@+id/map"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

    <ToggleButton
        android:checked="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/toggle_button_text_color"
        android:textOff="لایه POI"
        android:textOn="لایه POI"
        android:elevation="8dp"
        android:paddingStart="8dp"
        android:paddingEnd="8dp"
        android:drawableStart="@drawable/ic_poi_layer"
        android:drawableTint="@color/toggle_button_text_color"
        android:drawablePadding="8dp"
        android:background="@drawable/toggle_button_bg"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        tools:targetApi="m"
        android:onClick="togglePOILayer"/>

    <android.support.v7.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:cardCornerRadius="4dp"
        app:cardElevation="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent">

        <ImageView
            android:id="@+id/theme_preview"
            android:layout_width="75dp"
            android:layout_height="75dp"
            android:scaleType="centerCrop"
            android:onClick="changeStyle"/>

    </android.support.v7.widget.CardView>

</android.support.constraint.ConstraintLayout>

• POILayer.java

شماره لایه‌هایی که نقشه نشان و لایه نقاط مورد علاقه باید در آن‌ها قرار گیرند به ترتیب در ثابت‌های BASE_MAP_INDEX و POI_INDEX ذخیره شده‌اند.

    // layer number in which map is added
    final int BASE_MAP_INDEX = 0;
    final int POI_INDEX = 1;

themePreview جهت نمایش پیش‌نمایش حالت بعدی نقشه است. isPOIEnable برای نشان‌دادن این که لایه نقاط مورد علاقه فعال است یا خیر، استفاده می‌شود.

    // map style control
    ImageView themePreview;
    boolean isPOIEnable = true;

متد initLayoutRefrences جهت مقداردهی اولیه کردن به تمامی المان‌های مربوط به رابط کاربری نوشته شده‌است. به دلیل این که لازم است تا المان اندرویدی نقشه نشان ابتدا به طور کامل ایجاد شود و سپس با آن تعامل برقرار شود (متدهای مختلف بر روی المان نقشه اجرا شود)، تمامی متدهای مربوط به رابط کاربری باید در متد onStart انجام شوند.

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // starting app in full screen
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_poi_layer);
    }

    @Override
    protected void onStart() {
        super.onStart();
        // everything related to ui is initialized here
        initLayoutReferences();
    }

پس از مقداردهی اولیه viewها و نقشه نشان، متد validateThemePreview صدا زده می‌شود. این متد پیش‌نمایش نقشه بعدی را در themePreview نشان می‌دهد و در صفحه تغییر استایل نقشه توضیح داده شده است.

    // Initializing layout references (views, map and map events)
    private void initLayoutReferences() {
        // Initializing views
        initViews();
        // Initializing mapView element
        initMap();
        // Initializing theme preview
        validateThemePreview();
    }

در خط آخر این متد، با استفاده از صدا زدن متد createPOILayer از کلاس NeshanServices یک لایه نقاط مورد علاقه جدید ساخته می‌شود. به عنوان آرگومان ورودی به متد createPOILayer باید یک boolean داده شود که در صورت true بودن، استایل لایه نقاط مورد علاقه، تاریک خواهد بود. در این‌جا این آرگومان ورودی برابر عبارت mapStyle == NeshanMapStyle.STANDARD_NIGHT است. یعنی وقتی استایل نقشه، حالت شب باشد، استایل لایه کاربردی نیز تاریک خواهد بود.

    // Initializing map
    private void initMap(){
        // add Standard_day map to layer BASE_MAP_INDEX
        map.getOptions().setZoomRange(new Range(4.5f, 18f));
        mapStyle = NeshanMapStyle.STANDARD_DAY;
        map.getLayers().insert(BASE_MAP_INDEX, NeshanServices.createBaseMap(NeshanMapStyle.STANDARD_DAY));

        // Setting map focal position to a fixed position and setting camera zoom
        map.setFocalPointPosition(new LngLat(51.330743, 35.767234),0 );
        map.setZoom(14,0);

        // adding POI layer to POI_INDEX
        map.getLayers().insert(POI_INDEX, NeshanServices.createPOILayer(mapStyle == NeshanMapStyle.STANDARD_NIGHT));
    }

در این متد بررسی می‌شود که اگر toggleButton موجود در رابط کاربری در حالت انتخاب شده باشد، لایه نقاط مورد علاقه ساخته شده و به نقشه اضافه شود و در غیر این صورت این لایه از نقشه حذف شود.

    public void togglePOILayer(View view) {
        ToggleButton toggleButton = (ToggleButton) view;
        isPOIEnable = !isPOIEnable;
        if (toggleButton.isChecked())
            map.getLayers().insert(POI_INDEX, NeshanServices.createPOILayer(mapStyle == NeshanMapStyle.STANDARD_NIGHT));
        else
            map.getLayers().remove(map.getLayers().get(POI_INDEX));
    }

با هر بار لمس ImageView موجود در رابط کاربری، این متد صدا زده می‌شود.

در این متد، ابتدا با بررسی استایل قبلی نقشه، استایل جدید نقشه مشخص می‌شود. سپس یک نخ رابط کاربری جدید ایجاد می‌شود و متد validateThemePreview در آن صدا زده می‌شود تا پیش‌نمایش استایل بعدی نقشه نیز مشخص شود.

در ادامه، نقشه فعلی حذف شده و نقشه با استایل جدید به لایه شماره BASE_MAP_INDEX اضافه می‌شود. همچنین بررسی می‌شود که اگر isPOIEnable برابر با true باشد، لایه نقاط مورد علاقه نیز حذف شده و لایه جدید (که دوباره تاریک بودن یا نبودن آن بررسی می‌شود) به نقشه اضافه می‌شود.

    public void changeStyle(View view) {
        NeshanMapStyle previousMapStyle = mapStyle;
        switch (previousMapStyle) {
            case STANDARD_DAY:
                mapStyle = NeshanMapStyle.STANDARD_NIGHT;
                break;
            case STANDARD_NIGHT:
                mapStyle = NeshanMapStyle.NESHAN;
                break;
            case NESHAN:
                mapStyle = NeshanMapStyle.STANDARD_DAY;
                break;
        }
        runOnUiThread(new Runnable() {
            @Override
            public void run() {
                validateThemePreview();
            }
        });
        map.getLayers().remove(map.getLayers().get(BASE_MAP_INDEX));
        map.getLayers().insert(BASE_MAP_INDEX, NeshanServices.createBaseMap(mapStyle));
        if (isPOIEnable) {
            map.getLayers().remove(map.getLayers().get(POI_INDEX));
            map.getLayers().insert(POI_INDEX, NeshanServices.createPOILayer(mapStyle == NeshanMapStyle.STANDARD_NIGHT));
        }
    }

صفحه قبل (لایه آنلاین)

صفحه بعد (لایه پایگاه داده)