Description
Environment
Provide version numbers for the following components (information can be retrieved by running tns info
in your project folder or by inspecting the package.json
of the project):
- CLI: 7.2.1
- Cross-platform modules: -
- Android Runtime: 7.0.1
- iOS Runtime: 7.2.0
- XCode Version: 12.4
- Nativescript Angular: 11.0.1
Describe the bug
When using border-right-color or any border-side-color on a Button, border radius gets ignored and rest to 0, on IOS only, on Android it works like intended
Example project
https://github.com/13dante04/nativescript-buttons-sample
To Reproduce
Have a button with a css class .btn
<GridLayout>
<ScrollView>
<StackLayout class="home-panel">
<Button text="btn" class="btn"></Button>
</StackLayout>
</ScrollView>
</GridLayout>
apply a style with border-side-color and border-style: solid and border-width: 1
.btn {
border-left-color: red;
border-left-width: 1;
border-left-style: solid;
border-radius: 30;
}
**Android result (expected) **
EDIT: not quite sure about the border not bending to it's radius but I'm addressing that issue here.
Expected behavior
Have a button with rounded edges but only one side with a border radius (particular use case when only applying border radius to one side, but the bug happens when generally applying border radius)
Additional context
Didn't test out other layouts, I'm kind of low on time, managed to get myself a workaround but just putting it out here in case someone else stumbles upon the issue.