Building a scrollable component in react native is fairly easy but comes with a gotcha.

Use ScrollView instead of View

Simple enough. I had a View component that looked like the following:

<View>
  { this.renderAlbums() }
</View>

This was replaced with

<ScrollView>
  { this.renderAlbums() }
</ScrollView>

gotcha

The gotcha was that I had to change the top level application code to bring in a style with a flex of 1. I don’t quite know why!

const App = () => (
    <View style= >
        <Header headerText={'Albums'} />
        <AlbumList />
    </View>
);