feat(modal): introduce stretched param to showModal method (#5496)

* fix-next(ios-modal-view): force stretch alignment

* feat(modal): introduce stretched param to showModal method

* test(modal-view): add modal view stretched test
This commit is contained in:
Alexander Djenkov
2018-03-07 18:17:52 +02:00
committed by Svetoslav
parent 6509efa430
commit 0138873ee3
7 changed files with 39 additions and 14 deletions

View File

@ -214,11 +214,12 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
const closeCallback: Function = arguments[2];
const fullscreen: boolean = arguments[3];
const animated = arguments[4];
const stretched = arguments[5];
const view: ViewDefinition = firstAgrument instanceof ViewCommon
? firstAgrument : createViewFromEntry({ moduleName: firstAgrument });
(<ViewCommon>view)._showNativeModalView(this, context, closeCallback, fullscreen, animated);
(<ViewCommon>view)._showNativeModalView(this, context, closeCallback, fullscreen, animated, stretched);
return view;
}
}
@ -239,7 +240,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
return this._modal;
}
protected _showNativeModalView(parent: ViewCommon, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean) {
protected _showNativeModalView(parent: ViewCommon, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean, stretched?: boolean) {
_rootModalViews.push(this);
parent._modal = this;

View File

@ -38,6 +38,7 @@ let Dialog: android.app.Dialog;
interface DialogOptions {
owner: View;
fullscreen: boolean;
stretched: boolean;
shownCallback: () => void;
dismissCallback: () => void;
}
@ -123,6 +124,7 @@ function initializeDialogFragment() {
class DialogFragmentImpl extends android.app.DialogFragment {
public owner: View;
private _fullscreen: boolean;
private _stretched: boolean;
private _shownCallback: () => void;
private _dismissCallback: () => void;
@ -136,17 +138,21 @@ function initializeDialogFragment() {
const options = getModalOptions(ownerId);
this.owner = options.owner;
this._fullscreen = options.fullscreen;
this._stretched = options.stretched;
this._dismissCallback = options.dismissCallback;
this._shownCallback = options.shownCallback;
this.owner._dialogFragment = this;
this.setStyle(android.app.DialogFragment.STYLE_NO_TITLE, 0);
const dialog = new DialogImpl(this, this.getActivity(), this.getTheme());
// do not override alignment unless fullscreen modal will be shown;
// otherwise we might break component-level layout:
// https://github.com/NativeScript/NativeScript/issues/5392
if (this._fullscreen) {
if (!this._fullscreen && !this._stretched) {
this.owner.horizontalAlignment = "center";
this.owner.verticalAlignment = "middle";
} else {
this.owner.horizontalAlignment = "stretch";
this.owner.verticalAlignment = "stretch";
}
@ -179,7 +185,7 @@ function initializeDialogFragment() {
this._shownCallback();
}
public onDismiss(dialog: android.content.IDialogInterface): void {
super.onDismiss(dialog);
const manager = this.getFragmentManager();
@ -455,8 +461,8 @@ export class View extends ViewCommon {
return result | (childMeasuredState & layout.MEASURED_STATE_MASK);
}
protected _showNativeModalView(parent: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean) {
super._showNativeModalView(parent, context, closeCallback, fullscreen);
protected _showNativeModalView(parent: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean, stretched?: boolean) {
super._showNativeModalView(parent, context, closeCallback, fullscreen, stretched);
if (!this.backgroundColor) {
this.backgroundColor = new Color("White");
}
@ -471,6 +477,7 @@ export class View extends ViewCommon {
const dialogOptions: DialogOptions = {
owner: this,
fullscreen: !!fullscreen,
stretched: !!stretched,
shownCallback: () => this._raiseShownModallyEvent(),
dismissCallback: () => this.closeModal()
}

View File

@ -498,8 +498,9 @@ export abstract class View extends ViewBase {
* @param closeCallback - A function that will be called when the view is closed.
* Any arguments provided when calling ShownModallyData.closeCallback will be available here.
* @param fullscreen - An optional parameter specifying whether to show the modal page in full-screen mode.
* @param stretched - An optional parameter specifying whether to stretch the modal page when not in full-screen mode.
*/
showModal(moduleName: string, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean): View;
showModal(moduleName: string, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean, stretched?: boolean): View;
/**
* Shows the view passed as parameter as a modal view.
@ -507,8 +508,9 @@ export abstract class View extends ViewBase {
* @param context - Any context you want to pass to the modally shown view. This same context will be available in the arguments of the shownModally event handler.
* @param closeCallback - A function that will be called when the view is closed. Any arguments provided when calling ShownModallyData.closeCallback will be available here.
* @param fullscreen - An optional parameter specifying whether to show the modal view in full-screen mode.
* @param stretched - An optional parameter specifying whether to stretch the modal page when not in full-screen mode.
*/
showModal(view: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean): View;
showModal(view: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean, stretched?: boolean): View;
/**
* Deprecated. Showing view as modal is deprecated.

View File

@ -311,10 +311,10 @@ export class View extends ViewCommon {
return view;
}
protected _showNativeModalView(parent: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean) {
protected _showNativeModalView(parent: View, context: any, closeCallback: Function, fullscreen?: boolean, animated?: boolean, stretched?: boolean) {
let parentWithController = this.getParentWithViewController(parent);
super._showNativeModalView(parentWithController, context, closeCallback, fullscreen);
super._showNativeModalView(parentWithController, context, closeCallback, fullscreen, stretched);
let controller = this.viewController;
if (!controller) {
controller = ios.UILayoutViewController.initWithOwner(new WeakRef(this));
@ -334,6 +334,9 @@ export class View extends ViewCommon {
controller.modalPresentationStyle = UIModalPresentationStyle.FormSheet;
}
this.horizontalAlignment = "stretch";
this.verticalAlignment = "stretch";
this._raiseShowingModallyEvent();
animated = animated === undefined ? true : !!animated;
(<any>controller).animated = animated;