Skip to content

Inconsistent Border Bottom Width Rendering on iOS vs Android #51926

Open
@A-dith-ya

Description

@A-dith-ya

Description

When using Pressable components styled with borderBottomWidth and a high borderRadius (for circular or rounded buttons), the visual rendering differs between platforms: On iOS, the border bottom works as expected, on Android, the border extends outside the bounds of circular buttons and creates gaps at the edges of rectangular buttons.

Steps to reproduce

  1. Create RN components using a Pressable with an Icon or Text, styled with borderBottomWidth and high border radius.
  2. Compare the visual appearance on both iOS and Android.

React Native Version

0.79.3

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

:
  OS: macOS 15.5
  CPU: (12) arm64 Apple M4 Pro
  Memory: 81.63 MB / 24.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh

Binaries:
  Node:
    version: 23.11.0
    path: /opt/homebrew/bin/node
  npm:
    version: 11.4.1
    path: /opt/homebrew/bin/npm
  Watchman:
    version: 2025.04.28.00
    path: /opt/homebrew/bin/watchman

Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod

SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.4
      - iOS 18.4
      - macOS 15.4
      - tvOS 18.4
      - visionOS 2.4
      - watchOS 11.4

IDEs:
  Android Studio: 2024.3 AI-243.26053.27.2432.13536105
  Xcode:
    version: 16.3/16E140
    path: /usr/bin/xcodebuild

Languages:
  Java:
    version: 17.0.15
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby

npmPackages:
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.79.3
    wanted: 0.79.3

Stacktrace or Logs

N/A

MANDATORY Reproducer

https://github.com/A-dith-ya/test-protected-routes/tree/button-border-bottom

Screenshots and Videos

Image

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions