From 5d3d772462254ad6b296815f08ed83f1de914b72 Mon Sep 17 00:00:00 2001 From: Nathanael Anderson Date: Sun, 13 Sep 2015 15:27:54 -0500 Subject: [PATCH 1/3] This fixes the issue with Dialogs and being dismissed by clicking elsewhere on the screen on Android. The dialog will now call the callback with a null value as the first parameter (and finish calling the unloaded and other code that is supposed to be ran when the dialog is closed). This also adds a closeDialog function that you can call from the dialog which will also call the callback for you. --- ui/page/page-common.ts | 28 ++++++++++++++++++---------- ui/page/page.android.ts | 19 ++++++++++++++++--- ui/page/page.ios.ts | 1 + 3 files changed, 35 insertions(+), 13 deletions(-) diff --git a/ui/page/page-common.ts b/ui/page/page-common.ts index 2ba73ff82..9f62cba54 100644 --- a/ui/page/page-common.ts +++ b/ui/page/page-common.ts @@ -35,6 +35,7 @@ export class Page extends contentView.ContentView implements dts.Page { private _navigationContext: any; + private _closeDialogCallback: Function; private _cssApplied: boolean; private _styleScope: styleScope.StyleScope = new styleScope.StyleScope(); private _actionBar: actionBar.ActionBar; @@ -189,6 +190,12 @@ export class Page extends contentView.ContentView implements dts.Page { (page)._showNativeModalView(this, context, closeCallback, fullscreen); } + public closeDialog() { + if (this._closeDialogCallback) { + this._closeDialogCallback.apply(undefined, arguments); + } + } + public _addChildFromBuilder(name: string, value: any) { if (value instanceof actionBar.ActionBar) { this.actionBar = value; @@ -199,7 +206,16 @@ export class Page extends contentView.ContentView implements dts.Page { } protected _showNativeModalView(parent: Page, context: any, closeCallback: Function, fullscreen?: boolean) { - // + var that = this; + this._closeDialogCallback = function () { + if (that._closeDialogCallback) { + that._closeDialogCallback = null; + that._hideNativeModalView(parent); + if (typeof closeCallback === "function") { + closeCallback.apply(undefined, arguments); + } + } + }; } protected _hideNativeModalView(parent: Page) { @@ -207,19 +223,11 @@ export class Page extends contentView.ContentView implements dts.Page { } protected _raiseShownModallyEvent(parent: Page, context: any, closeCallback: Function) { - var that = this; - var closeProxy = function () { - that._hideNativeModalView(parent); - if (closeCallback){ - closeCallback.apply(undefined, arguments); - } - }; - this.notify({ eventName: Page.shownModallyEvent, object: this, context: context, - closeCallback: closeProxy + closeCallback: this._closeDialogCallback }); } diff --git a/ui/page/page.android.ts b/ui/page/page.android.ts index b19d1584c..afae3bb82 100644 --- a/ui/page/page.android.ts +++ b/ui/page/page.android.ts @@ -12,12 +12,14 @@ global.moduleMerge(pageCommon, exports); class DialogFragmentClass extends android.app.DialogFragment { private _owner: Page; private _fullscreen: boolean; + private _dismissCallback: Function; - constructor(owner: Page, fullscreen?: boolean) { + constructor(owner: Page, fullscreen?: boolean, dismissCallback?: Function) { super(); this._owner = owner; this._fullscreen = fullscreen; + this._dismissCallback = dismissCallback; return global.__native(this); } @@ -29,11 +31,18 @@ class DialogFragmentClass extends android.app.DialogFragment { window.setBackgroundDrawable(new android.graphics.drawable.ColorDrawable(android.graphics.Color.TRANSPARENT)); if (this._fullscreen) { - window.setLayout(android.view.ViewGroup.LayoutParams.FILL_PARENT, android.view.ViewGroup.LayoutParams.FILL_PARENT); + window.setLayout(android.view.ViewGroup.LayoutParams.FILL_PARENT, android.view.ViewGroup.LayoutParams.FILL_PARENT); } return dialog; } + + public onDismiss() { + if (typeof this._dismissCallback === "function") { + this._dismissCallback(); + } + } + }; export class Page extends pageCommon.Page { @@ -96,6 +105,7 @@ export class Page extends pageCommon.Page { private _dialogFragment: DialogFragmentClass; /* tslint:enable */ protected _showNativeModalView(parent: Page, context: any, closeCallback: Function, fullscreen?: boolean) { + super._showNativeModalView(parent, context, closeCallback, fullscreen); if (!this.backgroundColor) { this.backgroundColor = new color.Color("White"); } @@ -104,7 +114,10 @@ export class Page extends pageCommon.Page { this._isAddedToNativeVisualTree = true; this.onLoaded(); - this._dialogFragment = new DialogFragmentClass(this, fullscreen); + var that = this; + this._dialogFragment = new DialogFragmentClass(this, fullscreen, function() { + that.closeDialog(); + }); this._dialogFragment.show(parent.frame.android.activity.getFragmentManager(), "dialog"); super._raiseShownModallyEvent(parent, context, closeCallback); diff --git a/ui/page/page.ios.ts b/ui/page/page.ios.ts index 4028e079c..ac95a516c 100644 --- a/ui/page/page.ios.ts +++ b/ui/page/page.ios.ts @@ -130,6 +130,7 @@ export class Page extends pageCommon.Page { } protected _showNativeModalView(parent: Page, context: any, closeCallback: Function, fullscreen?: boolean) { + super._showNativeModalView(parent, context, closeCallback, fullscreen); this._isModal = true; if (!parent.ios.view.window) { From 7366e546dc2f8d2474b95c3d5d452481f4ffefe9 Mon Sep 17 00:00:00 2001 From: Nathanael Anderson Date: Wed, 23 Sep 2015 15:22:34 -0500 Subject: [PATCH 2/3] Renamed closeDialog to closeModal; as we do a showModal; for consistency. Fixed page auto sizing full on Android. --- ui/page/page-common.ts | 17 +++++++++-------- ui/page/page.android.ts | 8 ++++++-- 2 files changed, 15 insertions(+), 10 deletions(-) diff --git a/ui/page/page-common.ts b/ui/page/page-common.ts index 9f62cba54..b4565f19a 100644 --- a/ui/page/page-common.ts +++ b/ui/page/page-common.ts @@ -33,9 +33,10 @@ export class Page extends contentView.ContentView implements dts.Page { public static navigatedFromEvent = "navigatedFrom"; public static shownModallyEvent = "shownModally"; + protected _closeModalCallback: Function; + private _navigationContext: any; - private _closeDialogCallback: Function; private _cssApplied: boolean; private _styleScope: styleScope.StyleScope = new styleScope.StyleScope(); private _actionBar: actionBar.ActionBar; @@ -190,9 +191,9 @@ export class Page extends contentView.ContentView implements dts.Page { (page)._showNativeModalView(this, context, closeCallback, fullscreen); } - public closeDialog() { - if (this._closeDialogCallback) { - this._closeDialogCallback.apply(undefined, arguments); + public closeModal() { + if (this._closeModalCallback) { + this._closeModalCallback.apply(undefined, arguments); } } @@ -207,9 +208,9 @@ export class Page extends contentView.ContentView implements dts.Page { protected _showNativeModalView(parent: Page, context: any, closeCallback: Function, fullscreen?: boolean) { var that = this; - this._closeDialogCallback = function () { - if (that._closeDialogCallback) { - that._closeDialogCallback = null; + this._closeModalCallback = function () { + if (that._closeModalCallback) { + that._closeModalCallback = null; that._hideNativeModalView(parent); if (typeof closeCallback === "function") { closeCallback.apply(undefined, arguments); @@ -227,7 +228,7 @@ export class Page extends contentView.ContentView implements dts.Page { eventName: Page.shownModallyEvent, object: this, context: context, - closeCallback: this._closeDialogCallback + closeCallback: this._closeModalCallback }); } diff --git a/ui/page/page.android.ts b/ui/page/page.android.ts index afae3bb82..40535c6f7 100644 --- a/ui/page/page.android.ts +++ b/ui/page/page.android.ts @@ -65,7 +65,11 @@ export class Page extends pageCommon.Page { public _createUI() { this._grid = new org.nativescript.widgets.GridLayout(this._context); this._grid.addRow(new org.nativescript.widgets.ItemSpec(1, org.nativescript.widgets.GridUnitType.auto)); - this._grid.addRow(new org.nativescript.widgets.ItemSpec(1, org.nativescript.widgets.GridUnitType.star)); + var gridUnitType = org.nativescript.widgets.GridUnitType.star + if (this._closeModalCallback) { + gridUnitType = org.nativescript.widgets.GridUnitType.auto; + } + this._grid.addRow(new org.nativescript.widgets.ItemSpec(1, gridUnitType)); } public _addViewToNativeVisualTree(child: view.View, atIndex?: number): boolean { @@ -116,7 +120,7 @@ export class Page extends pageCommon.Page { var that = this; this._dialogFragment = new DialogFragmentClass(this, fullscreen, function() { - that.closeDialog(); + that.closeModal(); }); this._dialogFragment.show(parent.frame.android.activity.getFragmentManager(), "dialog"); From eec823d29dcebc2f178c781c7b6d5318b2cce564 Mon Sep 17 00:00:00 2001 From: Rossen Hristov Date: Thu, 1 Oct 2015 11:13:52 +0300 Subject: [PATCH 3/3] Added closeModal() to the d.ts and updated the sample app. --- apps/modal-views-demo/main-page.ts | 4 ++++ apps/modal-views-demo/main-page.xml | 1 + ui/page/page.d.ts | 5 +++++ 3 files changed, 10 insertions(+) diff --git a/apps/modal-views-demo/main-page.ts b/apps/modal-views-demo/main-page.ts index 1fa47f260..9b915779c 100644 --- a/apps/modal-views-demo/main-page.ts +++ b/apps/modal-views-demo/main-page.ts @@ -16,4 +16,8 @@ export function onTap(args: observable.EventData) { console.log(username + "/" + password); label.text = username + "/" + password; }, fullscreen); +} + +export function onCloseModal(args: observable.EventData) { + page.closeModal(); } \ No newline at end of file diff --git a/apps/modal-views-demo/main-page.xml b/apps/modal-views-demo/main-page.xml index 0d76cdb81..d262d8937 100644 --- a/apps/modal-views-demo/main-page.xml +++ b/apps/modal-views-demo/main-page.xml @@ -3,5 +3,6 @@