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): translucent toolbar blur no longer obscures entering page title (#20314)

Browse Source 
fixes #19158
This commit is contained in:
Liam DeBeasi
2020-01-29 15:12:00 -05:00
committed by GitHub
parent 1e2946e0f9
commit e580b88477
5 changed files with 33 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -342,10 +342,14 @@ export const iosTransitionAnimation = (navEl: HTMLElement, opts: TransitionOptio
}
enteringToolBarItems.fromTo('transform', `translateX(${OFF_RIGHT})`, `translateX(${CENTER})`);
enteringToolBarBg.beforeClearStyles([OPACITY, 'transform']);
enteringToolBarBg
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 0.01, 1);
const translucentHeader = parentHeader?.translucent;
if (!translucentHeader) {
enteringToolBarBg.fromTo(OPACITY, 0.01, 1);
} else {
enteringToolBarBg.fromTo('transform', (isRTL ? 'translateX(-100%)' : 'translateX(100%)'), 'translateX(0px)');
}
// forward direction, entering page has a back button
if (!forward) {
@ -479,12 +483,15 @@ export const iosTransitionAnimation = (navEl: HTMLElement, opts: TransitionOptio
}
leavingToolBarItems.fromTo('transform', `translateX(${CENTER})`, (isRTL ? 'translateX(-100%)' : 'translateX(100%)'));
leavingToolBarBg.beforeClearStyles([OPACITY, 'transform']);
// leaving toolbar, back direction, and there's no entering toolbar
// should just slide out, no fading out
leavingToolBarBg
.beforeClearStyles([OPACITY])
.fromTo(OPACITY, 1, 0.01);
const translucentHeader = parentHeader?.translucent;
if (!translucentHeader) {
leavingToolBarBg.fromTo(OPACITY, 0.99, 0);
} else {
leavingToolBarBg.fromTo('transform', 'translateX(0px)', (isRTL ? 'translateX(-100%)' : 'translateX(100%)'));
}
if (backButtonEl && !backward) {
const leavingBackBtnText = createAnimation();