Skip to content

[Android] Accept percentage-based border radius#4185

Merged
j-piasecki merged 1 commit into
mainfrom
@jpiasecki/button-percentage-border-radius
May 22, 2026
Merged

[Android] Accept percentage-based border radius#4185
j-piasecki merged 1 commit into
mainfrom
@jpiasecki/button-percentage-border-radius

Conversation

@j-piasecki
Copy link
Copy Markdown
Member

Description

ViewGroupManager which is a base for RNGestureHandlerButtonViewManager doesn't support borderRadius values other than Double. This causes Touchable to crash when setting a percentage-based border radius. This PR changes those values to use Dynamic and go through RNGestureHandlerButtonViewManager instead of falling back to ViewGroupManager.

iOS continues to work as before.

Test plan

import React from 'react';
import { Touchable } from 'react-native-gesture-handler';

export default function EmptyExample() {
  return (
    <Touchable
      style={{
        marginTop: 200,
        width: 300,
        height: 40,
        backgroundColor: '#ddd',
        borderRadius: '50%',
      }}
      underlayColor="black"
      animationDuration={{ in: 0, out: 2000 }}
    />
  );
}

Before: crash, after: no crash

Screenshot 2026-05-21 at 10 11 12

Copilot AI review requested due to automatic review settings May 21, 2026 08:48
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Enables percentage-based borderRadius values (e.g. '50%') for Touchable/RNGestureHandlerButton on Android by preventing ViewGroupManager from coercing radius props to Double, and instead forwarding raw values to RNGestureHandlerButtonViewManager for parsing.

Changes:

  • Updates the Button native component spec to declare border radius props as UnsafeMixed so raw values (number or percentage string) are forwarded.
  • Updates Android RNGestureHandlerButtonViewManager border radius setters to accept Dynamic and parse via LengthPercentage.setFromDynamic(...).

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File Description
packages/react-native-gesture-handler/src/specs/RNGestureHandlerButtonNativeComponent.ts Switches border radius props to UnsafeMixed and explicitly declares non-logical radii so they route through this component’s delegate.
packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerButtonViewManager.kt Parses border radius props from Dynamic using LengthPercentage.setFromDynamic to support percentage strings and avoid Double casting crashes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@j-piasecki j-piasecki marked this pull request as ready for review May 21, 2026 08:59
@j-piasecki j-piasecki merged commit 5d2cf2b into main May 22, 2026
9 checks passed
@j-piasecki j-piasecki deleted the @jpiasecki/button-percentage-border-radius branch May 22, 2026 11:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants