Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Border radius is not working on Android API 17 #1000

Closed
lscown opened this issue Oct 29, 2015 · 5 comments
Closed

Border radius is not working on Android API 17 #1000

lscown opened this issue Oct 29, 2015 · 5 comments
Assignees
@vakrilov
Labels
bug done os: android severity: medium
Milestone
1.5

Comments

@lscown
Copy link

lscown commented Oct 29, 2015

screen shot 2015-10-29 at 5 48 23 pm

This is a simplified version of our xml:

<Border class="list-icon" backgroundColor="#FAFAFA" borderColor="black">
    <Label color="red" class="icon-letter" text="H"/>
</Border>

and the CSS:

.list-icon {
  border-width: 2;
  horizontal-align: center;
  vertical-align: center;
  margin: 0 0 0 15;
  border-radius: 22;
  width: 44;
  height: 44;
}
.icon-letter {
  horizontal-align: center;
  vertical-align: center;
  font-size: 16;
}
@vchimev
Copy link
Contributor

vchimev commented Oct 30, 2015

Hi @lscown,

We managed to reproduce the issue and will look into it.

@vchimev vchimev added this to the 1.6 (Under Review) milestone Oct 30, 2015
@vchimev vchimev mentioned this issue Oct 30, 2015
Closed
@vakrilov vakrilov self-assigned this Nov 9, 2015
@vakrilov vakrilov mentioned this issue Nov 9, 2015
Merged
@vakrilov
Copy link
Contributor

vakrilov commented Nov 9, 2015

It look like some of the canvas APIs (forexample canvas.clipPath(path)) we are using are unsupported if hardware accelerations is enabled.

The solution is to use software layer for the view:

imageView.android.setLayerType(android.view.View.LAYER_TYPE_SOFTWARE, null);

@bradmartin
Copy link
Contributor

@vakrilov - is there a negative performance impact by using this on images? What about buttons? Border-radius doesnt work on my device (issue ref above) so wondering if the same internal canvas code is used on buttons? Thanks!

@vakrilov
Copy link
Contributor

@bradmartin
There might a negative performance impact - for example if rounded borders are used on many elements on a page - please refer to hardware acceleration article. However, keep in mind that:

  • This fix forces software layer only if android API level is below 18 (which means - only 17 as it is a minimum supported by native-script)
  • Software layer is used only for views that have rounded corners - so it won't impact other elements.

About the Canvas API-s we are using - you can check them here. Probably the canvas.clipPath(path) call was causing the issue with rendering - according to the article above it is supported on after API lvl 18.

@vakrilov vakrilov added ready for test TSC needs to test this and confirm against live production apps and automated test suites and removed in progress labels Nov 10, 2015
@vchimev vchimev added done and removed ready for test TSC needs to test this and confirm against live production apps and automated test suites labels Nov 10, 2015
@vchimev vchimev modified the milestones: 1.5, 1.6 (Under Review) Nov 10, 2015
@vchimev vchimev closed this as completed Nov 10, 2015
@lock
Copy link

lock bot commented Aug 30, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock bot locked and limited conversation to collaborators Aug 30, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@vakrilov vakrilov

Labels
bug done os: android severity: medium
Projects
None yet
Milestone
1.5
Development

No branches or pull requests
4 participants
@vakrilov @lscown @bradmartin @vchimev