Как получить доступ к делегатам UIScrollview из native ios в nativescript angular?

Question

Я работаю с приложением android и ios с помощью nativescript angular application. Я хочу получить доступ к делегатам scrollview ios, я получил доступ к делегатам scrollview из собственного кода ios, следующего кода. Но это не сработало:

Мой класс реализации делегата scrollview:

// import {Injectable, EventEmitter,Output} from "@angular/core";
@ObjCClass(UIScrollViewDelegate)
 export class FoodScrollDelegate extends NSObject implements UIScrollViewDelegate
{
    public static ObjCProtocols = [UIScrollViewDelegate];
    // @Output() yvalue:EventEmitter<any>=new EventEmitter();
    private _originalDelegate:UIScrollViewDelegate;
    public getY:Number=0;
     constructor()
     {
         super();
     }

    public static initWithOriginalDelegate(originalDelegate:UIScrollViewDelegate):FoodScrollDelegate{
        console.log("Called Method");
        let delegate=<FoodScrollDelegate>FoodScrollDelegate.new();
        delegate._originalDelegate=originalDelegate;
        return delegate;
    }


}

Я настроил делегата scrollview следующим образом:

onScrollLoaded(args)
{
    var subscroll=args.object;
    var uiscrollview=subscroll.ios;
    let tf=<any>this.subMenuScroll;
    var newweakref=new WeakRef(uiscrollview);
    const newDelegate=FoodScrollDelegate.initWithOriginalDelegate(tf._delegate);
    console.log("PrintDelegate",+newDelegate);
    uiscrollview.delegate=newDelegate;    

}

Мой класс MenuComponet Вот так:

 import { Component, OnInit, AfterViewInit,ViewChild, ElementRef} from "@angular/core";
import {Page, borderTopRightRadiusProperty} from "ui/page";
import { isIOS, isAndroid } from 'tns-core-modules/platform';
import { RadListView, ListViewEventData } from "nativescript-ui-listview";
import { RestaurentMenuModel,RestaurentSubMenuModel } from "~/app/models/restaurant";
import { ObservableArray } from "tns-core-modules/data/observable-array";
import { run } from "tns-core-modules/application/application";
import { ScrollEventData, ScrollView } from "tns-core-modules/ui/scroll-view/scroll-view";
import { RouterExtensions } from "nativescript-angular/router";
import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout/stack-layout";
import { Label } from "tns-core-modules/ui/label/label";
import { analyzeAndValidateNgModules } from "@angular/compiler";
import * as utils from "tns-core-modules/utils/utils";
import { setTimeout } from "tns-core-modules/timer";
import { EventData } from "data/observable";
import { FoodScrollDelegate } from "~/app/Utils/scroll_delegate";

declare var UITableViewCellSelectionStyle;
declare var UIView, NSMutableArray, NSIndexPath;

//declare var setShowsHorizontalScrollIndicator;



@Component({
    selector:"restaurant_menu",
    moduleId:module.id,
    templateUrl:"./restaurant_menu.component.html",
    styleUrls:["./restaurant_menu.component.css"],
})

export class RestaurantMenu  implements OnInit
{


    //public cartCount:Number=1;
    @ViewChild("ScrollList") scrollList:ElementRef;
    @ViewChild("categoryList") categoryList:ElementRef;
    public AllMenuList:any;
    public cartTotal:any=0;
    public cartItem:any=0;
    public isCartVisible=false;
     incrementItem:any=0;
     decrementItem:any=0;
     categoryContainer:Label;
     subMenuContainers:StackLayout;
     offsetValue:any=0;
     dummyStatus:any=0;
     horizontalOffsetvalue:any=0;
     lengthHorizontaloffsetLength:any=0;   
     public selectedIndex:Number=0;
     public scrollEnabled:Boolean=false;
     lastItemY:Number=0;
     subMenuScroll:ScrollView;
     foodScrollDelegate:FoodScrollDelegate;
    _delegate:any;
    constructor(private page:Page,public routerExtension:RouterExtensions)
    {

    }
    ngOnInit()
    {
        this.subMenuScroll=this.page.getViewById("subMenuScroll");
        //this.subMenuScroll.ios.delegate=FoodScrollDelegate.initWithOriginalDelegate(this._delegate);
       //console.log("PrintDelegate"+this.foodScrollDelegate.scrollViewDidEndDraggingWillDecelerate);
    //    this.foodScrollDelegate=new FoodScrollDelegate();
    //    this.foodScrollDelegate.yvalue.subscribe(yvalue=>{
    //         console.log("TheYYValue"+yvalue);
    //     });


    }
    public scrollViewDidEndDraggingWillDecelerate?(scrollView: UIScrollView, decelerate: boolean): void {
            console.log("WillScrollEnd"+" "+decelerate);
        }
    public scrollViewDidScroll?(scrollView: UIScrollView): void {
            this.getY=scrollView.contentOffset.y;
            console.log("Yposition"+this.getY);
            //this.yvalue.emit(this.getY);
        }
    onLoaded(event)
    {
        const scrollview = event.object;
        if (scrollview.ios) {
            scrollview.ios.showsHorizontalScrollIndicator = false;
        }
        else
        {
            scrollview.android.setHorizontalScrollBarEnabled(false);
        }
    }

    onNavBtnTap()
    {
        this.routerExtension.backToPreviousPage();
    }


}

Внутрия реализовал методы делегата. но это работало

Answer 1

ObjCClass является альтернативным синтаксисом для ObjCProtocols.Возможно, вам не нужно делать и то, и другое.

Делегат по умолчанию присоединяется после загруженного события, поэтому ваш делегат может быть перезаписан снова.Вам нужно будет расширить ScrollView и переопределить метод attachNative.

class MyScrollView extends ScrollView {
    protected attachNative() {
        (<any>ScrollView.prototype).attachNative.call(this);
        if (isIOS) {
            (<any>this)._delegate = FoodScrollDelegate.initWithOriginalDelegate((<any>this)._delegate);
            this.nativeViewProtected.delegate = (<any>this)._delegate;
        }
    }
}

Зарегистрировать это MyScrollView,

registerElement("MyScrollView", () => MyScrollView);

Теперь вы сможете использовать вместо MyScrollViewScrollView в вашем HTML, который переопределит делегат по умолчанию.Если вы хотите переопределить делегат для всех ScrollView, используемых в приложении, вы можете просто переопределить цепочку прототипов ScrollView условно на iOS.

(<any>ScrollView.prototype).originalAttachNative = (<any>ScrollView.prototype).attachNative;
(<any>ScrollView.prototype).attachNative = function () {
    this.originalAttachNative();
    const newDelegate = FoodScrollDelegate.initWithOriginalDelegate(this._delegate);
    this._delegate = newDelegate;
    this.nativeViewProtected.delegate = newDelegate;
};

Если вы хотите запустить событие из делегата, тогда

   scrollViewDidEndDraggingWillDecelerate(scrollView: UIScrollView, decelerate: boolean) {
        const owner = (<WeakRef<ScrollView>>(<any>this._originalDelegate)._owner).get();
        if (owner) {
            owner.notify({
                object: owner,
                eventName: "dragEnd",
                decelerate: decelerate
            });
        }
    }

Теперь из Angular вы можете прослушать событие,

HTML

(dragEnd)="onDragEnd($event)"

TS

onDragEnd(event) {
   console.log(event.decelerate);
}