@nstudio/ui-collectionview 4.0.70 → 5.0.5

package/index.ios.js

@@ -1,5 +1,6 @@
 import { ChangeType, ContentView, Observable, Property, ProxyViewContainer, Trace, Utils, View, paddingBottomProperty, paddingLeftProperty, paddingRightProperty, paddingTopProperty, profile } from '@nativescript/core';
-import { CLog, CLogTypes, CollectionViewBase, ListViewViewTypes, isBounceEnabledProperty, isScrollEnabledProperty, itemTemplatesProperty, orientationProperty, reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty, scrollBarIndicatorVisibleProperty } from './common';
+import { reorderLongPressEnabledProperty, reorderingEnabledProperty, reverseLayoutProperty, scrollBarIndicatorVisibleProperty } from '.';
+import { CLog, CLogTypes, CollectionViewBase, ListViewViewTypes, isBounceEnabledProperty, isScrollEnabledProperty, itemTemplatesProperty, orientationProperty } from './common';
 export * from './common';
 const infinity = Utils.layout.makeMeasureSpec(0, Utils.layout.UNSPECIFIED);
 export var ContentInsetAdjustmentBehavior;
@@ -43,11 +44,7 @@ export class CollectionView extends CollectionViewBase {
         this.needsScrollStartEvent = false;
         this.isScrolling = false;
         this._map = new Map();
-        this._sizes = new Array();
-    }
-    // @ts-ignore
-    get ios() {
-        return this.nativeViewProtected;
+        // this._sizes = new Array<number[]>();
     }
     createNativeView() {
         let layout;
@@ -73,35 +70,27 @@ export class CollectionView extends CollectionViewBase {
     }
     onTemplateAdded(t) {
         super.onTemplateAdded(t);
-        if (this.ios) {
-            this.ios.registerClassForCellWithReuseIdentifier(CollectionViewCell.class(), t.key.toLowerCase());
+        if (this.nativeViewProtected) {
+            this.nativeViewProtected.registerClassForCellWithReuseIdentifier(CollectionViewCell.class(), t.key.toLowerCase());
         }
     }
     initNativeView() {
         super.initNativeView();
+        const nativeView = this.nativeView;
         this._dataSource = CollectionViewDataSource.initWithOwner(this);
-        this.ios.dataSource = this._dataSource;
-        const layoutStyle = CollectionViewBase.layoutStyles[this.layoutStyle];
-        if (layoutStyle && layoutStyle.createDelegate) {
-            this._delegate = layoutStyle.createDelegate();
-        }
-        else {
-            this._delegate = UICollectionViewDelegateImpl.initWithOwner(this);
-        }
-        this._delegate._owner = new WeakRef(this);
+        nativeView.dataSource = this._dataSource;
+        // delegate will be set in first onLayout because we need computed _effectiveColWidth and _effectiveRowHeight
         this._measureCellMap = new Map();
-        this.ios.delegate = this._delegate;
         this._setNativeClipToBounds();
     }
     disposeNativeView() {
         if (Trace.isEnabled()) {
             CLog(CLogTypes.log, 'disposeNativeView');
         }
-        if (this.ios) {
-            this.ios.delegate = null;
-            this.ios.dataSource = null;
-        }
+        const nativeView = this.nativeView;
+        nativeView.delegate = null;
         this._delegate = null;
+        nativeView.dataSource = null;
         this._dataSource = null;
         this._layout = null;
         this.reorderLongPressHandler = null;
@@ -132,14 +121,14 @@ export class CollectionView extends CollectionViewBase {
     }
     getViewForItemAtIndex(index) {
         let result;
-        if (this.ios) {
-            const cell = this.ios.cellForItemAtIndexPath(NSIndexPath.indexPathForRowInSection(index, 0));
+        if (this.nativeViewProtected) {
+            const cell = this.nativeViewProtected.cellForItemAtIndexPath(NSIndexPath.indexPathForRowInSection(index, 0));
             return cell?.view;
         }
         return result;
     }
     startDragging(index, pointer) {
-        if (this.reorderEnabled && this.ios) {
+        if (this.reorderEnabled && this.nativeViewProtected) {
             this.manualDragging = true;
             this.draggingStartDelta = null;
             if (pointer) {
@@ -150,15 +139,16 @@ export class CollectionView extends CollectionViewBase {
                     this.draggingStartDelta = [point.x - size.width / 2, point.y - size.height / 2];
                 }
             }
-            this.ios.beginInteractiveMovementForItemAtIndexPath(NSIndexPath.indexPathForRowInSection(index, 0));
+            this.nativeViewProtected.beginInteractiveMovementForItemAtIndexPath(NSIndexPath.indexPathForRowInSection(index, 0));
             this.scrollEnabledBeforeDragging = this.isScrollEnabled;
-            this.ios.scrollEnabled = false;
+            this.nativeViewProtected.scrollEnabled = false;
         }
     }
     onReorderingTouch(event) {
         if (!this.manualDragging) {
             return;
         }
+        const collectionView = this.nativeViewProtected;
         const pointer = event.getActivePointers()[0];
         switch (event.action) {
             case 'move':
@@ -168,24 +158,18 @@ export class CollectionView extends CollectionViewBase {
                     x -= this.draggingStartDelta[0];
                     y -= this.draggingStartDelta[1];
                 }
-                if (this.ios) {
-                    this.ios.updateInteractiveMovementTargetPosition(CGPointMake(x, y));
-                }
+                collectionView.updateInteractiveMovementTargetPosition(CGPointMake(x, y));
                 break;
             case 'up':
                 this.manualDragging = false;
-                if (this.ios) {
-                    this.ios.endInteractiveMovement();
-                    this.ios.scrollEnabled = this.scrollEnabledBeforeDragging;
-                }
+                collectionView && collectionView.endInteractiveMovement();
+                this.nativeViewProtected.scrollEnabled = this.scrollEnabledBeforeDragging;
                 this.handleReorderEnd();
                 break;
             case 'cancel':
                 this.manualDragging = false;
-                if (this.ios) {
-                    this.ios.cancelInteractiveMovement();
-                    this.ios.scrollEnabled = this.scrollEnabledBeforeDragging;
-                }
+                collectionView && collectionView.cancelInteractiveMovement();
+                this.nativeViewProtected.scrollEnabled = this.scrollEnabledBeforeDragging;
                 this.handleReorderEnd();
                 break;
         }
@@ -203,31 +187,30 @@ export class CollectionView extends CollectionViewBase {
         this.reorderEndingRow = -1;
     }
     onReorderLongPress(gesture) {
-        if (!this.ios) {
+        const collectionView = this.nativeViewProtected;
+        if (!collectionView) {
             return;
         }
         switch (gesture.state) {
             case 1 /* UIGestureRecognizerState.Began */:
-                const selectedIndexPath = this.ios.indexPathForItemAtPoint(gesture.locationInView(this.ios));
-                this.ios.beginInteractiveMovementForItemAtIndexPath(selectedIndexPath);
+                const selectedIndexPath = collectionView.indexPathForItemAtPoint(gesture.locationInView(collectionView));
+                collectionView.beginInteractiveMovementForItemAtIndexPath(selectedIndexPath);
                 break;
             case 2 /* UIGestureRecognizerState.Changed */:
-                this.ios.updateInteractiveMovementTargetPosition(gesture.locationInView(this.ios));
+                collectionView.updateInteractiveMovementTargetPosition(gesture.locationInView(collectionView));
                 break;
             case 3 /* UIGestureRecognizerState.Ended */:
-                this.ios.endInteractiveMovement();
+                collectionView.endInteractiveMovement();
                 this.handleReorderEnd();
                 break;
             default:
-                this.ios.cancelInteractiveMovement();
+                collectionView.cancelInteractiveMovement();
                 this.handleReorderEnd();
                 break;
         }
     }
     [contentInsetAdjustmentBehaviorProperty.setNative](value) {
-        if (this.ios) {
-            this.ios.contentInsetAdjustmentBehavior = value;
-        }
+        this.nativeViewProtected.contentInsetAdjustmentBehavior = value;
     }
     [paddingTopProperty.setNative](value) {
         this._setPadding({ top: Utils.layout.toDeviceIndependentPixels(this.effectivePaddingTop) });
@@ -254,33 +237,25 @@ export class CollectionView extends CollectionViewBase {
         this.updateScrollBarVisibility(this.scrollBarIndicatorVisible);
     }
     [isScrollEnabledProperty.setNative](value) {
-        if (this.ios) {
-            this.ios.scrollEnabled = value;
-        }
+        this.nativeViewProtected.scrollEnabled = value;
         this.scrollEnabledBeforeDragging = value;
     }
     [isBounceEnabledProperty.setNative](value) {
-        if (this.ios) {
-            this.ios.bounces = value;
-            // this.ios.alwaysBounceHorizontal = value;
-        }
+        this.nativeViewProtected.bounces = value;
+        // this.nativeViewProtected.alwaysBounceHorizontal = value;
     }
     [itemTemplatesProperty.getDefault]() {
         return null;
     }
     [reverseLayoutProperty.setNative](value) {
-        if (this.ios) {
-            this.ios.transform = value ? CGAffineTransformMakeRotation(-Math.PI) : null;
-        }
+        this.nativeViewProtected.transform = value ? CGAffineTransformMakeRotation(-Math.PI) : null;
     }
     [reorderLongPressEnabledProperty.setNative](value) {
         if (value) {
             if (!this.reorderLongPressGesture) {
                 this.reorderLongPressHandler = ReorderLongPressImpl.initWithOwner(new WeakRef(this));
                 this.reorderLongPressGesture = UILongPressGestureRecognizer.alloc().initWithTargetAction(this.reorderLongPressHandler, 'longPress');
-                if (this.ios) {
-                    this.ios.addGestureRecognizer(this.reorderLongPressGesture);
-                }
+                this.nativeViewProtected.addGestureRecognizer(this.reorderLongPressGesture);
             }
             else {
                 this.reorderLongPressGesture.enabled = true;
@@ -307,14 +282,14 @@ export class CollectionView extends CollectionViewBase {
         this.updateScrollBarVisibility(value);
     }
     updateScrollBarVisibility(value) {
-        if (!this.ios) {
+        if (!this.nativeViewProtected) {
             return;
         }
         if (this.orientation === 'horizontal') {
-            this.ios.showsHorizontalScrollIndicator = value;
+            this.nativeViewProtected.showsHorizontalScrollIndicator = value;
         }
         else {
-            this.ios.showsVerticalScrollIndicator = value;
+            this.nativeViewProtected.showsVerticalScrollIndicator = value;
         }
     }
     eachChildView(callback) {
@@ -332,13 +307,36 @@ export class CollectionView extends CollectionViewBase {
             const p = CollectionViewBase.plugins[k];
             p.onLayout && p.onLayout(this, left, top, right, bottom);
         });
-        const layoutView = this.ios?.collectionViewLayout;
+        const layoutView = this.nativeViewProtected.collectionViewLayout;
         if (!layoutView) {
             return;
         }
-        if ((layoutView instanceof UICollectionViewFlowLayout && this._effectiveColWidth) || this._effectiveRowHeight) {
-            // @ts-ignore
-            layoutView.estimatedItemSize = layoutView.itemSize = CGSizeMake(Utils.layout.toDeviceIndependentPixels(this._effectiveColWidth), Utils.layout.toDeviceIndependentPixels(this._effectiveRowHeight));
+        if (!this._delegate) {
+            const layoutStyle = CollectionViewBase.layoutStyles[this.layoutStyle];
+            if (layoutStyle && layoutStyle.createDelegate) {
+                this._delegate = layoutStyle.createDelegate(this);
+            }
+            else {
+                // if we use fixed col and row size we want a delegate
+                // without collectionViewLayoutSizeForItemAtIndexPath
+                // because it is not needed and faster
+                if (this._effectiveColWidth && this._effectiveRowHeight) {
+                    this._delegate = UICollectionViewDelegateFixedSizeImpl.initWithOwner(this);
+                }
+                else {
+                    this._delegate = UICollectionViewDelegateImpl.initWithOwner(this);
+                }
+            }
+            // this._delegate._owner = new WeakRef(this);
+            this.nativeViewProtected.delegate = this._delegate;
+        }
+        if (layoutView instanceof UICollectionViewFlowLayout) {
+            if (this._effectiveRowHeight && this._effectiveColWidth) {
+                layoutView.itemSize = CGSizeMake(Utils.layout.toDeviceIndependentPixels(this._effectiveColWidth), Utils.layout.toDeviceIndependentPixels(this._effectiveRowHeight));
+            }
+            else {
+                layoutView.estimatedItemSize = CGSizeMake(Utils.layout.toDeviceIndependentPixels(this._effectiveColWidth), Utils.layout.toDeviceIndependentPixels(this._effectiveRowHeight));
+            }
         }
         layoutView.invalidateLayout();
         // there is no need to call refresh if it was triggered before with same size.
@@ -352,99 +350,111 @@ export class CollectionView extends CollectionViewBase {
         return this.orientation === 'horizontal';
     }
     onSourceCollectionChanged(event) {
-        if (!this.ios || this._dataUpdatesSuspended) {
+        const view = this.nativeViewProtected;
+        if (!view || this._dataUpdatesSuspended || !this._lastLayoutKey) {
             return;
         }
         if (Trace.isEnabled()) {
             CLog(CLogTypes.log, 'onItemsChanged', ChangeType.Update, event.action, event.index, event.addedCount, event.removed && event.removed.length);
         }
         // we need to clear stored cell sizes and it wont be correct anymore
-        this.clearCellSize();
+        // this.clearCellSize();
+        const sizes = this._delegate instanceof UICollectionViewDelegateImpl ? this._delegate.cachedSizes : null;
         switch (event.action) {
             case ChangeType.Delete: {
                 const indexes = NSMutableArray.new();
                 for (let index = 0; index < event.addedCount; index++) {
                     indexes.addObject(NSIndexPath.indexPathForRowInSection(event.index + index, 0));
+                    if (sizes) {
+                        sizes.removeObjectAtIndex(event.index);
+                    }
                 }
+                // this._sizes.splice(event.index, event.addedCount);
                 this.unbindUnusedCells(event.removed);
                 if (Trace.isEnabled()) {
                     CLog(CLogTypes.info, 'deleteItemsAtIndexPaths', indexes.count);
                 }
-                this.ios.performBatchUpdatesCompletion(() => {
-                    if (this.ios) {
-                        this.ios.deleteItemsAtIndexPaths(indexes);
-                    }
+                view.performBatchUpdatesCompletion(() => {
+                    view.deleteItemsAtIndexPaths(indexes);
                 }, null);
                 return;
             }
             case ChangeType.Update: {
                 const indexes = NSMutableArray.new();
                 indexes.addObject(NSIndexPath.indexPathForRowInSection(event.index, 0));
+                if (sizes) {
+                    sizes.replaceObjectAtIndexWithObject(event.index, NSValue.valueWithCGSize(CGSizeZero));
+                }
+                // this._sizes[event.index] = null;
                 if (Trace.isEnabled()) {
                     CLog(CLogTypes.info, 'reloadItemsAtIndexPaths', event.index, indexes.count);
                 }
-                UIView.performWithoutAnimation(() => {
-                    this.ios.performBatchUpdatesCompletion(() => {
-                        if (this.ios) {
-                            this.ios.reloadItemsAtIndexPaths(indexes);
-                        }
-                    }, null);
-                });
+                view.performBatchUpdatesCompletion(() => {
+                    view.reloadItemsAtIndexPaths(indexes);
+                }, null);
                 return;
             }
             case ChangeType.Add: {
                 const indexes = NSMutableArray.new();
                 for (let index = 0; index < event.addedCount; index++) {
                     indexes.addObject(NSIndexPath.indexPathForRowInSection(event.index + index, 0));
+                    if (sizes) {
+                        sizes.insertObjectAtIndex(NSValue.valueWithCGSize(CGSizeZero), event.index);
+                    }
+                    // this._sizes.splice(index, 0, null);
                 }
                 if (Trace.isEnabled()) {
                     CLog(CLogTypes.info, 'insertItemsAtIndexPaths', indexes.count);
                 }
-                this.ios.performBatchUpdatesCompletion(() => {
-                    if (this.ios) {
-                        this.ios.insertItemsAtIndexPaths(indexes);
-                    }
+                view.performBatchUpdatesCompletion(() => {
+                    view.insertItemsAtIndexPaths(indexes);
                 }, null);
                 return;
             }
             case ChangeType.Splice: {
-                this.ios.performBatchUpdatesCompletion(() => {
-                    if (!this.ios) {
-                        return;
-                    }
+                view.performBatchUpdatesCompletion(() => {
                     const added = event.addedCount;
                     const removed = (event.removed && event.removed.length) || 0;
                     if (added > 0 && added === removed) {
                         const indexes = NSMutableArray.new();
                         for (let index = 0; index < added; index++) {
                             indexes.addObject(NSIndexPath.indexPathForRowInSection(event.index + index, 0));
+                            if (sizes) {
+                                sizes.replaceObjectAtIndexWithObject(event.index + index, NSValue.valueWithCGSize(CGSizeZero));
+                            }
+                            // this._sizes[event.index + index] = null;
                         }
-                        this.ios.reloadItemsAtIndexPaths(indexes);
+                        view.reloadItemsAtIndexPaths(indexes);
                     }
                     else {
                         if (event.addedCount > 0) {
                             const indexes = NSMutableArray.alloc().init();
                             for (let index = 0; index < event.addedCount; index++) {
                                 indexes.addObject(NSIndexPath.indexPathForItemInSection(event.index + index, 0));
+                                if (sizes) {
+                                    sizes.insertObjectAtIndex(NSValue.valueWithCGSize(CGSizeZero), event.index);
+                                }
+                                // this._sizes.splice(event.index, 0, null);
                             }
-                            this.ios.insertItemsAtIndexPaths(indexes);
+                            view.insertItemsAtIndexPaths(indexes);
                         }
                         if (event.removed && event.removed.length > 0) {
                             const indexes = NSMutableArray.new();
                             for (let index = 0; index < event.removed.length; index++) {
                                 indexes.addObject(NSIndexPath.indexPathForItemInSection(event.index + index, 0));
+                                if (sizes) {
+                                    sizes.removeObjectAtIndex(event.index);
+                                }
                             }
+                            // this._sizes.splice(event.index, event.removed.length);
                             this.unbindUnusedCells(event.removed);
                             if (Trace.isEnabled()) {
                                 CLog(CLogTypes.info, 'deleteItemsAtIndexPaths', indexes.count);
                             }
-                            this.ios.performBatchUpdatesCompletion(() => {
-                                if (this.ios) {
-                                    this.ios.deleteItemsAtIndexPaths(indexes);
-                                }
-                            }, null);
+                            view.deleteItemsAtIndexPaths(indexes);
                         }
                     }
+                    // view.collectionViewLayout.invalidateLayout();
                 }, null);
                 return;
             }
@@ -453,13 +463,12 @@ export class CollectionView extends CollectionViewBase {
     }
     onItemTemplatesChanged(oldValue, newValue) {
         super.onItemTemplatesChanged(oldValue, newValue);
-        if (!this.ios) {
+        if (!this.nativeViewProtected) {
             return;
         }
+        const view = this.nativeViewProtected;
         this._itemTemplatesInternal.forEach((t) => {
-            if (this.ios) {
-                this.ios.registerClassForCellWithReuseIdentifier(CollectionViewCell.class(), t.key.toLowerCase());
-            }
+            view.registerClassForCellWithReuseIdentifier(CollectionViewCell.class(), t.key.toLowerCase());
         });
     }
     unbindUnusedCells(removedDataItems) {
@@ -473,27 +482,34 @@ export class CollectionView extends CollectionViewBase {
         }, this);
     }
     refreshVisibleItems() {
-        if (!this.ios) {
+        const view = this.nativeViewProtected;
+        if (!view) {
             return;
         }
-        const visibles = this.ios.indexPathsForVisibleItems;
+        const sizes = this._delegate instanceof UICollectionViewDelegateImpl ? this._delegate.cachedSizes : null;
+        const visibles = view.indexPathsForVisibleItems;
+        if (sizes?.count) {
+            const indexes = Array.from(visibles);
+            indexes.forEach((value) => {
+                sizes.replaceObjectAtIndexWithObject(value.row, NSValue.valueWithCGSize(CGSizeZero));
+            });
+        }
         UIView.performWithoutAnimation(() => {
-            this.ios.performBatchUpdatesCompletion(() => {
-                if (this.ios) {
-                    this.ios.reloadItemsAtIndexPaths(visibles);
-                }
+            view.performBatchUpdatesCompletion(() => {
+                view.reloadItemsAtIndexPaths(visibles);
             }, null);
         });
     }
     isItemAtIndexVisible(itemIndex) {
-        if (!this.ios) {
+        const view = this.nativeViewProtected;
+        if (!view) {
             return false;
         }
-        const indexes = Array.from(this.ios.indexPathsForVisibleItems);
+        const indexes = Array.from(view.indexPathsForVisibleItems);
         return indexes.some((visIndex) => visIndex.row === itemIndex);
     }
     refresh() {
-        if (!this.isLoaded || !this.ios) {
+        if (!this.isLoaded || !this.nativeView) {
             this._isDataDirty = true;
             return;
         }
@@ -503,7 +519,11 @@ export class CollectionView extends CollectionViewBase {
             CLog(CLogTypes.info, 'refresh');
         }
         // we need to clear stored cell sizes and it wont be correct anymore
-        this.clearCellSize();
+        // this.clearCellSize();
+        const sizes = this._delegate instanceof UICollectionViewDelegateImpl ? this._delegate.cachedSizes : null;
+        if (sizes) {
+            sizes.removeAllObjects();
+        }
         // clear bindingContext when it is not observable because otherwise bindings to items won't reevaluate
         this._map.forEach((view, nativeView, map) => {
             if (!(view.bindingContext instanceof Observable)) {
@@ -513,7 +533,7 @@ export class CollectionView extends CollectionViewBase {
         // TODO: this is ugly look here: https://github.com/nativescript-vue/nativescript-vue/issues/525
         // this.clearRealizedCells();
         // dispatch_async(main_queue, () => {
-        this.ios.reloadData();
+        this.nativeViewProtected.reloadData();
         // });
         const args = {
             eventName: CollectionViewBase.dataPopulatedEvent,
@@ -523,18 +543,17 @@ export class CollectionView extends CollectionViewBase {
     }
     //@ts-ignore
     get scrollOffset() {
-        return (this.isHorizontal() ? this.ios?.contentOffset.x : this.ios?.contentOffset.y) || 0;
+        const view = this.nativeViewProtected;
+        return (this.isHorizontal() ? view?.contentOffset.x : view?.contentOffset.y) || 0;
     }
     get verticalOffsetX() {
-        return this.ios?.contentOffset.x || 0;
+        return this.nativeViewProtected?.contentOffset.x || 0;
     }
     get verticalOffsetY() {
-        return this.ios?.contentOffset.y || 0;
+        return this.nativeViewProtected?.contentOffset.y || 0;
     }
     scrollToIndex(index, animated = true) {
-        if (this.ios) {
-            this.ios.scrollToItemAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), this.orientation === 'vertical' ? 1 /* UICollectionViewScrollPosition.Top */ : 8 /* UICollectionViewScrollPosition.Left */, animated);
-        }
+        this.nativeViewProtected.scrollToItemAtIndexPathAtScrollPositionAnimated(NSIndexPath.indexPathForItemInSection(index, 0), this.orientation === 'vertical' ? 1 /* UICollectionViewScrollPosition.Top */ : 8 /* UICollectionViewScrollPosition.Left */, animated);
     }
     requestLayout() {
         // When preparing cell don't call super - no need to invalidate our measure when cell desiredSize is changed.
@@ -543,9 +562,7 @@ export class CollectionView extends CollectionViewBase {
         }
     }
     _setNativeClipToBounds() {
-        if (this.ios) {
-            this.ios.clipsToBounds = true;
-        }
+        this.nativeView.clipsToBounds = true;
     }
     notifyForItemAtIndex(listView, cell, view, eventName, indexPath, bindingContext) {
         const args = { eventName, object: listView, index: indexPath.row, view, ios: cell, bindingContext };
@@ -556,7 +573,7 @@ export class CollectionView extends CollectionViewBase {
         const selector = this._itemTemplateSelector;
         let type = this._defaultTemplate.key;
         if (selector) {
-            type = selector(this.getItemAtIndex(indexPath.item), indexPath.item, this.items);
+            type = selector.call(this, this.getItemAtIndex(indexPath.item), indexPath.item, this.items);
         }
         return type.toLowerCase();
     }
@@ -578,6 +595,7 @@ export class CollectionView extends CollectionViewBase {
             }
             const args = this.notifyForItemAtIndex(this, cell, view, CollectionViewBase.itemLoadingEvent, indexPath, bindingContext);
             view = args.view;
+            view.bindingContext = bindingContext;
             if (view instanceof ProxyViewContainer) {
                 const sp = new ContentView();
                 sp.content = view;
@@ -591,30 +609,38 @@ export class CollectionView extends CollectionViewBase {
                 cell.view.nativeViewProtected.removeFromSuperview();
                 cell.owner = new WeakRef(view);
             }
+            cell.currentIndex = indexPath.row;
             if (notForCellSizeComp) {
                 this._map.set(cell, view);
             }
             if (view && !view.parent) {
                 this._addView(view);
                 const innerView = NSCellView.new();
+                innerView.autoresizingMask = 2 /* UIViewAutoresizing.FlexibleWidth */ | 16 /* UIViewAutoresizing.FlexibleHeight */;
                 innerView.view = new WeakRef(view);
-                if (!notForCellSizeComp || this.autoReloadItemOnLayout) {
+                if (notForCellSizeComp && this.autoReloadItemOnLayout) {
                     // for a cell to update correctly on cell layout change we need
                     // to do it ourself instead of "propagating it"
                     view['performLayout'] = () => {
-                        if (notForCellSizeComp) {
-                            this.measureCell(cell, view, indexPath);
-                            this.layoutCell(indexPath.row, cell, view);
-                            if (this.ios) {
-                                this.ios.collectionViewLayout.invalidateLayout();
+                        if (!this._preparingCell) {
+                            const index = cell.currentIndex;
+                            const nativeView = this.nativeViewProtected;
+                            const sizes = this._delegate instanceof UICollectionViewDelegateImpl ? this._delegate.cachedSizes : null;
+                            if (sizes) {
+                                sizes.replaceObjectAtIndexWithObject(index, NSValue.valueWithCGSize(CGSizeZero));
                             }
+                            nativeView.performBatchUpdatesCompletion(() => {
+                                this.measureCell(cell, view, index);
+                                this.notifyForItemAtIndex(this, cell, view, CollectionViewBase.itemLoadingEvent, indexPath, view.bindingContext);
+                            }, null);
+                            nativeView.collectionViewLayout.invalidateLayout();
                         }
                     };
                 }
                 innerView.addSubview(view.nativeViewProtected);
                 cell.contentView.addSubview(innerView);
             }
-            cellSize = this.measureCell(cell, view, indexPath);
+            cellSize = this.measureCell(cell, view, indexPath.row);
             if (notForCellSizeComp) {
                 view.notify({ eventName: CollectionViewBase.bindedEvent });
             }
@@ -628,7 +654,8 @@ export class CollectionView extends CollectionViewBase {
         return cellSize;
     }
     getCellSize(index) {
-        let result = this._sizes[index];
+        // let result = this._sizes[index];
+        let result;
         // CLog(CLogTypes.log, 'getCellSize', index, result, this._effectiveColWidth, this._effectiveRowHeight, this.getMeasuredWidth(), this.getMeasuredHeight());
         if (!result) {
             let width = this._effectiveColWidth;
@@ -657,19 +684,18 @@ export class CollectionView extends CollectionViewBase {
         // return undefined;
         return result;
     }
-    storeCellSize(index, value) {
-        this._sizes[index] = value;
-    }
-    clearCellSize() {
-        this._sizes = new Array();
-    }
-    measureCell(cell, cellView, index) {
+    // public storeCellSize(index: number, value) {
+    //     this._sizes[index] = value;
+    // }
+    // public clearCellSize() {
+    //     this._sizes = new Array<number[]>();
+    // }
+    measureCell(cell, cellView, position) {
         if (cellView) {
             let width = this._effectiveColWidth;
             let height = this._effectiveRowHeight;
             const horizontal = this.isHorizontal();
             if (this.spanSize) {
-                const position = index.row;
                 const dataItem = this.getItemAtIndex(position);
                 const spanSize = this.spanSize(dataItem, position);
                 if (horizontal) {
@@ -690,19 +716,20 @@ export class CollectionView extends CollectionViewBase {
                     ? Utils.layout.makeMeasureSpec(this._innerHeight, Utils.layout.UNSPECIFIED)
                     : infinity;
             if (Trace.isEnabled()) {
-                CLog(CLogTypes.log, 'measureCell', index.row, width, height, widthMeasureSpec, heightMeasureSpec);
+                CLog(CLogTypes.log, 'measureCell', position, width, height, widthMeasureSpec, heightMeasureSpec);
             }
             const measuredSize = View.measureChild(this, cellView, widthMeasureSpec, heightMeasureSpec);
             const result = [measuredSize.measuredWidth, measuredSize.measuredHeight];
-            this.storeCellSize(index.row, result);
+            // this.storeCellSize(index.row, result);
             return result;
         }
         return undefined;
     }
     layoutCell(index, cell, cellView) {
-        const cellSize = this.getCellSize(index);
+        // const cellSize = this.getCellSize(index);
         cellView['iosIgnoreSafeArea'] = true;
-        View.layoutChild(this, cellView, 0, 0, cellSize[0], cellSize[1]);
+        const size = cell.bounds.size;
+        View.layoutChild(this, cellView, 0, 0, Utils.layout.toDevicePixels(size.width), Utils.layout.toDevicePixels(size.height));
         if (Trace.isEnabled()) {
             CLog(CLogTypes.log, 'layoutCell', index, cellView.getMeasuredWidth(), cellView.getMeasuredHeight());
         }
@@ -759,6 +786,7 @@ export class CollectionView extends CollectionViewBase {
     collectionViewCellForItemAtIndexPath(collectionView, indexPath) {
         const templateType = this._getItemTemplateType(indexPath);
         let cell = collectionView.dequeueReusableCellWithReuseIdentifierForIndexPath(templateType, indexPath);
+        const firstRender = !cell.view;
         if (!cell) {
             cell = CollectionViewCell.new();
         }
@@ -766,8 +794,9 @@ export class CollectionView extends CollectionViewBase {
             CLog(CLogTypes.log, 'collectionViewCellForItemAtIndexPath', indexPath.row, templateType, !!cell.view, cell);
         }
         this._prepareCell(cell, indexPath, templateType);
+        // the cell layout will be called from NSCellView layoutSubviews
         const cellView = cell.view;
-        if (cellView['isLayoutRequired']) {
+        if (!firstRender && cellView['isLayoutRequired']) {
             this.layoutCell(indexPath.row, cell, cellView);
         }
         return cell;
@@ -785,14 +814,13 @@ export class CollectionView extends CollectionViewBase {
                 });
             }
         }
-        if (this.hasListeners(CollectionViewBase.displayItemEvent)) {
-            this.notify({
-                eventName: CollectionViewBase.displayItemEvent,
-                index: indexPath.row,
-                object: this,
-                cell,
-            });
-        }
+        // if (this.hasListeners(CollectionViewBase.displayItemEvent) ) {
+        //     this.notify<CollectionViewItemDisplayEventData>({
+        //         eventName: CollectionViewBase.displayItemEvent,
+        //         index:indexPath.row,
+        //         object: this,
+        //     });
+        // }
         if (cell.preservesSuperviewLayoutMargins) {
             cell.preservesSuperviewLayoutMargins = false;
         }
@@ -956,6 +984,15 @@ var CollectionViewCell = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
+    CollectionViewCell.prototype.systemLayoutSizeFittingSizeWithHorizontalFittingPriorityVerticalFittingPriority = function (targetSize, horizontalFittingPriority, verticalFittingPriority) {
+        var _a;
+        var owner = (_a = this.owner) === null || _a === void 0 ? void 0 : _a.deref();
+        if (owner) {
+            var dimensions = { measuredWidth: owner.getMeasuredWidth(), measuredHeight: owner.getMeasuredHeight() };
+            return CGSizeMake(Utils.layout.toDeviceIndependentPixels(dimensions.measuredWidth), Utils.layout.toDeviceIndependentPixels(dimensions.measuredHeight));
+        }
+        return targetSize;
+    };
     return CollectionViewCell;
 }(UICollectionViewCell));
 var CollectionViewDataSource = /** @class */ (function (_super) {
@@ -1041,19 +1078,14 @@ var UICollectionViewDelegateImpl = /** @class */ (function (_super) {
         }
         return indexPath;
     };
-    UICollectionViewDelegateImpl.prototype.collectionViewDidHighlightItemAtIndexPath = function (collectionView, indexPath) {
-        var owner = this._owner.deref();
-        if (owner) {
-            return owner.collectionViewDidHighlightItemAtIndexPath(collectionView, indexPath);
-        }
-    };
-    UICollectionViewDelegateImpl.prototype.collectionViewDidUnhighlightItemAtIndexPath = function (collectionView, indexPath) {
+    UICollectionViewDelegateImpl.prototype.collectionViewLayoutSizeForItemAtIndexPath = function (collectionView, collectionViewLayout, indexPath) {
         var owner = this._owner.deref();
         if (owner) {
-            return owner.collectionViewDidUnhighlightItemAtIndexPath(collectionView, indexPath);
+            return owner.collectionViewLayoutSizeForItemAtIndexPath(collectionView, collectionViewLayout, indexPath);
         }
+        return CGSizeZero;
     };
-    UICollectionViewDelegateImpl.prototype.collectionViewLayoutSizeForItemAtIndexPath = function (collectionView, collectionViewLayout, indexPath) {
+    UICollectionViewDelegateImpl.prototype.collectionViewLayoutComputedSizeForItemAtIndexPath = function (collectionView, collectionViewLayout, indexPath) {
         var owner = this._owner.deref();
         if (owner) {
             return owner.collectionViewLayoutSizeForItemAtIndexPath(collectionView, collectionViewLayout, indexPath);
@@ -1098,6 +1130,68 @@ var UICollectionViewDelegateImpl = /** @class */ (function (_super) {
     };
     UICollectionViewDelegateImpl.ObjCProtocols = [UICollectionViewDelegate, UICollectionViewDelegateFlowLayout];
     return UICollectionViewDelegateImpl;
+}(UICollectionViewCacheDelegateFlowLayout));
+var UICollectionViewDelegateFixedSizeImpl = /** @class */ (function (_super) {
+    __extends(UICollectionViewDelegateFixedSizeImpl, _super);
+    function UICollectionViewDelegateFixedSizeImpl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    UICollectionViewDelegateFixedSizeImpl.initWithOwner = function (owner) {
+        var delegate = UICollectionViewDelegateFixedSizeImpl.new();
+        delegate._owner = new WeakRef(owner);
+        return delegate;
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.collectionViewWillDisplayCellForItemAtIndexPath = function (collectionView, cell, indexPath) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.collectionViewWillDisplayCellForItemAtIndexPath(collectionView, cell, indexPath);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.collectionViewDidSelectItemAtIndexPath = function (collectionView, indexPath) {
+        var owner = this._owner.deref();
+        if (owner) {
+            return owner.collectionViewDidSelectItemAtIndexPath(collectionView, indexPath);
+        }
+        return indexPath;
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewDidScroll = function (scrollView) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewDidScroll(scrollView);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewWillBeginDragging = function (scrollView) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewWillBeginDragging(scrollView);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewDidEndDecelerating = function (scrollView) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewDidEndDecelerating(scrollView);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewWillEndDraggingWithVelocityTargetContentOffset = function (scrollView, velocity, targetContentOffset) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewWillEndDraggingWithVelocityTargetContentOffset(scrollView, velocity, targetContentOffset);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewDidEndDraggingWillDecelerate = function (scrollView, decelerate) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewDidEndDraggingWillDecelerate(scrollView, decelerate);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.prototype.scrollViewDidEndScrollingAnimation = function (scrollView) {
+        var owner = this._owner.deref();
+        if (owner) {
+            owner.scrollViewDidEndScrollingAnimation(scrollView);
+        }
+    };
+    UICollectionViewDelegateFixedSizeImpl.ObjCProtocols = [UICollectionViewDelegate, UICollectionViewDelegateFlowLayout];
+    return UICollectionViewDelegateFixedSizeImpl;
 }(NSObject));
 var ReorderLongPressImpl = /** @class */ (function (_super) {
     __extends(ReorderLongPressImpl, _super);