Skip to content

Commit 262bf4d

Browse files
committed
feat: scrollBarIndicatorVisible support
1 parent 85c38e1 commit 262bf4d

File tree

3 files changed

+121
-83
lines changed

3 files changed

+121
-83
lines changed

src/collectionview-common.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,7 @@ export abstract class CollectionViewBase extends View implements CollectionViewD
104104
public reorderEnabled: boolean;
105105
public reorderLongPressEnabled: boolean;
106106
protected _dataUpdatesSuspended = false;
107+
public scrollBarIndicatorVisible: boolean;
107108

108109
public layoutStyle: string = 'grid';
109110
public plugins: string[] = [];
@@ -617,3 +618,10 @@ export const reorderLongPressEnabledProperty = new Property<CollectionViewBase,
617618
valueConverter: booleanConverter,
618619
});
619620
reorderLongPressEnabledProperty.register(CollectionViewBase);
621+
622+
export const scrollBarIndicatorVisibleProperty = new Property<CollectionViewBase, boolean>({
623+
name: 'scrollBarIndicatorVisible',
624+
defaultValue: true,
625+
valueConverter: booleanConverter,
626+
});
627+
scrollBarIndicatorVisibleProperty.register(CollectionViewBase);

src/collectionview.android.ts

Lines changed: 38 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import {
1515
profile,
1616
} from '@nativescript/core';
1717
import { layout } from '@nativescript/core/utils/utils';
18-
import { CollectionViewItemDisplayEventData, CollectionViewItemEventData, Orientation, reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty } from './collectionview';
18+
import { CollectionViewItemDisplayEventData, CollectionViewItemEventData, Orientation, reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty, scrollBarIndicatorVisibleProperty } from './collectionview';
1919
import { CLog, CLogTypes, CollectionViewBase, ListViewViewTypes, isScrollEnabledProperty, orientationProperty } from './collectionview-common';
2020

2121
export * from './collectionview-common';
@@ -450,43 +450,38 @@ export class CollectionView extends CollectionViewBase {
450450
}
451451
}
452452

453-
public [paddingTopProperty.getDefault](): number {
454-
return (this.nativeView as android.view.View).getPaddingTop();
453+
[paddingTopProperty.getDefault](): Length {
454+
return { value: this._defaultPaddingTop, unit: 'px' };
455455
}
456-
public [paddingTopProperty.setNative](value: Length) {
456+
[paddingTopProperty.setNative](value: Length) {
457457
this._setPadding({ top: this.effectivePaddingTop });
458458
}
459459

460-
public [paddingRightProperty.getDefault](): number {
461-
return (this.nativeView as android.view.View).getPaddingRight();
460+
[paddingRightProperty.getDefault](): Length {
461+
return { value: this._defaultPaddingRight, unit: 'px' };
462462
}
463-
public [paddingRightProperty.setNative](value: Length) {
463+
[paddingRightProperty.setNative](value: Length) {
464464
this._setPadding({ right: this.effectivePaddingRight });
465465
}
466466

467-
public [paddingBottomProperty.getDefault](): number {
468-
return (this.nativeView as android.view.View).getPaddingBottom();
467+
[paddingBottomProperty.getDefault](): Length {
468+
return { value: this._defaultPaddingBottom, unit: 'px' };
469469
}
470-
public [paddingBottomProperty.setNative](value: Length) {
470+
[paddingBottomProperty.setNative](value: Length) {
471471
this._setPadding({ bottom: this.effectivePaddingBottom });
472472
}
473473

474-
public [paddingLeftProperty.getDefault](): number {
475-
return (this.nativeView as android.view.View).getPaddingLeft();
474+
[paddingLeftProperty.getDefault](): Length {
475+
return { value: this._defaultPaddingLeft, unit: 'px' };
476476
}
477-
public [paddingLeftProperty.setNative](value: Length) {
477+
[paddingLeftProperty.setNative](value: Length) {
478478
this._setPadding({ left: this.effectivePaddingLeft });
479479
}
480480

481-
// public [orientationProperty.getDefault](): Orientation {
482-
// const layoutManager = this.layoutManager;
483-
// if (layoutManager.getOrientation() === androidx.recyclerview.widget.LinearLayoutManager.HORIZONTAL) {
484-
// return 'horizontal';
485-
// }
486-
487-
// return 'vertical';
488-
// }
489-
public [orientationProperty.setNative](value: Orientation) {
481+
public [orientationProperty.getDefault](): Orientation {
482+
return 'vertical';
483+
}
484+
[orientationProperty.setNative](value: Orientation) {
490485
const layoutManager = this.layoutManager;
491486
if (!layoutManager || !layoutManager['setOrientation']) {
492487
return;
@@ -496,31 +491,46 @@ export class CollectionView extends CollectionViewBase {
496491
} else {
497492
layoutManager['setOrientation'](1);
498493
}
494+
this.updateScrollBarVisibility(this.scrollBarIndicatorVisible);
499495
}
500-
// isScrollEnabled = true;
501-
public [isScrollEnabledProperty.setNative](value: boolean) {
496+
[isScrollEnabledProperty.setNative](value: boolean) {
502497
const layoutManager = this.layoutManager;
503498
if (layoutManager && (layoutManager as any).setScrollEnabled ) {
504499
(layoutManager as any).setScrollEnabled(value);
505500
}
506501
}
507-
public [reverseLayoutProperty.setNative](value: boolean) {
508-
// this.isScrollEnabled = value;
502+
[reverseLayoutProperty.setNative](value: boolean) {
509503
const layoutManager = this.layoutManager;
510504
if (layoutManager && (layoutManager as any).setReverseLayout) {
511505
(layoutManager as any).setReverseLayout(value);
512506
// layoutManager['setStackFromEnd'](value);
513507
}
514508
}
515-
public [extraLayoutSpaceProperty.setNative](value: number) {
509+
[extraLayoutSpaceProperty.setNative](value: number) {
516510
const layoutManager = this.layoutManager;
517511
if (layoutManager && layoutManager['setExtraLayoutSpace']) {
518512
layoutManager['setExtraLayoutSpace'](value);
519513
}
520514
}
521-
public [itemViewCacheSizeProperty.setNative](value: number) {
515+
[itemViewCacheSizeProperty.setNative](value: number) {
522516
this.nativeViewProtected.setItemViewCacheSize(value);
523517
}
518+
[scrollBarIndicatorVisibleProperty.getDefault](): boolean {
519+
return true;
520+
}
521+
[scrollBarIndicatorVisibleProperty.setNative](value: boolean) {
522+
this.updateScrollBarVisibility(value);
523+
}
524+
protected updateScrollBarVisibility(value) {
525+
if (!this.nativeViewProtected) {
526+
return;
527+
}
528+
if (this.orientation === 'horizontal') {
529+
this.nativeViewProtected.setHorizontalScrollBarEnabled(value);
530+
} else {
531+
this.nativeViewProtected.setVerticalScrollBarEnabled(value);
532+
}
533+
}
524534
public startDragging(index: number) {
525535
if (this.reorderEnabled && this._itemTouchHelper) {
526536
let viewHolder: CollectionViewCellHolder;

src/collectionview.ios.ts

Lines changed: 75 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import {
2020
} from '@nativescript/core';
2121
import { Pointer } from '@nativescript/core/ui/gestures';
2222
import { layout } from '@nativescript/core/utils/utils';
23-
import { CollectionViewItemDisplayEventData, CollectionViewItemEventData, Orientation, reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty } from './collectionview';
23+
import { CollectionViewItemDisplayEventData, CollectionViewItemEventData, Orientation, reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty, scrollBarIndicatorVisibleProperty } from './collectionview';
2424
import { CLog, CLogTypes, CollectionViewBase, ListViewViewTypes, isBounceEnabledProperty, isScrollEnabledProperty, itemTemplatesProperty, orientationProperty } from './collectionview-common';
2525

2626
export * from './collectionview-common';
@@ -67,6 +67,15 @@ export class CollectionView extends CollectionViewBase {
6767
_measureCellMap: Map<string, { cell: CollectionViewCell; view: View }>;
6868
_lastLayoutKey: string;
6969

70+
reorderLongPressGesture: UILongPressGestureRecognizer;
71+
reorderLongPressHandler: ReorderLongPressImpl;
72+
reorderStartingRow = -1;
73+
reorderEndingRow = -1;
74+
75+
manualDragging = false;
76+
scrollEnabledBeforeDragging = true;
77+
draggingStartDelta: [number, number];
78+
7079
nativeViewProtected: UICollectionView;
7180

7281
constructor() {
@@ -157,54 +166,6 @@ export class CollectionView extends CollectionViewBase {
157166

158167
return result;
159168
}
160-
public [contentInsetAdjustmentBehaviorProperty.setNative](value: ContentInsetAdjustmentBehavior) {
161-
this.nativeViewProtected.contentInsetAdjustmentBehavior = value as any;
162-
}
163-
164-
public [paddingTopProperty.setNative](value: Length) {
165-
this._setPadding({ top: layout.toDeviceIndependentPixels(this.effectivePaddingTop) });
166-
}
167-
168-
public [paddingRightProperty.setNative](value: Length) {
169-
this._setPadding({ right: layout.toDeviceIndependentPixels(this.effectivePaddingRight) });
170-
}
171-
172-
public [paddingBottomProperty.setNative](value: Length) {
173-
this._setPadding({ bottom: layout.toDeviceIndependentPixels(this.effectivePaddingBottom) });
174-
}
175-
176-
public [paddingLeftProperty.setNative](value: Length) {
177-
this._setPadding({ left: layout.toDeviceIndependentPixels(this.effectivePaddingLeft) });
178-
}
179-
180-
public [orientationProperty.setNative](value: Orientation) {
181-
const layout = this._layout;
182-
if (layout instanceof UICollectionViewFlowLayout) {
183-
if (value === 'horizontal') {
184-
layout.scrollDirection = UICollectionViewScrollDirection.Horizontal;
185-
} else {
186-
layout.scrollDirection = UICollectionViewScrollDirection.Vertical;
187-
}
188-
}
189-
}
190-
public [isScrollEnabledProperty.setNative](value: boolean) {
191-
this.nativeViewProtected.scrollEnabled = value;
192-
this.scrollEnabledBeforeDragging = value;
193-
}
194-
public [isBounceEnabledProperty.setNative](value: boolean) {
195-
this.nativeViewProtected.bounces = value;
196-
// this.nativeViewProtected.alwaysBounceHorizontal = value;
197-
}
198-
199-
public [itemTemplatesProperty.getDefault](): KeyedTemplate[] {
200-
return null;
201-
}
202-
public [reverseLayoutProperty.setNative](value: boolean) {
203-
this.nativeViewProtected.transform = value ? CGAffineTransformMakeRotation(-Math.PI) : null;
204-
}
205-
manualDragging = false;
206-
scrollEnabledBeforeDragging = true;
207-
draggingStartDelta: [number, number];
208169
public startDragging(index: number, pointer?: Pointer) {
209170
if (this.reorderEnabled && this.nativeViewProtected) {
210171
this.manualDragging = true;
@@ -264,10 +225,6 @@ export class CollectionView extends CollectionViewBase {
264225
this.reorderEndingRow = -1;
265226
this.reorderEndingRow = -1;
266227
}
267-
reorderLongPressGesture: UILongPressGestureRecognizer;
268-
reorderLongPressHandler: ReorderLongPressImpl;
269-
reorderStartingRow = -1;
270-
reorderEndingRow = -1;
271228
onReorderLongPress(gesture: UILongPressGestureRecognizer) {
272229
const collectionView = this.nativeViewProtected;
273230
if (!collectionView) {
@@ -291,7 +248,54 @@ export class CollectionView extends CollectionViewBase {
291248
break;
292249
}
293250
}
294-
public [reorderLongPressEnabledProperty.setNative](value: boolean) {
251+
252+
[contentInsetAdjustmentBehaviorProperty.setNative](value: ContentInsetAdjustmentBehavior) {
253+
this.nativeViewProtected.contentInsetAdjustmentBehavior = value as any;
254+
}
255+
256+
[paddingTopProperty.setNative](value: Length) {
257+
this._setPadding({ top: layout.toDeviceIndependentPixels(this.effectivePaddingTop) });
258+
}
259+
260+
[paddingRightProperty.setNative](value: Length) {
261+
this._setPadding({ right: layout.toDeviceIndependentPixels(this.effectivePaddingRight) });
262+
}
263+
264+
[paddingBottomProperty.setNative](value: Length) {
265+
this._setPadding({ bottom: layout.toDeviceIndependentPixels(this.effectivePaddingBottom) });
266+
}
267+
268+
[paddingLeftProperty.setNative](value: Length) {
269+
this._setPadding({ left: layout.toDeviceIndependentPixels(this.effectivePaddingLeft) });
270+
}
271+
272+
[orientationProperty.setNative](value: Orientation) {
273+
const layout = this._layout;
274+
if (layout instanceof UICollectionViewFlowLayout) {
275+
if (value === 'horizontal') {
276+
layout.scrollDirection = UICollectionViewScrollDirection.Horizontal;
277+
} else {
278+
layout.scrollDirection = UICollectionViewScrollDirection.Vertical;
279+
}
280+
}
281+
this.updateScrollBarVisibility(this.scrollBarIndicatorVisible);
282+
}
283+
[isScrollEnabledProperty.setNative](value: boolean) {
284+
this.nativeViewProtected.scrollEnabled = value;
285+
this.scrollEnabledBeforeDragging = value;
286+
}
287+
[isBounceEnabledProperty.setNative](value: boolean) {
288+
this.nativeViewProtected.bounces = value;
289+
// this.nativeViewProtected.alwaysBounceHorizontal = value;
290+
}
291+
292+
[itemTemplatesProperty.getDefault](): KeyedTemplate[] {
293+
return null;
294+
}
295+
[reverseLayoutProperty.setNative](value: boolean) {
296+
this.nativeViewProtected.transform = value ? CGAffineTransformMakeRotation(-Math.PI) : null;
297+
}
298+
[reorderLongPressEnabledProperty.setNative](value: boolean) {
295299
if (value) {
296300
if (!this.reorderLongPressGesture) {
297301
this.reorderLongPressHandler = ReorderLongPressImpl.initWithOwner(new WeakRef(this));
@@ -307,13 +311,29 @@ export class CollectionView extends CollectionViewBase {
307311
}
308312

309313
}
310-
public [reorderingEnabledProperty.setNative](value: boolean) {
314+
[reorderingEnabledProperty.setNative](value: boolean) {
311315
if (value) {
312316
this.on('touch', this.onReorderingTouch, this);
313317
} else {
314318
this.off('touch', this.onReorderingTouch, this);
315319
}
316320
}
321+
[scrollBarIndicatorVisibleProperty.getDefault](): boolean {
322+
return true;
323+
}
324+
[scrollBarIndicatorVisibleProperty.setNative](value: boolean) {
325+
this.updateScrollBarVisibility(value);
326+
}
327+
protected updateScrollBarVisibility(value) {
328+
if (!this.nativeViewProtected) {
329+
return;
330+
}
331+
if (this.orientation === 'horizontal') {
332+
this.nativeViewProtected.showsHorizontalScrollIndicator = value;
333+
} else {
334+
this.nativeViewProtected.showsVerticalScrollIndicator = value;
335+
}
336+
}
317337
public eachChildView(callback: (child: View) => boolean): void {
318338
this._map.forEach((view, key) => {
319339
callback(view);

0 commit comments

Comments
 (0)