4

could you help me with this problem with the border radius of the button on the react native elements library?

I'm adding a border radius to the button, but its opacity remains rectangular, I don't understand why.

https://github.com/react-native-elements/react-native-elements/issues/2324

taynan
  • 121
  • 2
  • 8
  • I think the problem has to do something with the overflow in RN .. wrap a View around it or check out this Question maybe : https://stackoverflow.com/questions/41912313/element-overflow-hidden-in-react-native-android – yesIamFaded Apr 23 '20 at 11:12
  • not working :( @yesIamFaded – taynan Apr 23 '20 at 11:32
  • try this: adding "width: 100%" into your button. – nima Aug 22 '21 at 13:13

1 Answers1

4

In ReactNative: 0.65, Elements: 3.4.2 and API 29 this still happens with me, but I found a solution setting overflow:'hidden' on View like this:

<View style={{
  width:"100%", 
  borderRadius: 30, 
  overflow: 'hidden' 
}}>
  <Button
    title="Login"
    type="solid"
    buttonStyle={{borderRadius: 30}}
  />
</View>
Marco A. de Lima
  • 41
  • 2
  • I used a similar approach, but instead of using a `View` component, I directly set the borderRadius and overflow properties inside `containerStyle` of the button itself: https://stackoverflow.com/a/73050493/2922751 – Martinocom Jul 20 '22 at 12:12