> For the complete documentation index, see [llms.txt](https://rangle-io.gitbook.io/react-native-workshop/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://rangle-io.gitbook.io/react-native-workshop/index-6.md).

# ScrollView (Pokemon Details)

We can now start setting up the detail view for individual pokemon selected in from the list. In order to do this, we'll have to make use of a new React Native component. The `ScrollView` component!

A scroll view is similar to the `ListView` component we have used already, but it has a few differences. To start, the `ListView` component is used when you have long lists of changing data. It has optimizations that make it more efficient for this type of data. The `ListView` also brings the ability to separate your content into sections, as well as displaying section headers. The `ScrollView` on the other hand, is just for displaying content of various heights inside a fixed height container. These components are better to use if you have data that isn't likely to change much.

## ScrollView API

An important prop to be aware of for the `ScrollView` is the `contentContainerStyle` prop. This prop will pass your styles over to the container element that will wrap your `ScrollView`'s child elements. This is a good place to pass styles such as `justifyContent` or `alignItems`.

You can [find out more about the ScrollView's props here.](https://facebook.github.io/react-native/docs/scrollview.html)

Using the `ScrollView` component, let's setup the display for our Pokemon's abilities and stats!

![](https://2121106575-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZp63Gm3O3A8Q8ddKvK%2F-LZp68a-SA_xLHt7vZ-w%2F-LZp6CAAnCtgJHYSqXvB%2FpokemonDetails.png?generation=1551374276981809\&alt=media)