Weird style using default button after upgrading to 1.0.0-beta7

[fgagneten]

I have been working using React Native Elements version 0.18.4 Everything was OK

Today, I've upgraded to 1.0.0-beta7 (so I can try out themes and new features) but all the button got a weird style (see the image below):

Do you see the shadow and and the weird style of the button?

The code is the same as I had before (nothing changes):

<Button
    raised
    icon={{ name: 'cached' }}
    key={1}
    title='BUTTON WITH ICON' />,
  <Button
   
    key={2}
  />,
  <Button
    raised
    containerViewStyle={ComponentsStyle.outlineLargeButton}
    large
    key={3}
    rounded
    borderRadius={35}
    color='#336688'
    outline
    title='example'
  />`

The problem started after upgrading the version of React Native Elements.

react-native-cli: 2.0.1
react-native: 0.57.7

Thanks

[xavier-villelegier]

Hey @fgagneten 👋
Thanks for taking the time to upgrade to 1.0.0-beta7 !

The API of the Button has changed a bit because it has been fully refactored, you can see the updated API here.

The first things I see in your code:

• borderRadius and color doesn't exist anymore, you need to apply it through the styles
• containerViewStyle became containerStyle

Maybe you should use the repo with next branch directly because we added back a type props that can be raised, outline and solid. This will be in the next release, and we planned to write a migration guide from to 1.0.0. Feel free to post some screens of your buttons before the update, and we can help you to get the good UI

[suihalee]

I try this version and the background color of the button cannot be set too.
Let check that.

[OmbraDiFenice]

I noticed the same weird style applied to buttons in my code, even if I used only title and onPress props:

<Button
    title="Login" 
    onPress={() => {
        // do stuff...
    }}
/>

result:

Also, when I tap on the button, the "press shadow" visual cue that should be limited to the button boudaries goes out so it looks like I tapped on a generic area of the screen. Can the two things be connected?

[iRoachie]

@OmbraDiFenice it's already been fixed on the next branch

[iRoachie]

Duplicate of #1547