diff --git a/apps/app/ui-tests-app/button/button-border.css b/apps/app/ui-tests-app/button/button-border.css
index 644d827a6..3b404e027 100644
--- a/apps/app/ui-tests-app/button/button-border.css
+++ b/apps/app/ui-tests-app/button/button-border.css
@@ -46,7 +46,7 @@ Button {
 }
 
 #s10 {
-    border-width: 5 0; border-color: black;
+    border-width: 5 0; border-color: black; background-color: white;
 }
 
 #s11 {
diff --git a/apps/app/ui-tests-app/css/pixels.xml b/apps/app/ui-tests-app/css/pixels.xml
index b2b61157d..30f25d526 100644
--- a/apps/app/ui-tests-app/css/pixels.xml
+++ b/apps/app/ui-tests-app/css/pixels.xml
@@ -4,7 +4,7 @@
     <Label text="pixels" />
     <StackLayout borderWidth="1px" borderColor="black" horizontalAlignment="left" verticalAlignment="top" orientation="horizontal" padding="1px">
       <Label     text="Label"      borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" />
-      <Button    text="Button"     borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" />
+      <Button    text="Button"     borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" backgroundColor="orange" />
       <TextView  text="Text View"  borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" />
       <TextField text="Text Field" borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" />
       <Image src="~/ui-tests-app/resources/images/gravatar.png" borderWidth="1px" borderRadius="10px" borderColor="green" padding="1px" margin="1px" />
@@ -12,7 +12,7 @@
 
      <StackLayout borderWidth="2px" borderColor="green" orientation="horizontal" padding="2px">
       <Label     text="Label"      borderWidth="5px" borderRadius="10px" borderColor="black" padding="5px" margin="5px" />
-      <Button    text="Button"     borderWidth="4px" borderRadius="10px" borderColor="black" padding="4px" margin="4px" />
+      <Button    text="Button"     borderWidth="4px" borderRadius="10px" borderColor="black" padding="4px" margin="4px" backgroundColor="orange" />
       <TextView  text="Text View"  borderWidth="3px" borderRadius="10px" borderColor="black" padding="3px" margin="3px" />
       <TextField text="Text Field" borderWidth="2px" borderRadius="10px" borderColor="black" padding="2px" margin="2px" />
     </StackLayout>
@@ -32,7 +32,7 @@
     <Label text="device independent pixels" />
     <StackLayout borderWidth="1" borderColor="black" horizontalAlignment="left" verticalAlignment="top" orientation="horizontal" padding="1">
       <Label     text="Label"      borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" />
-      <Button    text="Button"     borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" />
+      <Button    text="Button"     borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" backgroundColor="orange" />
       <TextView  text="Text View"  borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" />
       <TextField text="Text Field" borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" />
       <Image src="~/ui-tests-app/resources/images/gravatar.png" borderWidth="1" borderRadius="10" borderColor="green" padding="1" margin="1" />
@@ -40,7 +40,7 @@
 
      <StackLayout borderWidth="2" borderColor="green" orientation="horizontal" padding="2">
       <Label     text="Label"      borderWidth="5" borderRadius="10" borderColor="black" padding="5" margin="5" />
-      <Button    text="Button"     borderWidth="4" borderRadius="10" borderColor="black" padding="4" margin="4" />
+      <Button    text="Button"     borderWidth="4" borderRadius="10" borderColor="black" padding="4" margin="4" backgroundColor="orange" />
       <TextView  text="Text View"  borderWidth="3" borderRadius="10" borderColor="black" padding="3" margin="3" />
       <TextField text="Text Field" borderWidth="2" borderRadius="10" borderColor="black" padding="2" margin="2" />
     </StackLayout>
diff --git a/apps/app/ui-tests-app/flexbox/flexbox.css b/apps/app/ui-tests-app/flexbox/flexbox.css
index 65d8ae62b..9f2bc32fc 100644
--- a/apps/app/ui-tests-app/flexbox/flexbox.css
+++ b/apps/app/ui-tests-app/flexbox/flexbox.css
@@ -22,6 +22,7 @@
 .control Button {
     border-width: 1 1 0 0;
     border-color: gray;
+    background-color: white;
     font-size: 9;
     padding: 0;
     height: 0;
diff --git a/apps/app/ui-tests-app/issues/issue-3113.css b/apps/app/ui-tests-app/issues/issue-3113.css
index dec0844d3..3a3cab238 100644
--- a/apps/app/ui-tests-app/issues/issue-3113.css
+++ b/apps/app/ui-tests-app/issues/issue-3113.css
@@ -1,13 +1,16 @@
 #button1 {
-    border-color: rgba(0, 0, 0, 0);
+    border-color: transparent;
     border-width: 3;
+    background-color: white;
 }
 
 #button2 {
     border-color: rgba(0, 0, 0, 0.5);
     border-width: 3;
+    background-color: white;
 }
 
 #button3 {
     border-width: 3;
+    background-color: white;
 }
\ No newline at end of file
diff --git a/tns-core-modules-widgets/android/widgets/src/main/java/org/nativescript/widgets/BorderDrawable.java b/tns-core-modules-widgets/android/widgets/src/main/java/org/nativescript/widgets/BorderDrawable.java
index 3608a195d..247caa6a6 100644
--- a/tns-core-modules-widgets/android/widgets/src/main/java/org/nativescript/widgets/BorderDrawable.java
+++ b/tns-core-modules-widgets/android/widgets/src/main/java/org/nativescript/widgets/BorderDrawable.java
@@ -8,6 +8,7 @@ import android.graphics.Canvas;
 import android.graphics.Color;
 import android.graphics.LinearGradient;
 import android.graphics.Matrix;
+import android.graphics.Outline;
 import android.graphics.Paint;
 import android.graphics.Path;
 import android.graphics.PointF;
@@ -16,6 +17,7 @@ import android.graphics.RectF;
 import android.graphics.drawable.ColorDrawable;
 import android.graphics.drawable.Drawable;
 import android.graphics.Shader;
+import android.support.annotation.NonNull;
 
 import org.nativescript.widgets.image.BitmapOwner;
 import org.nativescript.widgets.image.Fetcher;
@@ -804,6 +806,23 @@ public class BorderDrawable extends ColorDrawable implements BitmapOwner {
         return drawable;
     }
 
+    @Override
+    public void getOutline(@NonNull Outline outline) {
+        if (android.os.Build.VERSION.SDK_INT >= 21) {
+            Path backgroundPath = new Path();
+            float[] backgroundRadii = {
+                Math.max(0, borderTopLeftRadius), Math.max(0, borderTopLeftRadius),
+                Math.max(0, borderTopRightRadius), Math.max(0, borderTopRightRadius),
+                Math.max(0, borderBottomRightRadius), Math.max(0, borderBottomRightRadius),
+                Math.max(0, borderBottomLeftRadius), Math.max(0, borderBottomLeftRadius)
+            };
+            backgroundPath.addRoundRect(new RectF(getBounds()), backgroundRadii, Path.Direction.CW);
+            outline.setConvexPath(backgroundPath);
+        } else {
+            throw new IllegalStateException("Method supported on API 21 or higher");
+        }
+    }
+
     private class BackgroundDrawParams {
         private boolean repeatX = true;
         private boolean repeatY = true;