-
Notifications
You must be signed in to change notification settings - Fork 453
Open
Description
Environment
- React Native version: 0.81.4
- react-native-pager-view version: 6.9.1
- Platform: iOS
- iOS version: 26.x (tested on simulator/device)
- macOS version: 26.0 (Sequoia)
- Xcode version: 26.0.1
- Expo SDK version: ~54.0.10
- Architecture: New Architecture enabled
Description
The scrollEnabled={false} prop does not prevent user swipe gestures on iOS. Despite setting this prop to false, users can still swipe horizontally to change pages in the PagerView component.
Expected behavior: When scrollEnabled={false} is set, users should not be able to swipe between pages. Page changes should only be possible programmatically via setPage().
Actual behavior: Users can still swipe between pages even with scrollEnabled={false}. The prop seems to be ignored on iOS.
Note: This appears to work correctly on Android.
Reproducible Demo
import React, { useEffect, useRef, useState } from 'react';
import { View, Text, Button, StyleSheet } from 'react-native';
import PagerView from 'react-native-pager-view';
export default function App() {
return (
<View style={styles.container}>
<PagerView
style={styles.pager}
initialPage={0}
scrollEnabled={false} // This should prevent swiping but doesn't work on iOS
>
<View key="1" style={[styles.page, { backgroundColor: '#FF6B6B' }]}>
<Text style={styles.text}>Page 1</Text>
</View>
<View key="2" style={[styles.page, { backgroundColor: '#4ECDC4' }]}>
<Text style={styles.text}>Page 2</Text>
</View>
<View key="3" style={[styles.page, { backgroundColor: '#45B7D1' }]}>
<Text style={styles.text}>Page 3</Text>
</View>
</PagerView>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
pager: {
flex: 1,
},
page: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
text: {
fontSize: 24,
fontWeight: 'bold',
color: 'white',
},
});Steps to reproduce:
- Create a new React Native project with the environment specified above
- Install
react-native-pager-view@6.9.1 - Copy the code above into your App component
- Run on iOS simulator or device
- Try to swipe between pages - swiping works even though
scrollEnabled={false} - Compare with Android where the prop works correctly
Additional context:
I'm using this in a multi-step form where I want to control navigation programmatically with "Next" and "Previous" buttons only, without allowing users to swipe between steps.
mattia-sanfilippo, AlanChauchet, thomasdelobel, cristianrosu, visibly and 6 moreChronoByteCosmonaut and rafaelderolez
Metadata
Metadata
Assignees
Labels
No labels