diff --git a/apps/app/ui-tests-app/css/label-border.css b/apps/app/ui-tests-app/css/label-border.css index 3bb2b8467..8ebc80632 100644 --- a/apps/app/ui-tests-app/css/label-border.css +++ b/apps/app/ui-tests-app/css/label-border.css @@ -9,7 +9,7 @@ Label { } #s1 { - border-width: 5; border-color: red; + border-width: 5; border-color: rgba(255,0,0,1); } #s2 { @@ -25,7 +25,7 @@ Label { } #s5 { - border-width: 5 10 15 20; border-color: red; + border-width: 5 10 15 20; border-color: rgb(255, 0, 0); } #s6 { diff --git a/tests/app/ui/styling/style-properties-tests.ts b/tests/app/ui/styling/style-properties-tests.ts index 768de2843..abc9055a3 100644 --- a/tests/app/ui/styling/style-properties-tests.ts +++ b/tests/app/ui/styling/style-properties-tests.ts @@ -81,6 +81,14 @@ export function test_setting_borderColor_property_from_CSS_is_applied_to_Style() test_property_from_CSS_is_applied_to_style("borderColor", "border-color", new color.Color("#FF0000"), "#FF0000"); } +export function test_setting_borderColorRGB_property_from_CSS_is_applied_to_Style() { + test_property_from_CSS_is_applied_to_style("borderColor", "border-color", new color.Color("#FF0000"), "rgb(255, 0, 0)"); +} + +export function test_setting_borderColorRGBA_property_from_CSS_is_applied_to_Style() { + test_property_from_CSS_is_applied_to_style("borderColor", "border-color", new color.Color("#FF0000"), "rgba(255,0,0,1)"); +} + export function test_setting_borderRadius_property_from_CSS_is_applied_to_Style() { test_property_from_CSS_is_applied_to_style("borderRadius", "border-radius", 20); } diff --git a/tns-core-modules/ui/styling/style.ts b/tns-core-modules/ui/styling/style.ts index b00b145bc..7a5bee76a 100644 --- a/tns-core-modules/ui/styling/style.ts +++ b/tns-core-modules/ui/styling/style.ts @@ -1613,6 +1613,11 @@ function parseBorderColor(value: any): definition.BorderColor { var result: definition.BorderColor = { top: undefined, right: undefined, bottom: undefined, left: undefined }; try { if (types.isString(value)) { + if (value.indexOf("rgb") === 0){ + result.top = result.right = result.bottom = result.left = new Color(value); + return result; + } + let arr = value.split(/[ ,]+/); if (arr.length === 1){ let arr0 = new Color(arr[0]); @@ -1650,11 +1655,11 @@ function parseBorderColor(value: any): definition.BorderColor { } } else if (value instanceof Color) { - result.top = result.right = result.bottom = result.left = value; - } - else { - result = value; - } + result.top = result.right = result.bottom = result.left = value; + } + else { + result = value; + } } catch(ex){ if (trace.enabled) {