Mike Lambert
Mike Lambert

Reputation: 1986

What is the "row container" for a <ListView> component?

https://facebook.github.io/react-native/docs/listview.html says:

removeClippedSubviews bool

A performance optimization for improving scroll perf of large lists, used in conjunction with overflow: 'hidden' on the row containers.

And https://facebook.github.io/react-native/docs/performance.html says:

removeClippedSubviews

"When true, offscreen child views (whose overflow value is hidden) are removed from their native backing superview when offscreen. This can improve scrolling performance on long lists. The default value is true."(The default value is false before version 0.14-rc).

This is an extremely important optimization to apply on large ListViews. On Android the overflow value is always hidden so you don't need to worry about setting it, but on iOS you need to be sure to set overflow: hidden on row containers.

But what is a "row container"?

<ListView renderRow={(r) => <Row r=r>}>

Do I need to apply this overflow: hidden to the <ListView> or <Row> styles?

Upvotes: 1

Views: 219

Answers (1)

akshay_kashain
akshay_kashain

Reputation: 700

From the documentation you shared -

When true, offscreen child views (whose overflow value is hidden) are removed from their native backing superview when offscreen.

This means that in your case you need to apply overflow: hidden to the Row component you have used in renderRow.

Upvotes: 2

Related Questions