[Android] Fix Touchable children clipping

[j-piasecki]

Description

Native Android button implementation wasn't clipping its children to its actual shape but to the rectangular bounding box. This PR fixes that, aligning behavior with iOS.

Test plan

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

export default function EmptyExample() {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Touchable
        activeOpacity={1}
        animationDuration={{ in: 200, out: 200 }}
        underlayColor={'black'}
        style={{
          width: 100,
          height: 100,
          borderRadius: 50,
          backgroundColor: 'red',
          overflow: 'hidden',
        }}>
        <View style={{ flex: 1, backgroundColor: 'green', opacity: 0.5 }} />
      </Touchable>
    </View>
  );
}

Android before	Android after	iOS

[Copilot]

Pull request overview

Fixes Android Touchable rendering so overflow: hidden clips children to the actual resolved border-radius shape (instead of the view’s rectangular bounds), aligning behavior with iOS.

Changes:

• Replace clipChildren/clipToPadding toggling with a dedicated clipChildrenToShape flag driven by overflow.
• Apply shape-based clipping in dispatchDraw via BackgroundStyleApplicator.clipToPaddingBox(...) when overflow: hidden.

---

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