[android] - #2658 improve window background PopupWindowView

7 files changed, 79 insertions, 42 deletions

diff --git a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindow.java b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindow.java
index 799d01d5c0..0f9668be8f 100644
--- a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindow.java
+++ b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindow.java
@@ -92,45 +92,52 @@ final class InfoWindow {
         float y = coords.y - mView.getMeasuredHeight() + offsetY;
 
         // get right/left popup window
-        float right = x + mView.getMeasuredWidth();
-        float left = x;
+        float rightSideInfowWindow = x + mView.getMeasuredWidth();
+        float leftSideInfoWindow = x;
 
         // get right/left map view
-        float mapRight = mMapView.get().getRight();
-        float mapLeft = mMapView.get().getLeft();
+        final float mapRight = mMapView.get().getRight();
+        final float mapLeft = mMapView.get().getLeft();
 
         if (mView instanceof InfoWindowView) {
             // only apply repositioning/margin for InfoWindowView
             Resources resources = mMapView.get().getContext().getResources();
-            float margin = resources.getDimension(R.dimen.infowindow_margin);
+            float marginHorizontal = resources.getDimension(R.dimen.infowindow_margin);
             float tipViewOffset = resources.getDimension(R.dimen.infowindow_tipview_width) / 2;
             float tipViewMarginLeft = mView.getMeasuredWidth() / 2 - tipViewOffset;
 
-            // fit screen on right
-            if (right > mMapView.get().getRight()) {
-                x -= right - mapRight;
-                tipViewMarginLeft += right - mapRight + tipViewOffset;
-                right = x + mView.getMeasuredWidth();
+            boolean outOfBoundsLeft = false;
+            boolean outOfBoundsRight = false;
+
+            // if out of bounds right
+            if (rightSideInfowWindow > mapRight) {
+                outOfBoundsRight = true;
+                x -= rightSideInfowWindow - mapRight;
+                tipViewMarginLeft += rightSideInfowWindow - mapRight + tipViewOffset;
+                rightSideInfowWindow = x + mView.getMeasuredWidth();
             }
 
             // fit screen left
-            if (left < mMapView.get().getLeft()) {
-                x += mapLeft - left;
-                tipViewMarginLeft -= mapLeft - left + tipViewOffset;
-                left = x;
+            if (leftSideInfoWindow < mapLeft) {
+                outOfBoundsLeft = true;
+                x += mapLeft - leftSideInfoWindow;
+                tipViewMarginLeft -= mapLeft - leftSideInfoWindow + tipViewOffset;
+                leftSideInfoWindow = x;
             }
 
             // Add margin right
-            if (mapRight - right < margin) {
-                x -= margin - (mapRight - right);
-                tipViewMarginLeft += margin - (mapRight - right) - tipViewOffset;
-                left = x;
+            if (outOfBoundsRight && mapRight - rightSideInfowWindow < marginHorizontal) {
+                x -= marginHorizontal - (mapRight - rightSideInfowWindow);
+                tipViewMarginLeft += marginHorizontal - (mapRight - rightSideInfowWindow) - tipViewOffset;
+
+                leftSideInfoWindow = x;
             }
 
             // Add margin left
-            if (left - mapLeft < margin) {
-                x += margin - (left - mapLeft);
-                tipViewMarginLeft -= (margin - (left - mapLeft)) - tipViewOffset;
+            if (outOfBoundsLeft && leftSideInfoWindow - mapLeft < marginHorizontal) {
+                x += marginHorizontal - (leftSideInfoWindow - mapLeft);
+                tipViewMarginLeft -= (marginHorizontal - (leftSideInfoWindow - mapLeft)) - tipViewOffset;
+
             }
 
             // Adjust tipView
diff --git a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowTipView.java b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowTipView.java
index 106e11820a..d2afafc59d 100644
--- a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowTipView.java
+++ b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowTipView.java
@@ -8,33 +8,55 @@ import android.graphics.Path;
 import android.util.AttributeSet;
 import android.view.View;
 
+import com.mapbox.mapboxsdk.R;
+
 final class InfoWindowTipView extends View {
 
     private Paint mPaint;
     private Path mPath;
+    private int mLineWidth;
 
     public InfoWindowTipView(Context context, AttributeSet attrs) {
         super(context, attrs);
 
         mPath = new Path();
-
-        this.mPaint = new Paint();
-        this.mPaint.setColor(Color.WHITE);
-        this.mPaint.setAntiAlias(true);
-        this.mPaint.setStrokeWidth(0.0f);
-        this.mPaint.setStyle(Paint.Style.FILL);
+        mLineWidth = (int) context.getResources().getDimension(R.dimen.infowindow_line_width);
+        mPaint = new Paint();
+        mPaint.setColor(Color.WHITE);
+        mPaint.setAntiAlias(true);
+        mPaint.setStrokeWidth(0.0f);
+        mPaint.setStyle(Paint.Style.FILL);
     }
 
     @Override
     protected void onDraw(Canvas canvas) {
+        super.onDraw(canvas);
         int height = getMeasuredHeight();
         int width = getMeasuredWidth();
 
         mPath.rewind();
-        mPath.moveTo((width / 2) - height, 0);
-        mPath.lineTo((width / 2) + height, 0);
+
+        this.mPaint.setColor(Color.WHITE);
+        this.mPaint.setAntiAlias(true);
+        this.mPaint.setStrokeWidth(0.0f);
+        this.mPaint.setStyle(Paint.Style.FILL);
+
+        mPath.moveTo(0, 0);
+        mPath.lineTo(width, 0);
         mPath.lineTo((width / 2), height);
-        mPath.lineTo((width / 2) - height, 0);
+        mPath.lineTo(0, 0);
+        canvas.drawPath(mPath, this.mPaint);
+
+        mPath.rewind();
+
+        this.mPaint.setColor(Color.parseColor("#C2C2C2"));
+        this.mPaint.setAntiAlias(true);
+        this.mPaint.setStrokeWidth(mLineWidth);
+        this.mPaint.setStyle(Paint.Style.STROKE);
+
+        mPath.moveTo(0, 0);
+        mPath.lineTo(width / 2, height);
+        mPath.lineTo(width, 0);
         canvas.drawPath(mPath, this.mPaint);
     }
 }
diff --git a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowView.java b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowView.java
index 9b0a339252..80dc5931a7 100644
--- a/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowView.java
+++ b/android/MapboxGLAndroidSDK/src/main/java/com/mapbox/mapboxsdk/annotations/InfoWindowView.java
@@ -32,8 +32,7 @@ class InfoWindowView extends RelativeLayout {
     void setTipViewMarginLeft(int marginLeft) {
         RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) mTipView.getLayoutParams();
         layoutParams.leftMargin = marginLeft;
-        // This is a bit of a hack but prevents an occasional 1 pixel gap between the InfoWindow and
-        // the tip
-        layoutParams.topMargin = -1;
+        // This is a bit of a hack but prevents an occasional gap between the InfoWindow
+        layoutParams.topMargin = (int) getResources().getDimension(R.dimen.infowindow_offset);
     }
 }
diff --git a/android/MapboxGLAndroidSDK/src/main/res/drawable-xxxhdpi/bg_infowindow_content.9.png b/android/MapboxGLAndroidSDK/src/main/res/drawable-xxxhdpi/bg_infowindow_content.9.png
new file mode 100644
index 0000000000..584b320299
--- /dev/null
+++ b/android/MapboxGLAndroidSDK/src/main/res/drawable-xxxhdpi/bg_infowindow_content.9.png
diff --git a/android/MapboxGLAndroidSDK/src/main/res/layout/infowindow_content.xml b/android/MapboxGLAndroidSDK/src/main/res/layout/infowindow_content.xml
index 496766ea77..3e36cbf91a 100644
--- a/android/MapboxGLAndroidSDK/src/main/res/layout/infowindow_content.xml
+++ b/android/MapboxGLAndroidSDK/src/main/res/layout/infowindow_content.xml
@@ -5,28 +5,34 @@
         android:id="@+id/infowindow_content"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:background="@color/white"
+        android:background="@drawable/bg_infowindow_content"
         android:orientation="vertical"
-        android:padding="5dp">
+        android:paddingBottom="16dp"
+        android:paddingLeft="20dp"
+        android:paddingRight="20dp"
+        android:paddingTop="14dp">
 
         <TextView
             android:id="@+id/infowindow_title"
             android:layout_width="wrap_content"
-            android:layout_height="0dp"
-            android:layout_gravity="left"
-            android:layout_weight="1"
+            android:layout_height="wrap_content"
+            android:layout_marginBottom="2dp"
             android:maxEms="17"
             android:text="@string/infoWindowTitle"
             android:textColor="@color/black"
-            android:textSize="18sp" />
+            android:textSize="18sp"
+            android:textStyle="bold" />
 
         <TextView
             android:id="@+id/infowindow_description"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            android:layout_marginBottom="2dp"
+            android:layout_marginTop="2dp"
+            android:lineSpacingExtra="1dp"
             android:maxEms="17"
             android:text="@string/infoWindowDescription"
-            android:textColor="@color/black"
+            android:textColor="@color/gray"
             android:textSize="14sp" />
 
         <TextView
@@ -43,7 +49,7 @@
     <com.mapbox.mapboxsdk.annotations.InfoWindowTipView
         android:id="@+id/infowindow_tipview"
         android:layout_width="@dimen/infowindow_tipview_width"
-        android:layout_height="8dp"
+        android:layout_height="14dp"
         android:layout_below="@+id/infowindow_content" />
 
 </merge>
diff --git a/android/MapboxGLAndroidSDK/src/main/res/values/colors.xml b/android/MapboxGLAndroidSDK/src/main/res/values/colors.xml
index 55cf3fb1b6..b87580661d 100644
--- a/android/MapboxGLAndroidSDK/src/main/res/values/colors.xml
+++ b/android/MapboxGLAndroidSDK/src/main/res/values/colors.xml
@@ -2,6 +2,7 @@
 <resources>
     <color name="white">#FFFFFF</color>
     <color name="black">#000000</color>
+    <color name="gray">#7D7F80</color>
     <color name="mapbox_blue">#1E8CAB</color>
     <color name="my_location_ring">@color/mapbox_blue</color>
 </resources>
diff --git a/android/MapboxGLAndroidSDK/src/main/res/values/dimens.xml b/android/MapboxGLAndroidSDK/src/main/res/values/dimens.xml
index 0881220060..dc09cc1114 100644
--- a/android/MapboxGLAndroidSDK/src/main/res/values/dimens.xml
+++ b/android/MapboxGLAndroidSDK/src/main/res/values/dimens.xml
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <dimen name="infowindow_tipview_width">16dp</dimen>
+    <dimen name="infowindow_tipview_width">20dp</dimen>
     <dimen name="infowindow_margin">8dp</dimen>
+    <dimen name="infowindow_offset">-2dp</dimen>
+    <dimen name="infowindow_line_width">1.5dp</dimen>
 </resources>
\ No newline at end of file