Added support for Image corner radii in Android

[mattds]

Split out from PR #4252 - @kmagiera I've made the changes to how the radii arrays are allocated, is the approach I've taken correct? also it looks like ImageStylePropTypes are needed so I left them in for the moment. I suppose this pull request will only be valid if iOS supports image corner radii, but at least it's here if/when needed. Attached an image of how it handles the existing case:

[facebook-github-bot]

By analyzing the blame information on this pull request, we identified @mkonicek, @kmagiera and @brentvatne to be potential reviewers.

[mkonicek]

I'm not convinced we should add and maintain this code in the core given it's sort of an edge-case feature, and Android only. Would you be up for releasing a separate image module that supports this for people who need this feature?

[brentvatne]

@mkonicek - as I mentioned in Discord, and I think you agree with me now -- this exists on iOS and web and this is a good step forward for parity.

[mattds]

Hi, thanks for considering this pull request, please let me know if I need to update to resolve any conflicts since I originally submitted it - also if necessary I can look to move this into separate image module as suggested.

[kmagiera]

Would be great if you could squash and rebase your changes in top of master - so that we can see if the tests are passing

[facebook-github-bot]

@mattds updated the pull request.

[facebook-github-bot]

@mattds updated the pull request.

[kmagiera]

@brentvatne how is this being used on iOS? If it does exists there, why do we need to add "android-specific" code here?

[brentvatne]

Sorry @kmagiera, it seems that I was mistaken here: these properties are not currently supported directly on the Image component on iOS. The only way to re-create this effect on iOS is by adding a corner radius to a wrapper View, but this does not work on Android.

<View style={styles.test}>
  <Image
    style={styles.image}
    source={{uri: 'https://www.petfinder.com/wp-content/uploads/2012/11/140272627-grooming-needs-senior-cat-632x475.jpg'}}
  />
</View>

test: {
  borderTopLeftRadius: 20,
  overflow: 'hidden',
},

Results in:

On the web, and on React Native Android with this PR, assigning the border property specifically to images works:

So even though this isn't actually the current behaviour on iOS I think it is still desirable for us to pull this in, and we can bring iOS to parity eventually. cc @vjeux

[kmagiera]

Just a few minor comments inline and it's good to go. Thanks @mattds for your patience :)

[mattds]

It's a pleasure, will make the changes mentioned now.

[facebook-github-bot]

@mattds updated the pull request.

[kmagiera]

Looks good, just waiting for @brentvatne response on that inline comment

[vjeux]

Thanks, this is going to be very useful :) borderRadius was kind of limited as is.

[ghost]

@mkonicek would you mind taking a look at this pull request? It's been a while since the last commit was reviewed.

[mkonicek]

@brentvatne replied: #5197 (comment)

Will let @kmagiera review this one.

[kmagiera]

@facebook-github-bot shipit

[facebook-github-bot]

Thanks for importing. If you are an FB employee go to Phabricator to review.