Skip to content

Border on a Single Side of a View is Same Color as backgroundColor when borderRadius > 0 (Android only) #16708

@keith-kurak

Description

@keith-kurak

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 8.4.0
Yarn: 1.2.1
npm: 5.4.2
Watchman: 4.9.0
Xcode: Xcode 9.1 Build version 9B55
Android Studio: 2.3 AI-162.3934792

Packages: (wanted => installed)
react: 16.0.0-beta.5 => 16.0.0-beta.5
react-native: https://github.com/expo/react-native/archive/sdk-22.0.1.tar.gz => 0.49.3

Target Platform: Android (6.0)

Steps to Reproduce

  1. Create a View
  2. Give it a style with a non-zero width, backgroundColor, a non-zero borderRadius, a non-zero border_____Width, and a border_____Color that's different from the backgroundColor, where ____ is Top, Bottom, Left, or Right. (can also do multiple sides with colors and widths).
  3. Try it on Android.

Expected Behavior

I should see a box with rounded corners with a distinctly-colored border on at least one side.

Actual Behavior

The border is the same color as the box's backgroundColor.

screen shot 2017-11-06 at 4 10 01 pm

To compare with iOS, where this issue doesn't occur:
screen shot 2017-11-06 at 4 10 36 pm

Reproducible Demo

Expo Snack demonstrating issue

Metadata

Metadata

Assignees

No one assigned

    Labels

    Platform: AndroidAndroid applications.Ran CommandsOne of our bots successfully processed a command.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions