SegmentedControl with List on Android not working

[TweetyBoop1990]

Description

When using SegmentedControl with an android device, the list in the segment can be scrolled but cannot be pressed.

Related to

• [x] Components
• [ ] Demo
• [ ] Docs
• [ ] Typings

Steps to reproduce

1- Create a SegmentedControl 2- Set a Flatlist to appear for the segmented control index 3- Set a large number of items to appear in the flatlist or set the vertical padding to be big enough that some items do not appear above the fold upon rendering 4- On android, the items in the list below the fold are not pressable.

Expected behavior

The items below the fold should be pressable if set that way

Actual behavior

The items below the fold on render are not pressable

Code snippet

          <SegmentedControl
            margin-s2
            segments={[
              { label: t('compare.version') },
              { label: t('compare.plan') },
            ]}
            onChangeIndex={setSegmentIndex}
            preset="form"
          />
{segmentIndex === 0 && <Flatlist data={longlist} renderItem={({ item, index }) => { return (<Card marginV-s3 onPress={() => console.log('press me')}><Text>{item.title}</Text></Card>)}}

Environment

• React Native version: 0.77.1
• React Native UI Lib version: 7.38.1

Affected platforms

• [x] Android
• [ ] iOS
• [ ] Web

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[M-i-k-e-l]

Hello,

We have a version that supports new-arch (RN77), you can use the next tag for now. Please make sure to go over the v8 doc, it includes breaking changes and some known issues.