EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #2375 from dpalou/MOBILE-3422 

Mobile 3422
main
Juan Leyva 2020-05-19 17:16:48 +02:00 committed by GitHub
parent 180f99e0ae 9c11e753e7
commit bd4a295fdb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 91 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ion-tabs/ion-tabs.scss
View File

@ -44,7 +44,7 @@ ion-app.app-root core-ion-tabs {
}
}
.tabbar[hidden] + .tabcontent {
.tabbar[hidden] + .tabcontent, &.tabbar-hidden .tabcontent {
width: 100%;
core-ion-tab {
@include position(0, 0, 0, 0);

7
src/components/ion-tabs/ion-tabs.ts
View File

@ -388,4 +388,11 @@ export class CoreIonTabsComponent extends Tabs implements OnDestroy {
}
}
}
/**
* @inheritdoc
*/
setTabbarHidden(tabbarHidden: boolean): void {
// Don't hide the tab bar, we'll do it via CSS if needed.
}
}

34
src/core/mainmenu/pages/menu/menu.ts
View File

@ -13,7 +13,7 @@
// limitations under the License.
import { Component, OnDestroy, ViewChild, ChangeDetectorRef } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular';
import { CoreAppProvider } from '@providers/app';
import { CoreSitesProvider } from '@providers/sites';
import { CoreEventsProvider } from '@providers/events';
@ -45,13 +45,21 @@ export class CoreMainMenuPage implements OnDestroy {
protected pendingRedirect: any;
protected urlToOpen: string;
protected mainMenuId: number;
protected keyboardObserver: any;
@ViewChild('mainTabs') mainTabs: CoreIonTabsComponent;
constructor(private menuDelegate: CoreMainMenuDelegate, private sitesProvider: CoreSitesProvider, navParams: NavParams,
private navCtrl: NavController, private eventsProvider: CoreEventsProvider, private cdr: ChangeDetectorRef,
private mainMenuProvider: CoreMainMenuProvider, private linksDelegate: CoreContentLinksDelegate,
private linksHelper: CoreContentLinksHelperProvider, private appProvider: CoreAppProvider) {
constructor(protected menuDelegate: CoreMainMenuDelegate,
protected sitesProvider: CoreSitesProvider,
navParams: NavParams,
protected navCtrl: NavController,
protected eventsProvider: CoreEventsProvider,
protected cdr: ChangeDetectorRef,
protected mainMenuProvider: CoreMainMenuProvider,
protected linksDelegate: CoreContentLinksDelegate,
protected linksHelper: CoreContentLinksHelperProvider,
protected appProvider: CoreAppProvider,
protected platform: Platform) {
this.mainMenuId = this.appProvider.getMainMenuId();
@ -110,6 +118,21 @@ export class CoreMainMenuPage implements OnDestroy {
window.addEventListener('resize', this.initHandlers.bind(this));
if (this.platform.is('ios')) {
// In iOS, the resize event is triggered before the keyboard is opened/closed and not triggered again once done.
// Init handlers again once keyboard is closed since the resize event doesn't have the updated height.
this.keyboardObserver = this.eventsProvider.on(CoreEventsProvider.KEYBOARD_CHANGE, (kbHeight) => {
if (kbHeight === 0) {
this.initHandlers();
// If the device is slow it can take a bit more to update the window height. Retry in a few ms.
setTimeout(() => {
this.initHandlers();
}, 250);
}
});
}
this.appProvider.setMainMenuOpen(this.mainMenuId, true);
}
@ -221,5 +244,6 @@ export class CoreMainMenuPage implements OnDestroy {
this.redirectObs && this.redirectObs.off();
window.removeEventListener('resize', this.initHandlers.bind(this));
this.appProvider.setMainMenuOpen(this.mainMenuId, false);
this.keyboardObserver && this.keyboardObserver.off();
}
}

10
src/core/mainmenu/providers/mainmenu.ts
View File

@ -14,6 +14,7 @@
import { Injectable } from '@angular/core';
import { NavController } from 'ionic-angular';
import { CoreApp } from '@providers/app';
import { CoreLangProvider } from '@providers/lang';
import { CoreSitesProvider } from '@providers/sites';
import { CoreUtilsProvider } from '@providers/utils/utils';
@ -54,8 +55,10 @@ export class CoreMainMenuProvider {
static ITEM_MIN_WIDTH = 72; // Min with of every item, based on 5 items on a 360 pixel wide screen.
protected tablet = false;
constructor(private langProvider: CoreLangProvider, private sitesProvider: CoreSitesProvider,
protected menuDelegate: CoreMainMenuDelegate, protected utils: CoreUtilsProvider) {
constructor(protected langProvider: CoreLangProvider,
protected sitesProvider: CoreSitesProvider,
protected menuDelegate: CoreMainMenuDelegate,
protected utils: CoreUtilsProvider) {
this.tablet = window && window.innerWidth && window.innerWidth >= 576 && window.innerHeight >= 576;
}
@ -219,7 +222,8 @@ export class CoreMainMenuProvider {
* @return Tabs placement including side value.
*/
getTabPlacement(navCtrl: NavController): string {
const tablet = window && window.innerWidth && window.innerWidth >= 576 && window.innerHeight >= 576;
const tablet = window && window.innerWidth && window.innerWidth >= 576 && (window.innerHeight >= 576 ||
((CoreApp.instance.isKeyboardVisible() || CoreApp.instance.isKeyboardOpening()) && window.innerHeight >= 200));
if (tablet != this.tablet) {
this.tablet = tablet;

49
src/providers/app.ts
View File

@ -143,6 +143,8 @@ export class CoreAppProvider {
protected logger;
protected ssoAuthenticationPromise: Promise<any>;
protected isKeyboardShown = false;
protected _isKeyboardOpening = false;
protected _isKeyboardClosing = false;
protected backActions = [];
protected mainMenuId = 0;
protected mainMenuOpen: number;
@ -179,7 +181,7 @@ export class CoreAppProvider {
// Execute the callback in the Angular zone, so change detection doesn't stop working.
zone.run(() => {
document.body.classList.add('keyboard-is-open');
this.isKeyboardShown = true;
this.setKeyboardShown(true);
// Error on iOS calculating size.
// More info: https://github.com/ionic-team/ionic-plugin-keyboard/issues/276 .
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, data.keyboardHeight);
@ -189,10 +191,24 @@ export class CoreAppProvider {
// Execute the callback in the Angular zone, so change detection doesn't stop working.
zone.run(() => {
document.body.classList.remove('keyboard-is-open');
this.isKeyboardShown = false;
this.setKeyboardShown(false);
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, 0);
});
});
this.keyboard.onKeyboardWillShow().subscribe((data) => {
// Execute the callback in the Angular zone, so change detection doesn't stop working.
zone.run(() => {
this._isKeyboardOpening = true;
this._isKeyboardClosing = false;
});
});
this.keyboard.onKeyboardWillHide().subscribe((data) => {
// Execute the callback in the Angular zone, so change detection doesn't stop working.
zone.run(() => {
this._isKeyboardOpening = false;
this._isKeyboardClosing = true;
});
});
this.platform.registerBackButtonAction(() => {
this.backButtonAction();
@ -387,6 +403,24 @@ export class CoreAppProvider {
return this.platform.is('ios');
}
/**
* Check if the keyboard is closing.
*
* @return Whether keyboard is closing (animating).
*/
isKeyboardClosing(): boolean {
return this._isKeyboardClosing;
}
/**
* Check if the keyboard is being opened.
*
* @return Whether keyboard is opening (animating).
*/
isKeyboardOpening(): boolean {
return this._isKeyboardOpening;
}
/**
* Check if the keyboard is visible.
*
@ -529,6 +563,17 @@ export class CoreAppProvider {
}
}
/**
* Set keyboard shown or hidden.
*
* @param Whether the keyboard is shown or hidden.
*/
protected setKeyboardShown(shown: boolean): void {
this.isKeyboardShown = shown;
this._isKeyboardOpening = false;
this._isKeyboardClosing = false;
}
/**
* Set a main menu as open or not.
*