Skip to content

Commit ced9817

Browse files
krozniatakrozniata
authored
feat(ios): drop support for showPageIndicator (#615)
* feat(ios): drop support for showPageIndicator * feat(ios): remove dots toggle from ControlPanel * fix: fix lint error
1 parent 739702d commit ced9817

File tree

9 files changed

+3
-84
lines changed

9 files changed

+3
-84
lines changed

‎README.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,6 @@ For advanced usage please take a look into our [example project](https://github.
150150
| `pageMargin: number` | Blank space to be shown between pages | both |
151151
| `keyboardDismissMode: ('none' / 'on-drag')` | Determines whether the keyboard gets dismissed in response to a drag | both |
152152
| `orientation: Orientation` | Set `horizontal` or `vertical` scrolling orientation (it does **not** work dynamically) | both |
153-
| `showPageIndicator: boolean` | Shows the dots indicator at the bottom of the view | iOS |
154153
| `overScrollMode: OverScollMode` | Used to override default value of overScroll mode. Can be `auto`, `always` or `never`. Defaults to `auto` | Android |
155154
| `offscreenPageLimit: number` | Set the number of pages that should be retained to either side of the currently visible page(s). Pages beyond this limit will be recreated from the adapter when needed. Defaults to RecyclerView's caching strategy. The given value must either be larger than 0. | Android |
156155
| `overdrag: boolean` | Allows for overscrolling after reaching the end or very beginning or pages. Defaults to `false` | iOS |

‎example/src/component/NavigationPanel/ControlPanel.tsx‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,13 @@ export function ControlsPanel({
1010
pages,
1111
scrollState,
1212
scrollEnabled,
13-
dotsEnabled,
1413
progress,
1514
disablePagesAmountManagement,
1615
overdragEnabled,
1716
setPage,
1817
addPage,
1918
removePage,
2019
toggleScroll,
21-
toggleDots,
2220
toggleAnimation,
2321
toggleOverdrag,
2422
}: NavigationPanelProps) {
@@ -43,11 +41,6 @@ export function ControlsPanel({
4341
text={scrollEnabled ? 'Scroll Enabled' : 'Scroll Disabled'}
4442
onPress={toggleScroll}
4543
/>
46-
<Button
47-
style={styles.buttonAdjustment}
48-
text={dotsEnabled ? 'Hide dots' : 'Show dots'}
49-
onPress={toggleDots}
50-
/>
5144
<Button
5245
style={styles.buttonAdjustment}
5346
text={overdragEnabled ? 'Overdrag Enabled' : 'Overdrag Disabled'}

‎example/src/hook/useNavigationPanel.ts‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,6 @@ export function useNavigationPanel(
3232
const [overdragEnabled, setOverdragEnabled] = useState(false);
3333
const [scrollEnabled, setScrollEnabled] = useState(true);
3434
const [scrollState, setScrollState] = useState('idle');
35-
const [dotsEnabled, setDotsEnabled] = useState(false);
3635
const [logs, setLogs] = useState<EventLog[]>([]);
3736
const [progress, setProgress] = useState({ position: 0, offset: 0 });
3837
const onPageScrollOffset = useRef(new Animated.Value(0)).current;
@@ -67,10 +66,6 @@ export function useNavigationPanel(
6766
() => setScrollEnabled((enabled) => !enabled),
6867
[]
6968
);
70-
const toggleDots = useCallback(
71-
() => setDotsEnabled((enabled) => !enabled),
72-
[]
73-
);
7469
const toggleOverdrag = useCallback(
7570
() => setOverdragEnabled((enabled) => !enabled),
7671
[]
@@ -147,14 +142,12 @@ export function useNavigationPanel(
147142
pages,
148143
scrollState,
149144
scrollEnabled,
150-
dotsEnabled,
151145
progress,
152146
overdragEnabled,
153147
setPage,
154148
addPage,
155149
removePage,
156150
toggleScroll,
157-
toggleDots,
158151
toggleAnimation,
159152
setProgress,
160153
onPageScroll,

‎fabricexample/src/component/NavigationPanel/ControlPanel.tsx‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,13 @@ export function ControlsPanel({
1010
pages,
1111
scrollState,
1212
scrollEnabled,
13-
dotsEnabled,
1413
progress,
1514
disablePagesAmountManagement,
1615
overdragEnabled,
1716
setPage,
1817
addPage,
1918
removePage,
2019
toggleScroll,
21-
toggleDots,
2220
toggleAnimation,
2321
toggleOverdrag,
2422
}: NavigationPanelProps) {
@@ -43,11 +41,6 @@ export function ControlsPanel({
4341
text={scrollEnabled ? 'Scroll Enabled' : 'Scroll Disabled'}
4442
onPress={toggleScroll}
4543
/>
46-
<Button
47-
style={styles.buttonAdjustment}
48-
text={dotsEnabled ? 'Hide dots' : 'Show dots'}
49-
onPress={toggleDots}
50-
/>
5144
<Button
5245
style={styles.buttonAdjustment}
5346
text={overdragEnabled ? 'Overdrag Enabled' : 'Overdrag Disabled'}

‎fabricexample/src/hook/useNavigationPanel.tsx‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,6 @@ export function useNavigationPanel(
3232
const [overdragEnabled, setOverdragEnabled] = useState(false);
3333
const [scrollEnabled, setScrollEnabled] = useState(true);
3434
const [scrollState, setScrollState] = useState('idle');
35-
const [dotsEnabled, setDotsEnabled] = useState(false);
3635
const [logs, setLogs] = useState<EventLog[]>([]);
3736
const [progress, setProgress] = useState({ position: 0, offset: 0 });
3837
const onPageScrollOffset = useRef(new Animated.Value(0)).current;
@@ -67,10 +66,6 @@ export function useNavigationPanel(
6766
() => setScrollEnabled((enabled) => !enabled),
6867
[]
6968
);
70-
const toggleDots = useCallback(
71-
() => setDotsEnabled((enabled) => !enabled),
72-
[]
73-
);
7469
const toggleOverdrag = useCallback(
7570
() => setOverdragEnabled((enabled) => !enabled),
7671
[]
@@ -147,14 +142,12 @@ export function useNavigationPanel(
147142
pages,
148143
scrollState,
149144
scrollEnabled,
150-
dotsEnabled,
151145
progress,
152146
overdragEnabled,
153147
setPage,
154148
addPage,
155149
removePage,
156150
toggleScroll,
157-
toggleDots,
158151
toggleAnimation,
159152
setProgress,
160153
onPageScroll,

‎ios/ReactNativePageView.h‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ NS_ASSUME_NONNULL_BEGIN
1414
@property(nonatomic) NSInteger currentIndex;
1515
@property(nonatomic) NSInteger pageMargin;
1616
@property(nonatomic, readonly) BOOL scrollEnabled;
17-
@property(nonatomic, readonly) BOOL showPageIndicator;
1817
@property(nonatomic, readonly) UIScrollViewKeyboardDismissMode dismissKeyboard;
1918
@property(nonatomic) UIPageViewControllerNavigationOrientation orientation;
2019
@property(nonatomic, copy) RCTDirectEventBlock onPageSelected;
@@ -26,7 +25,6 @@ NS_ASSUME_NONNULL_BEGIN
2625

2726
- (void)goTo:(NSInteger)index animated:(BOOL)animated;
2827
- (void)shouldScroll:(BOOL)scrollEnabled;
29-
- (void)shouldShowPageIndicator:(BOOL)showPageIndicator;
3028
- (void)shouldDismissKeyboard:(NSString *)dismissKeyboard;
3129

3230
@end

‎ios/ReactNativePageView.m‎

Lines changed: 2 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
@interface ReactNativePageView () <UIPageViewControllerDataSource, UIPageViewControllerDelegate, UIScrollViewDelegate>
1313

1414
@property(nonatomic, strong) UIPageViewController *reactPageViewController;
15-
@property(nonatomic, strong) UIPageControl *reactPageIndicatorView;
1615
@property(nonatomic, strong) RCTEventDispatcher *eventDispatcher;
1716

1817
@property(nonatomic, weak) UIScrollView *scrollView;
@@ -23,7 +22,6 @@ @interface ReactNativePageView () <UIPageViewControllerDataSource, UIPageViewCon
2322

2423
- (void)goTo:(NSInteger)index animated:(BOOL)animated;
2524
- (void)shouldScroll:(BOOL)scrollEnabled;
26-
- (void)shouldShowPageIndicator:(BOOL)showPageIndicator;
2725
- (void)shouldDismissKeyboard:(NSString *)dismissKeyboard;
2826

2927

@@ -105,30 +103,13 @@ - (void)embed {
105103

106104
self.reactPageViewController = pageViewController;
107105

108-
UIPageControl *pageIndicatorView = [self createPageIndicator];
109-
110-
pageIndicatorView.numberOfPages = self.reactSubviews.count;
111-
pageIndicatorView.currentPage = self.initialPage;
112-
pageIndicatorView.hidden = !self.showPageIndicator;
113-
114-
self.reactPageIndicatorView = pageIndicatorView;
115-
116106
[self reactAddControllerToClosestParent:pageViewController];
117-
[pageViewController.view addSubview:pageIndicatorView];
118107
[self addSubview:pageViewController.view];
119108

120109
pageViewController.view.frame = self.bounds;
121110

122111
[self shouldScroll:self.scrollEnabled];
123112

124-
if (@available(iOS 9.0, *)) {
125-
pageIndicatorView.translatesAutoresizingMaskIntoConstraints = NO;
126-
NSLayoutConstraint *bottomConstraint = [pageIndicatorView.bottomAnchor constraintEqualToAnchor: pageViewController.view.bottomAnchor constant:0];
127-
NSLayoutConstraint *leadingConstraint = [pageIndicatorView.leadingAnchor constraintEqualToAnchor: pageViewController.view.leadingAnchor constant:0];
128-
NSLayoutConstraint *trailingConstraint = [pageIndicatorView.trailingAnchor constraintEqualToAnchor: pageViewController.view.trailingAnchor constant:0];
129-
130-
[NSLayoutConstraint activateConstraints:@[bottomConstraint, leadingConstraint, trailingConstraint]];
131-
}
132113
[pageViewController.view layoutIfNeeded];
133114
}
134115

@@ -250,8 +231,6 @@ - (void)goTo:(NSInteger)index animated:(BOOL)animated {
250231
BOOL isForward = (index > self.currentIndex && [self isLtrLayout]) || (index < self.currentIndex && ![self isLtrLayout]);
251232
UIPageViewControllerNavigationDirection direction = isForward ? UIPageViewControllerNavigationDirectionForward : UIPageViewControllerNavigationDirectionReverse;
252233

253-
self.reactPageIndicatorView.numberOfPages = numberOfPages;
254-
self.reactPageIndicatorView.currentPage = index;
255234
long diff = labs(index - _currentIndex);
256235

257236
if (isForward && diff > 0) {
@@ -345,7 +324,6 @@ - (void)pageViewController:(UIPageViewController *)pageViewController
345324

346325
self.currentIndex = currentIndex;
347326
self.currentView = currentVC.view;
348-
self.reactPageIndicatorView.currentPage = currentIndex;
349327
[self.eventDispatcher sendEvent:[[RCTOnPageSelected alloc] initWithReactTag:self.reactTag position:@(currentIndex) coalescingKey:_coalescingKey++]];
350328
[self.eventDispatcher sendEvent:[[RCTOnPageScrollEvent alloc] initWithReactTag:self.reactTag position:@(currentIndex) offset:@(0.0)]];
351329
self.lastReportedIndex = currentIndex;
@@ -368,26 +346,6 @@ - (UIViewController *)pageViewController:(UIPageViewController *)pageViewControl
368346

369347
#pragma mark - UIPageControlDelegate
370348

371-
- (void)shouldShowPageIndicator:(BOOL)showPageIndicator {
372-
_showPageIndicator = showPageIndicator;
373-
374-
if (self.reactPageIndicatorView) {
375-
self.reactPageIndicatorView.hidden = !showPageIndicator;
376-
}
377-
}
378-
379-
- (UIPageControl *)createPageIndicator {
380-
UIPageControl *pageControl = [[UIPageControl alloc] init];
381-
pageControl.tintColor = UIColor.blackColor;
382-
pageControl.pageIndicatorTintColor = UIColor.whiteColor;
383-
pageControl.currentPageIndicatorTintColor = UIColor.blackColor;
384-
[pageControl addTarget:self
385-
action:@selector(pageControlValueChanged:)
386-
forControlEvents:UIControlEventValueChanged];
387-
388-
return pageControl;
389-
}
390-
391349
- (void)pageControlValueChanged:(UIPageControl *)sender {
392350
if (sender.currentPage != self.currentIndex) {
393351
[self goTo:sender.currentPage animated:YES];
@@ -404,7 +362,7 @@ - (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoi
404362
[self.eventDispatcher sendEvent:[[RCTOnPageScrollStateChanged alloc] initWithReactTag:self.reactTag state:@"settling" coalescingKey:_coalescingKey++]];
405363

406364
if (!_overdrag) {
407-
NSInteger maxIndex = _reactPageIndicatorView.numberOfPages - 1;
365+
NSInteger maxIndex = self.reactSubviews.count - 1;
408366
BOOL isFirstPage = [self isLtrLayout] ? _currentIndex == 0 : _currentIndex == maxIndex;
409367
BOOL isLastPage = [self isLtrLayout] ? _currentIndex == maxIndex : _currentIndex == 0;
410368
CGFloat contentOffset =[self isHorizontal] ? scrollView.contentOffset.x : scrollView.contentOffset.y;
@@ -452,7 +410,7 @@ - (void)scrollViewDidScroll:(UIScrollView *)scrollView {
452410
}
453411

454412
if (!_overdrag) {
455-
NSInteger maxIndex = _reactPageIndicatorView.numberOfPages - 1;
413+
NSInteger maxIndex = self.reactSubviews.count - 1;
456414
NSInteger firstPageIndex = [self isLtrLayout] ? 0 : maxIndex;
457415
NSInteger lastPageIndex = [self isLtrLayout] ? maxIndex : 0;
458416
BOOL isFirstPage = _currentIndex == firstPageIndex;

‎ios/ReactViewPagerManager.m‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -78,9 +78,6 @@ - (void) changeScrollEnabled
7878
[view shouldDismissKeyboard:[RCTConvert NSString:json]];
7979
}
8080

81-
RCT_CUSTOM_VIEW_PROPERTY(showPageIndicator, BOOL, ReactNativePageView) {
82-
[view shouldShowPageIndicator:[RCTConvert BOOL:json]];
83-
}
8481

8582
- (UIView *)view {
8683
return [[ReactNativePageView alloc] initWithEventDispatcher:self.bridge.eventDispatcher];

‎src/index.tsx‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,16 +9,11 @@ import type {
99
NativeProps,
1010
} from './PagerViewNativeComponent';
1111

12-
interface PagerViewProps extends NativeProps {
13-
// TODO do we still need this ?
14-
showPageIndicator?: boolean;
15-
}
16-
1712
export type {
1813
PagerViewOnPageScrollEventData,
1914
PagerViewOnPageSelectedEventData,
2015
PageScrollStateChangedNativeEventData,
21-
PagerViewProps,
16+
NativeProps as PagerViewProps,
2217
};
2318

2419
export type PagerViewOnPageScrollEvent =

0 commit comments

Comments
 (0)