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

fix(ios): large title transition works properly in tabbed applications (#20555)

Browse Source 
fixes #20482
This commit is contained in:
Liam DeBeasi
2020-02-24 11:38:50 -05:00
committed by GitHub
parent 6b2a929cd7
commit 71875417f2
3 changed files with 175 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
core/src/utils/transition/ios.transition.ts
View File

@ -13,11 +13,27 @@ export const shadow = <T extends Element>(el: T): ShadowRoot | T => {
};
const getLargeTitle = (refEl: any) => {
return refEl.querySelector('ion-header:not(.header-collapse-condense-inactive) ion-title[size=large]');
const tabs = (refEl.tagName === 'ION-TABS') ? refEl : refEl.querySelector('ion-tabs');
const query = 'ion-header:not(.header-collapse-condense-inactive) ion-title[size=large]';
if (tabs != null) {
const activeTab = tabs.querySelector('ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)');
return activeTab.querySelector(query);
}
return refEl.querySelector(query);
};
const getBackButton = (refEl: any, backDirection: boolean) => {
const buttonsList = refEl.querySelectorAll('ion-buttons');
const tabs = (refEl.tagName === 'ION-TABS') ? refEl : refEl.querySelector('ion-tabs');
let buttonsList = [];
if (tabs != null) {
const activeTab = tabs.querySelector('ion-tab:not(.tab-hidden), .ion-page:not(.ion-page-hidden)');
buttonsList = activeTab.querySelectorAll('ion-buttons');
} else {
buttonsList = refEl.querySelectorAll('ion-buttons');
}
for (const buttons of buttonsList) {
const parentHeader = buttons.closest('ion-header');
@ -277,7 +293,6 @@ export const iosTransitionAnimation = (navEl: HTMLElement, opts: TransitionOptio
const enteringContentHasLargeTitle = enteringEl.querySelector('ion-header.header-collapse-condense');
const { forward, backward } = createLargeTitleTransition(rootAnimation, isRTL, backDirection, enteringEl, leavingEl);
enteringToolBarEls.forEach(enteringToolBarEl => {
const enteringToolBar = createAnimation();
enteringToolBar.addElement(enteringToolBarEl);