javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-23 05:58:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(nav): zIndex in overlays

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2016-11-16 19:17:25 +01:00
committed by Adam Bradley
parent 7201999674
commit 70f8a8e5eb
5 changed files with 20 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/action-sheet/test/basic/app-module.ts
View File

@ -33,9 +33,10 @@ export class E2EPage {
}
},
{
text: 'Play',
text: 'Play (open modal)',
icon: 'arrow-dropright-circle',
handler: () => {
this.result = 'Play (open modal)';
let modal = this.modalCtrl.create(ModalPage);
modal.present();

2
src/components/app/app-root.ts
View File

@ -19,7 +19,7 @@ export const AppRootToken = new OpaqueToken('USERROOT');
'<div #modalPortal overlay-portal></div>' +
'<div #overlayPortal overlay-portal></div>' +
'<div #loadingPortal class="loading-portal" overlay-portal></div>' +
'<div #toastPortal class="toast-portal" overlay-portal></div>' +
'<div #toastPortal class="toast-portal" [overlay-portal]="10000"></div>' +
'<div class="click-block"></div>'
})
export class IonicApp extends Ion implements OnInit {

10
src/components/nav/overlay-portal.ts
View File

@ -1,4 +1,4 @@
import { ComponentFactoryResolver, Directive, ElementRef, forwardRef, Inject, NgZone, Optional, Renderer, ViewContainerRef } from '@angular/core';
import { ComponentFactoryResolver, Directive, ElementRef, forwardRef, Inject, Input, NgZone, Optional, Renderer, ViewContainerRef } from '@angular/core';
import { App } from '../app/app';
import { Config } from '../../config/config';
@ -12,7 +12,7 @@ import { TransitionController } from '../../transitions/transition-controller';
* @private
*/
@Directive({
selector: '[overlay-portal]'
selector: '[overlay-portal]',
})
export class OverlayPortal extends NavControllerBase {
constructor(
@ -38,4 +38,10 @@ export class OverlayPortal extends NavControllerBase {
app.viewDidLeave.subscribe(this.dismissPageChangeViews.bind(this));
}
@Input('overlay-portal')
set _overlayPortal(val: number) {
this._zIndexOffset = (val || 0);
}
}

1
src/navigation/nav-controller-base.ts
View File

@ -38,6 +38,7 @@ export class NavControllerBase extends Ion implements NavController {
_trnsTm: boolean = false;
_viewport: ViewContainerRef;
_views: ViewController[] = [];
_zIndexOffset: number = 0;
viewDidLoad: EventEmitter<any> = new EventEmitter();
viewWillEnter: EventEmitter<any> = new EventEmitter();

10
src/navigation/nav-util.ts
View File

@ -51,8 +51,15 @@ export function convertToViews(linker: DeepLinker, pages: any[]): ViewController
return views;
}
let portalZindex = 9999;
export function setZIndex(nav: NavControllerBase, enteringView: ViewController, leavingView: ViewController, direction: string, renderer: Renderer) {
if (enteringView) {
if (nav._isPortal) {
enteringView._setZIndex(nav._zIndexOffset + portalZindex, renderer);
portalZindex++;
return;
}
leavingView = leavingView || nav.getPrevious(enteringView);
@ -65,7 +72,7 @@ export function setZIndex(nav: NavControllerBase, enteringView: ViewController,
}
} else {
enteringView._setZIndex(nav._isPortal ? PORTAL_ZINDEX : INIT_ZINDEX, renderer);
enteringView._setZIndex(INIT_ZINDEX + nav._zIndexOffset, renderer);
}
}
}
@ -184,7 +191,6 @@ export enum ViewState {
}
export const INIT_ZINDEX = 100;
export const PORTAL_ZINDEX = 9999;
export const DIRECTION_BACK = 'back';
export const DIRECTION_FORWARD = 'forward';