Land use example example

MapboxAndroidDemo/build.gradle

@@ -46,6 +46,7 @@ dependencies {
     compile "com.android.support:cardview-v7:${supportLibVersion}"
     compile "com.android.support:recyclerview-v7:${supportLibVersion}"
     compile 'com.github.javiersantos:MaterialStyledDialogs:1.5.1'
+    compile 'com.getbase:floatingactionbutton:1.10.1'
     compile 'com.squareup.picasso:picasso:2.5.2'
     compile('com.mapbox.mapboxsdk:mapbox-android-sdk:4.2.0-beta.1@aar'){
         transitive=true

MapboxAndroidDemo/src/main/AndroidManifest.xml

@@ -314,5 +314,13 @@
                 android:name="android.support.PARENT_ACTIVITY"
                 android:value=".MainActivity" />
         </activity>
+
+        <activity
+            android:name=".labs.LandUseStylingActivity"
+            android:label="@string/activity_lab_land_use_stying_title">
+            <meta-data
+                android:name="android.support.PARENT_ACTIVITY"
+                android:value=".MainActivity" />
+        </activity>
     </application>
 </manifest>

MapboxAndroidDemo/src/main/java/com/mapbox/mapboxandroiddemo/MainActivity.java

@@ -53,6 +53,7 @@
 import com.mapbox.mapboxandroiddemo.examples.styles.ShowHideLayersActivity;
 import com.mapbox.mapboxandroiddemo.examples.styles.VectorSourceActivity;
 import com.mapbox.mapboxandroiddemo.examples.styles.ZoomDependentFillColorActivity;
+import com.mapbox.mapboxandroiddemo.labs.LandUseStylingActivity;
 import com.mapbox.mapboxandroiddemo.labs.LocationPickerActivity;
 import com.mapbox.mapboxandroiddemo.labs.MarkerFollowingRouteActivity;
 import com.mapbox.mapboxandroiddemo.labs.SpaceStationLocationActivity;
@@ -218,6 +219,7 @@ private void listItems(int id) {
                 break;
             case R.id.nav_lab:
                 exampleItemModel.add(null);
+                exampleItemModel.add(new ExampleItemModel(R.string.activity_lab_land_use_stying_title, R.string.activity_lab_land_use_stying_description, new Intent(MainActivity.this, LandUseStylingActivity.class), R.string.activity_lab_land_use_stying_url, true));
                 exampleItemModel.add(new ExampleItemModel(R.string.activity_lab_location_picker_title, R.string.activity_lab_location_picker_description, new Intent(MainActivity.this, LocationPickerActivity.class), R.string.activity_lab_location_picker_url));
                 exampleItemModel.add(new ExampleItemModel(R.string.activity_lab_marker_following_route_title, R.string.activity_lab_marker_following_route_description, new Intent(MainActivity.this, MarkerFollowingRouteActivity.class), R.string.activity_lab_marker_following_route_url, true));
                 exampleItemModel.add(new ExampleItemModel(R.string.activity_lab_space_station_location_title, R.string.activity_lab_space_station_location_description, new Intent(MainActivity.this, SpaceStationLocationActivity.class), R.string.activity_lab_space_station_location_url));

MapboxAndroidDemo/src/main/java/com/mapbox/mapboxandroiddemo/labs/LandUseStylingActivity.java

@@ -0,0 +1,161 @@
+package com.mapbox.mapboxandroiddemo.labs;
+
+import android.graphics.Color;
+import android.os.Bundle;
+import android.support.v4.content.ContextCompat;
+import android.support.v7.app.AppCompatActivity;
+import android.util.Log;
+import android.view.View;
+
+import com.getbase.floatingactionbutton.FloatingActionButton;
+import com.mapbox.mapboxandroiddemo.R;
+import com.mapbox.mapboxsdk.maps.MapView;
+import com.mapbox.mapboxsdk.maps.MapboxMap;
+import com.mapbox.mapboxsdk.maps.OnMapReadyCallback;
+import com.mapbox.mapboxsdk.style.layers.FillLayer;
+
+import static com.mapbox.mapboxsdk.style.layers.Filter.eq;
+import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.fillColor;
+
+public class LandUseStylingActivity extends AppCompatActivity {
+    private static final String TAG = LandUseStylingActivity.class.getSimpleName();
+
+    private MapView mapView;
+
+    @Override
+    protected void onCreate(Bundle savedInstanceState) {
+        super.onCreate(savedInstanceState);
+        setContentView(R.layout.activity_lab_land_use_styling);
+
+        mapView = (MapView) findViewById(R.id.mapView);
+        mapView.onCreate(savedInstanceState);
+        mapView.getMapAsync(new OnMapReadyCallback() {
+            @Override
+            public void onMapReady(final MapboxMap mapboxMap) {
+
+                FillLayer schoolLayer = new FillLayer("school-layer", "composite");
+                schoolLayer.setSourceLayer("landuse");
+                schoolLayer.setProperties(
+                        fillColor(Color.parseColor("#f6f6f4"))
+                );
+                schoolLayer.setFilter(eq("class", "school"));
+                mapboxMap.addLayer(schoolLayer);
+
+                FillLayer hospitalLayer = new FillLayer("hospital-layer", "composite");
+                hospitalLayer.setSourceLayer("landuse");
+                hospitalLayer.setProperties(
+                        fillColor(Color.parseColor("#eceeed"))
+                );
+                hospitalLayer.setFilter(eq("class", "hospital"));
+                mapboxMap.addLayer(hospitalLayer);
+
+                FloatingActionButton toggleParks = (FloatingActionButton) findViewById(R.id.fab_toggle_parks);
+                toggleParks.setOnClickListener(new View.OnClickListener() {
+                    @Override
+                    public void onClick(View v) {
+                        FillLayer parks = mapboxMap.getLayerAs("parks");
+                        if (parks != null) {
+
+                            if (!colorsEqual(parks.getFillColorAsInt(), ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxGreen))) {
+                                parks.setProperties(
+                                        fillColor(ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxGreen))
+                                );
+                            } else {
+                                parks.setProperties(
+                                        fillColor(Color.parseColor("#eceeed"))
+                                );
+                            }
+                        }
+                    }
+                });
+
+                FloatingActionButton toggleSchools = (FloatingActionButton) findViewById(R.id.fab_toggle_schools);
+                toggleSchools.setOnClickListener(new View.OnClickListener() {
+                    @Override
+                    public void onClick(View v) {
+                        FillLayer schools = mapboxMap.getLayerAs("school-layer");
+                        if (schools != null) {
+                            if (schools.getFillColor().isValue() &&
+                                    !colorsEqual(schools.getFillColorAsInt(), ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxYellow))) {
+                                schools.setProperties(
+                                        fillColor(ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxYellow))
+                                );
+                            } else {
+                                schools.setProperties(
+                                        fillColor(Color.parseColor("#f6f6f4"))
+                                );
+                            }
+                        }
+                    }
+                });
+
+                FloatingActionButton toggleHospital = (FloatingActionButton) findViewById(R.id.fab_toggle_hospital);
+                toggleHospital.setOnClickListener(new View.OnClickListener() {
+                    @Override
+                    public void onClick(View v) {
+                        FillLayer hospital = mapboxMap.getLayerAs("hospital-layer");
+                        if (hospital != null) {
+                            if (hospital.getFillColor().isValue() &&
+                                    !colorsEqual(hospital.getFillColorAsInt(), ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxPurple))) {
+                                hospital.setProperties(
+                                        fillColor(ContextCompat.getColor(LandUseStylingActivity.this, R.color.mapboxPurple))
+                                );
+                            } else {
+                                hospital.setProperties(
+                                        fillColor(Color.parseColor("#eceeed"))
+                                );
+                            }
+                        }
+                    }
+                });
+
+            }
+        });
+    }
+
+    @Override
+    public void onResume() {
+        super.onResume();
+        mapView.onResume();
+    }
+
+    @Override
+    public void onPause() {
+        super.onPause();
+        mapView.onPause();
+    }
+
+    @Override
+    public void onLowMemory() {
+        super.onLowMemory();
+        mapView.onLowMemory();
+    }
+
+    @Override
+    protected void onDestroy() {
+        super.onDestroy();
+        mapView.onDestroy();
+    }
+
+    @Override
+    protected void onSaveInstanceState(Bundle outState) {
+        super.onSaveInstanceState(outState);
+        mapView.onSaveInstanceState(outState);
+    }
+
+    private boolean colorsEqual(int a, int b) {
+        boolean equal = Math.abs(Color.red(a) - Color.red(b)) <= 10 &&
+                Math.abs(Color.green(a) - Color.green(b)) <= 10 &&
+                Math.abs(Color.blue(a) - Color.blue(b)) <= 10;
+
+        Log.i(TAG, String.format("Comparing colors: %s, %s (%s, %s ,%s => %s)",
+                a,
+                b,
+                Math.abs(Color.red(a) - Color.red(b)),
+                Math.abs(Color.green(a) - Color.green(b)),
+                Math.abs(Color.blue(a) - Color.blue(b)),
+                equal)
+        );
+        return equal;
+    }
+}

MapboxAndroidDemo/src/main/java/com/mapbox/mapboxandroiddemo/labs/SpaceStationLocationActivity.java

@@ -51,7 +51,7 @@ public class SpaceStationLocationActivity extends AppCompatActivity {
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
-        setContentView(R.layout.activity_space_station_location);
+        setContentView(R.layout.activity_lab_space_station_location);
 
         // Initialize the map view
         mapView = (MapView) findViewById(R.id.mapView);

MapboxAndroidDemo/src/main/res/drawable/fab_label_background.xml

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="@color/black_semi_transparent"/>
+    <padding
+        android:left="16dp"
+        android:top="4dp"
+        android:right="16dp"
+        android:bottom="4dp"/>
+    <corners
+        android:radius="2dp"/>
+</shape>

MapboxAndroidDemo/src/main/res/layout/activity_lab_land_use_styling.xml

@@ -0,0 +1,59 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.design.widget.CoordinatorLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:fab="http://schemas.android.com/apk/res-auto"
+    xmlns:mapbox="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    tools:context=".labs.LandUseStylingActivity">
+
+    <com.mapbox.mapboxsdk.maps.MapView
+        android:id="@+id/mapView"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        mapbox:center_latitude="51.7525"
+        mapbox:center_longitude="-1.2606"
+        mapbox:style_url="@string/style_light"
+        mapbox:zoom="11"/>
+
+    <com.getbase.floatingactionbutton.FloatingActionsMenu
+        android:id="@+id/multiple_actions"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="end|bottom"
+        android:layout_margin="16dp"
+        fab:fab_addButtonColorNormal="@color/mapboxRed"
+        fab:fab_addButtonColorPressed="@color/mapboxWhite"
+        fab:fab_addButtonPlusIconColor="@color/mapboxWhite"
+        fab:fab_labelStyle="@style/menu_labels_style">
+
+        <com.getbase.floatingactionbutton.FloatingActionButton
+            android:id="@+id/fab_toggle_schools"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            fab:fab_colorNormal="@color/mapboxRed"
+            fab:fab_colorPressed="@color/mapboxWhite"
+            fab:fab_size="mini"
+            fab:fab_title="Schools"/>
+
+        <com.getbase.floatingactionbutton.FloatingActionButton
+            android:id="@+id/fab_toggle_parks"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            fab:fab_colorNormal="@color/mapboxRed"
+            fab:fab_colorPressed="@color/mapboxWhite"
+            fab:fab_size="mini"
+            fab:fab_title="Parks"/>
+
+        <com.getbase.floatingactionbutton.FloatingActionButton
+            android:id="@+id/fab_toggle_hospital"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            fab:fab_colorNormal="@color/mapboxRed"
+            fab:fab_colorPressed="@color/mapboxWhite"
+            fab:fab_size="mini"
+            fab:fab_title="Hospitals"/>
+
+    </com.getbase.floatingactionbutton.FloatingActionsMenu>
+</android.support.design.widget.CoordinatorLayout>

MapboxAndroidDemo/src/main/res/values/colors.xml

@@ -1,9 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
+    <!-- Mapbox colors -->
     <color name="colorPrimary">@color/mapboxBlue</color>
     <color name="colorPrimaryDark">@color/mapboxBlueDark</color>
     <color name="colorAccent">@color/mapboxRed</color>
-    
+
     <color name="materialGrey">#F5F5F5</color>
     <color name="materialDarkGrey">#DFDFDF</color>
 
@@ -15,14 +16,19 @@
     <color name="mapboxPurple">#8A8ACB</color>
     <color name="mapboxPurpleDark">#7171b2</color>
     <color name="mapboxPurpleLight">#A4A4E5</color>
-    
+
     <color name="mapboxDenim">#50667F</color>
     <color name="mapboxTeal">#41AFA5</color>
     <color name="mapboxOrange">#F9886C</color>
     <color name="mapboxRed">#E55E5E</color>
     <color name="mapboxPink">#ED6498</color>
+    <color name="mapboxYellow">#f1f075</color>
     <color name="mapboxMustard">#FBB03B</color>
     <color name="mapboxNavy">#28353D</color>
     <color name="mapboxNavyDark">#222B30</color>
 
+    <!-- FAB menu colors -->
+    <color name="black_semi_transparent">#B2000000</color>
+    <color name="half_black">#808080</color>
+    <color name="white_pressed">#f1f1f1</color>
 </resources>

MapboxAndroidDemo/src/main/res/values/strings.xml

@@ -74,6 +74,7 @@
     <string name="activity_lab_location_picker_title">Location picker</string>
     <string name="activity_lab_marker_following_route_title">Marker following route</string>
     <string name="activity_lab_space_station_location_title">Space station current location</string>
+    <string name="activity_lab_land_use_stying_title">Land use styling</string>
 
     <!-- example descriptions-->
     <string name="activity_basic_simple_mapview_description">Show a map in your app using the Mapbox Android SDK.</string>
@@ -112,6 +113,7 @@
     <string name="activity_lab_location_picker_description">Drop a marker at a specific location and then perform reverse geocoding.</string>
     <string name="activity_lab_marker_following_route_description">Using a map matched GeoJSON route, the marker travels along the route at consistent speed.</string>
     <string name="activity_lab_space_station_location_description">See the International Space Station location in real time.</string>
+    <string name="activity_lab_land_use_stying_description">Use the style api to allow toggleable highlighting of parks, hospitals, and schools.</string>
 
     <!-- example urls-->
     <string name="empty_image"> </string>
@@ -152,5 +154,6 @@
     <string name="activity_lab_location_picker_url">http://i.imgur.com/0JTVwaa.png</string>
     <string name="activity_lab_marker_following_route_url">http://i.imgur.com/spsZu9X.png</string>
     <string name="activity_lab_space_station_location_url">http://i.imgur.com/PxuB1T8.png</string>
+    <string name="activity_lab_land_use_stying_url">http://i.imgur.com/x1i4qEw.png</string>
 
 </resources>

MapboxAndroidDemo/src/main/res/values/styles.xml

@@ -17,4 +17,9 @@
 
     <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
 
+    <style name="menu_labels_style">
+        <item name="android:background">@drawable/fab_label_background</item>
+        <item name="android:textColor">@color/white</item>
+    </style>
+
 </resources>