How to get the reference of a Nativescript angular modal's native view window?

Question

I am trying to set Immersive mode only in modal page but when I do the below in ngOnInit of the modal component

Application.android.foregroundActivity.getWindow().getDecorView().setSystemUiVisibility(
            // tslint:disable-next-line:no-bitwise
            View.SYSTEM_UI_FLAG_LAYOUT_STABLE
            | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION // hide nav bar
            | View.SYSTEM_UI_FLAG_IMMERSIVE
        );

It sets the immersive view to the app globally except the modal view. The modal view still retains the navigation bar and status bar. Basically what I want is to get a reference to the window of the modal so that I can use it to set the fullscreen flags. I tried many things using fragment manager but it doesnt seem to work at all.

Answer 1

For anyone who is having the same problem. Here's what I did. It is quite similar to the answer posted by aleroy.

First, I obtained a reference to the root component used in the modal view then in:

ngAfterViewInit() {
    setTimeout(() => {
        this._modalWindow = this.root.nativeElement._dialogFragment.getDialog().getWindow();
        this._modalWindow.addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
        // this._modalWindow.setStatusBarColor(android.graphics.Color.BLACK)

        this._modalWindow.getDecorView().setSystemUiVisibility(
            View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY
        );
    }, 1);
}

To clear the fullscreen and hide navigation flags:

ngOnDestroy() {
    this._modalWindow.clearFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON)
    this._modalWindow.getDecorView().setSystemUiVisibility(
        // tslint:disable-next-line:no-bitwise
        View.SYSTEM_UI_FLAG_LAYOUT_STABLE
    );
}