diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 8fe407600..59019d963 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -151,6 +151,9 @@
+
+
+
time-picker-tests-native.d.ts
diff --git a/apps/tests/ui/border/border-tests-native.android.ts b/apps/tests/ui/border/border-tests-native.android.ts
new file mode 100644
index 000000000..6500c4b74
--- /dev/null
+++ b/apps/tests/ui/border/border-tests-native.android.ts
@@ -0,0 +1,34 @@
+import borderModule = require("ui/border");
+import utils = require("utils/utils");
+
+var density = utils.layout.getDisplayDensity();
+
+export function getNativeBorderWidth(border: borderModule.Border): number {
+ var bkg = (border.android).getBackground();
+
+ return bkg && bkg.getStroke ? bkg.getStroke() / density : -1;
+}
+
+export function getNativeCornerRadius(border: borderModule.Border): number {
+ var bkg = (border.android).getBackground();
+
+ return bkg && bkg.getCornerRadius ? bkg.getCornerRadius() / density : -1;
+}
+
+export function checkNativeBorderColor(border: borderModule.Border): boolean {
+ var bkg = (border.android).getBackground();
+
+ return border.borderColor && bkg && bkg.getBorderColor && bkg.getBorderColor() === border.borderColor.android;
+}
+
+export function checkNativeBackgroundColor(border: borderModule.Border): boolean {
+ var bkg = (border.android).getBackground();
+
+ return border.backgroundColor && bkg && bkg.getBackgroundColor && bkg.getBackgroundColor() === border.backgroundColor.android;
+}
+
+export function checkNativeBackgroundImage(border: borderModule.Border): boolean {
+ var bkg = (border.android).getBackground();
+
+ return bkg && bkg.getBitmap && bkg.getBitmap() !== undefined;
+}
\ No newline at end of file
diff --git a/apps/tests/ui/border/border-tests-native.d.ts b/apps/tests/ui/border/border-tests-native.d.ts
new file mode 100644
index 000000000..867230193
--- /dev/null
+++ b/apps/tests/ui/border/border-tests-native.d.ts
@@ -0,0 +1,12 @@
+//@private
+import borderModule = require("ui/border");
+
+export declare function getNativeBorderWidth(border: borderModule.Border): number;
+
+export declare function getNativeCornerRadius(border: borderModule.Border): number;
+
+export declare function checkNativeBorderColor(border: borderModule.Border): boolean
+
+export declare function checkNativeBackgroundColor(border: borderModule.Border): boolean;
+
+export declare function checkNativeBackgroundImage(border: borderModule.Border): boolean
\ No newline at end of file
diff --git a/apps/tests/ui/border/border-tests-native.ios.ts b/apps/tests/ui/border/border-tests-native.ios.ts
new file mode 100644
index 000000000..ecd54ae0c
--- /dev/null
+++ b/apps/tests/ui/border/border-tests-native.ios.ts
@@ -0,0 +1,21 @@
+import borderModule = require("ui/border");
+
+export function getNativeBorderWidth(border: borderModule.Border): number {
+ return (border.ios).layer.borderWidth;
+}
+
+export function getNativeCornerRadius(border: borderModule.Border): number {
+ return (border.ios).layer.cornerRadius;
+}
+
+export function checkNativeBorderColor(border: borderModule.Border): boolean {
+ return border.borderColor && (border.ios).layer.borderColor === border.borderColor.ios.CGColor;
+}
+
+export function checkNativeBackgroundColor(border: borderModule.Border): boolean {
+ return border.backgroundColor && (border.ios).backgroundColor.isEqual(border.backgroundColor.ios);
+}
+
+export function checkNativeBackgroundImage(border: borderModule.Border): boolean {
+ return (border.ios).backgroundColor !== undefined;
+}
\ No newline at end of file
diff --git a/apps/tests/ui/border/border-tests.ts b/apps/tests/ui/border/border-tests.ts
index 9aeb0fc9f..1302ac755 100644
--- a/apps/tests/ui/border/border-tests.ts
+++ b/apps/tests/ui/border/border-tests.ts
@@ -1,5 +1,10 @@
import buttonModule = require("ui/button");
import colorModule = require("color");
+import TKUnit = require("../../TKUnit");
+import helper = require("../helper");
+import viewModule = require("ui/core/view");
+import borderTestsNative = require("./border-tests-native");
+import pageModule = require("ui/page");
//
// # Border
@@ -18,7 +23,7 @@ import borderModule = require("ui/border");
//```
//
-export function test_DummyTestForCodeSnippet() {
+function _createBorder(): borderModule.Border {
//
// ### Creating a Border programmatically
// ``` JavaScript
@@ -27,10 +32,56 @@ export function test_DummyTestForCodeSnippet() {
var border = new borderModule.Border();
border.cornerRadius = 10;
- border.borderWidth = 1;
+ border.borderWidth = 2;
border.borderColor = new colorModule.Color("#FF0000");
+ border.backgroundColor = new colorModule.Color("#FFFF00");
border.content = button;
// ```
//
+
+ return border;
+}
+
+export var testBorderWidth = function () {
+ helper.buildUIAndRunTest(_createBorder(), function (views: Array) {
+ var border = views[0];
+ var expectedValue = border.borderWidth;
+ var actualValue = borderTestsNative.getNativeBorderWidth(border);
+ TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+ });
+}
+
+export var testCornerRadius = function () {
+ helper.buildUIAndRunTest(_createBorder(), function (views: Array) {
+ var border = views[0];
+ var expectedValue = border.cornerRadius;
+ var actualValue = borderTestsNative.getNativeCornerRadius(border);
+ TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+ });
+}
+
+export var testBorderColor = function () {
+ helper.buildUIAndRunTest(_createBorder(), function (views: Array) {
+ var border = views[0];
+ TKUnit.assert(borderTestsNative.checkNativeBorderColor(border), "BorderColor not applied correctly!");
+ });
+}
+
+export var testBackgroundColor = function () {
+ helper.buildUIAndRunTest(_createBorder(), function (views: Array) {
+ var border = views[0];
+ TKUnit.assert(borderTestsNative.checkNativeBackgroundColor(border), "BackgroundColor not applied correctly!");
+ });
+}
+
+export var testBackgroundImage = function () {
+ var border = _createBorder();
+
+ helper.buildUIAndRunTest(border, function (views: Array) {
+ var page = views[1];
+ page.css = "Border { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC;') }";
+
+ TKUnit.assert(borderTestsNative.checkNativeBackgroundImage(border), "Style background-image not loaded correctly from data URI.");
+ });
}
\ No newline at end of file
diff --git a/ui/border/border.android.ts b/ui/border/border.android.ts
index bbb4cd244..576be53f8 100644
--- a/ui/border/border.android.ts
+++ b/ui/border/border.android.ts
@@ -33,6 +33,9 @@ export class Border extends borderCommon.Border {
class BorderGradientDrawable extends android.graphics.drawable.GradientDrawable {
private paint: android.graphics.Paint;
private stroke: number;
+ private cornerRadius: number;
+ private backgroundColor: number;
+ private borderColor: number;
private bitmap: android.graphics.Bitmap
constructor(borderWidth: number, borderColor: number, backgroundColor: number, cornerRadius: number, bitmap?: android.graphics.Bitmap) {
@@ -43,19 +46,42 @@ class BorderGradientDrawable extends android.graphics.drawable.GradientDrawable
if (bitmap) {
this.paint = new android.graphics.Paint();
} else {
+ this.backgroundColor = backgroundColor;
this.setColor(backgroundColor);
}
var density = utils.layout.getDisplayDensity();
this.stroke = borderWidth * density;
- this.setStroke(this.stroke, borderColor);
+ this.borderColor = borderColor;
+ this.setStroke(this.stroke, this.borderColor);
- this.setCornerRadius(cornerRadius * density);
+ this.cornerRadius = cornerRadius * density;
+ this.setCornerRadius(this.cornerRadius);
return global.__native(this);
}
+ public getStroke(): number {
+ return this.stroke;
+ }
+
+ public getCornerRadius(): number {
+ return this.cornerRadius;
+ }
+
+ public getBackgroundColor(): number {
+ return this.backgroundColor;
+ }
+
+ public getBorderColor(): number {
+ return this.borderColor;
+ }
+
+ public getBitmap(): android.graphics.Bitmap {
+ return this.bitmap;
+ }
+
public draw(canvas: android.graphics.Canvas): void {
if (this.paint) {
canvas.drawBitmap(this.bitmap, this.stroke, this.stroke, this.paint);