Skip to content

ScrollView disables control of children when using pagingEnabled #2796

@ettmetal

Description

@ettmetal

Is there an existing issue for this?

  • I have searched the existing issues

Describe the issue

When using the pagingEnabled prop of ScrollView, it is no longer possible to control the styles of children. I believe this is because, while there is a contentContainerStyle prop on the component, it actually adds an additional layer of containers wrapping children when pagingEnabled is true.

Expected behavior

I expect to be able to set style props on the children I provide to ScrollView, and for the rendered view to act as if those props were applied.

Perhaps the wrapping view could copy style props from the child it wraps? I'm not sure how the implementation would be exactly, but as it stands there's a difference in how the component acts and looks, and what styling is even possible, depending on if the pagingEnabled prop is set or not.

Steps to reproduce

  1. Set the pagingEnabled prop on an ScrollView
  2. Observe that it is now impossible to manipulate layout of ScrollView children by setting props such as height, width, flex* etc. They are bounded to their minimum dimensions.

Test case

It is not possible to use that template: see below

Additional comments

The provided template for repro results in the following error when forked:

error reading: The editor could not be opened due to an unexpected error: Assertion Failed: argument is undefined or null, with a button labelled Try Again beneath the message

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions