Change shape of react native paper button

Question

I'm still pretty new to react native so please bare with me

I am trying to create a button that looks kind of like these. This shape is what's present in pretty much every tutorial

However, I get something like this with the exact same code. Note the shape, how this is a lot more rounded. I don't like the look and would like to use the other shape

My code is nothing groundbreaking:

export const HomeScreen = () => {
  return (
    <View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
      <Button mode="contained">Button</Button>
    </View>
  );
};

I am assuming this is the default in some newer version of React Native Paper, while the other type was the default before, which is why every tutorial contains that one. I didn't find a way in the docs to play around with the shape, and swapping back to a previous version just so the buttons look different sounds pretty excessive

Any help is appreciated

Answer 1

Yes for making it less rounded ,please apply the other props available like borderRadius and apply to button and not the view.

  return (
    <View style={{ flex: 1, alignItems: "center", justifyContent: 
       "center" }}>
      <Button style={{ borderRadius: 10 }} 
       mode="contained">Button</Button>
    </View>
  );
};