Search code examples
javascriptcssreact-nativescrollview

How to arrange a static button with scrollview in react native that doesn't move?

I am trying to get scrollview to work properly with my contacts listed in the entire screen and two statics buttons hovering at the bottom. I can't seem to get them to stick to the bottom (padded slightly from the bottom of the screen). My snack is here:

https://snack.expo.io/@fauslyfox110/testingreferrals

ItemScreenTWo.js

Here is how it starts: enter image description here

When I ask for permissions and open the contacts the names open up and push the buttons down. I would like to keep them stuck at the bottom.

I tried links like these:

set button in position "fixed" in React Native

But they haven't worked.

Solution

  • Try adding flex: 1 to your container

    App.js

    render() {
  return (
    <View style={{ flex: 1 }}>
      <InviteScreenTwo /> 
    </View>;
  )
}

    inviteScreenTwo.js

    return (
  <View style={{ flex: 1 }}>
    ...
  </View>