diff --git a/ionic/components/tabs/tab.ts b/ionic/components/tabs/tab.ts index 135e488cef..dcf3b730c1 100644 --- a/ionic/components/tabs/tab.ts +++ b/ionic/components/tabs/tab.ts @@ -86,26 +86,24 @@ export class Tab extends NavController { } onInit() { - console.debug('Tab onInit', this.index); - if (this._isInitial) { this.tabs.select(this); } else if (this.tabs.preloadTabs) { setTimeout(() => { - this.load(() => { - console.debug('preloaded tab', this.index); + let opts = { + animate: false, + preload: true + }; + this.load(opts, () => { this.hideNavbars(true); }); - }, 500 * this.index); + }, 1000 * this.index); } } - load(done) { + load(opts, done) { if (!this._loaded && this.root) { - let opts = { - animate: false - }; this.push(this.root, null, opts).then(done); this._loaded = true; diff --git a/ionic/components/tabs/tabs.ts b/ionic/components/tabs/tabs.ts index bd0df27887..4dcfd643b3 100644 --- a/ionic/components/tabs/tabs.ts +++ b/ionic/components/tabs/tabs.ts @@ -152,7 +152,7 @@ export class Tabs extends Ion { return Promise.reject(); } - console.debug('select tab', selectedTab.id); + console.time('select tab ' + selectedTab.id); let deselectedTab = this.getSelected(); @@ -161,14 +161,32 @@ export class Tabs extends Ion { return this.touchActive(selectedTab); } - selectedTab.load(() => { - this.isReady && this.isReady(); + let opts = { + animate: false + }; + let deselectedPage; + if (deselectedTab) { + deselectedPage = deselectedTab.getActive(); + deselectedPage && deselectedPage.willLeave(); + } + + let selectedPage = selectedTab.getActive(); + selectedPage && selectedPage.willEnter(); + + selectedTab.load(opts, () => { this.tabs.forEach(tab => { tab.setSelected(tab === selectedTab); }); this.highlight && this.highlight.select(selectedTab); + + selectedPage && selectedPage.didEnter(); + deselectedPage && deselectedPage.didLeave(); + + this.isReady && this.isReady(); + + console.timeEnd('select tab ' + selectedTab.id); }); } @@ -270,18 +288,16 @@ class TabHighlight { } select(tab) { - setTimeout(() => { - let d = tab.btn.getDimensions(); - let ele = this.elementRef.nativeElement; - ele.style.transform = 'translate3d(' + d.left + 'px,0,0) scaleX(' + d.width + ')'; + let d = tab.btn.getDimensions(); + let ele = this.elementRef.nativeElement; + ele.style.transform = 'translate3d(' + d.left + 'px,0,0) scaleX(' + d.width + ')'; - if (!this.init) { - this.init = true; - setTimeout(() => { - ele.classList.add('animate'); - }, 64) - } - }, 32); + if (!this.init) { + this.init = true; + setTimeout(() => { + ele.classList.add('animate'); + }, 64) + } } }