Skip to content

Commit

Permalink
refactor(core-modules): implement createNativeView and initNativeView…
Browse files Browse the repository at this point in the history 
… for all components

refactor(core-modules): implement createNativeView and initNativeView for all components
  • Loading branch information
@farfromrefug @MartoYankov
farfromrefug authored and MartoYankov committed Sep 26, 2018
1 parent 7110753 commit 46705ee
Show file tree
Hide file tree
Showing 48 changed files with 630 additions and 519 deletions.
11 changes: 0 additions & 11 deletions tests/app/ui/view/view-tests-common.ts
View file
Expand Up @@ -345,19 +345,8 @@ class TestView extends LayoutBase {
(<any>this.style).customShortHand = value;
}

private _nativeView;
constructor(public name: string) {
super();
this._nativeView = this.nativeViewProtected;
this.nativeViewProtected = undefined;
}

public createNativeView() {
if (isIOS) {
return this._nativeView;
}

return super.createNativeView();
}

public toString() {
Expand Down
4 changes: 1 addition & 3 deletions tns-core-modules/application/application.ios.ts
View file
Expand Up @@ -226,10 +226,8 @@ class IOSApplication implements IOSApplicationDefinition {
// if we already have a root view, we reset it.
this._rootView._onRootViewReset();
}

const rootView = createRootView(view);
this._rootView = rootView;
const controller = getViewController(rootView);

if (createRootFrame.value) {
// Don't setup as styleScopeHost
Expand All @@ -238,7 +236,7 @@ class IOSApplication implements IOSApplicationDefinition {
// setup view as styleScopeHost
rootView._setupAsRootView({});
}

const controller = getViewController(rootView);
const haveController = this._window.rootViewController !== null;
this._window.rootViewController = controller;
if (!haveController) {
Expand Down
13 changes: 6 additions & 7 deletions tns-core-modules/ui/action-bar/action-bar.android.ts
View file
Expand Up @@ -131,17 +131,16 @@ export class ActionBar extends ActionBarBase {
}

public createNativeView() {
initializeMenuItemClickListener();
const toolbar = new android.support.v7.widget.Toolbar(this._context);
const menuItemClickListener = new MenuItemClickListener(this);
toolbar.setOnMenuItemClickListener(menuItemClickListener);
(<any>toolbar).menuItemClickListener = menuItemClickListener;
return toolbar;
return new android.support.v7.widget.Toolbar(this._context);
}

public initNativeView(): void {
super.initNativeView();
(<any>this.nativeViewProtected).menuItemClickListener.owner = this;
const nativeView = this.nativeViewProtected;
initializeMenuItemClickListener();
const menuItemClickListener = new MenuItemClickListener(this);
nativeView.setOnMenuItemClickListener(menuItemClickListener);
(<any>nativeView).menuItemClickListener = menuItemClickListener;
}

public disposeNativeView() {
Expand Down
10 changes: 5 additions & 5 deletions tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
View file
Expand Up @@ -4,11 +4,11 @@ export * from "./activity-indicator-common";

export class ActivityIndicator extends ActivityIndicatorBase {
nativeViewProtected: UIActivityIndicatorView;

constructor() {
super();
this.nativeViewProtected = UIActivityIndicatorView.alloc().initWithActivityIndicatorStyle(UIActivityIndicatorViewStyle.Gray);
this.nativeViewProtected.hidesWhenStopped = true;
createNativeView() {
const view = UIActivityIndicatorView.alloc().initWithActivityIndicatorStyle(UIActivityIndicatorViewStyle.Gray);
view.hidesWhenStopped = true;
return view;
}

get ios(): UIActivityIndicatorView {
Expand Down
30 changes: 19 additions & 11 deletions tns-core-modules/ui/button/button.android.ts
View file
Expand Up @@ -37,34 +37,42 @@ function initializeClickListener(): void {
}

ClickListener = ClickListenerImpl;
APILEVEL = android.os.Build.VERSION.SDK_INT;
AndroidButton = android.widget.Button;
}

export class Button extends ButtonBase {
nativeViewProtected: android.widget.Button;

constructor() {
super();
if (!APILEVEL) {
APILEVEL = android.os.Build.VERSION.SDK_INT;
}
}

private _stateListAnimator: any;
private _highlightedHandler: (args: TouchGestureEventData) => void;

@profile
public createNativeView() {
initializeClickListener();
const button = new AndroidButton(this._context);
const clickListener = new ClickListener(this);
button.setOnClickListener(clickListener);
(<any>button).clickListener = clickListener;
return button;
if (!AndroidButton) {
AndroidButton = android.widget.Button;
}
return new AndroidButton(this._context);
}

public initNativeView(): void {
const nativeView = this.nativeViewProtected;
(<any>nativeView).clickListener.owner = this;
super.initNativeView();
const nativeView = this.nativeViewProtected;
initializeClickListener();
const clickListener = new ClickListener(this);
nativeView.setOnClickListener(clickListener);
(<any>nativeView).clickListener = clickListener;
}

public disposeNativeView() {
(<any>this.nativeViewProtected).clickListener.owner = null;
if (this.nativeViewProtected) {
(<any>this.nativeViewProtected).clickListener.owner = null;
}
super.disposeNativeView();
}

Expand Down
16 changes: 12 additions & 4 deletions tns-core-modules/ui/button/button.ios.ts
View file
Expand Up @@ -14,12 +14,20 @@ export class Button extends ButtonBase {
private _tapHandler: NSObject;
private _stateChangedHandler: ControlStateChangeListener;

constructor() {
super();
this.nativeViewProtected = UIButton.buttonWithType(UIButtonType.System);
createNativeView() {
return UIButton.buttonWithType(UIButtonType.System);
}

public initNativeView(): void {
super.initNativeView();
const nativeView = this.nativeViewProtected;
this._tapHandler = TapHandlerImpl.initWithOwner(new WeakRef(this));
this.nativeViewProtected.addTargetActionForControlEvents(this._tapHandler, "tap", UIControlEvents.TouchUpInside);
nativeView.addTargetActionForControlEvents(this._tapHandler, "tap", UIControlEvents.TouchUpInside);
}

public disposeNativeView(): void {
this._tapHandler = null;
super.disposeNativeView();
}

get ios() {
Expand Down
31 changes: 16 additions & 15 deletions tns-core-modules/ui/core/view-base/view-base.ts
View file
Expand Up @@ -687,17 +687,22 @@ export abstract class ViewBase extends Observable implements ViewBaseDefinition
}

this._context = context;
let nativeView;
if (isAndroid) {
// const recycle = this.recycleNativeView;
// if (recycle === "always" || (recycle === "auto" && !this._disableNativeViewRecycling)) {
// nativeView = <android.view.View>getNativeView(context, this.typeName);
// }

if (!nativeView) {
nativeView = this.createNativeView();
}
// This will account for nativeView that is created in createNativeView, recycled
// or for backward compatability - set before _setupUI in iOS contructor.
let nativeView = this.nativeViewProtected;

// if (isAndroid) {
// const recycle = this.recycleNativeView;
// if (recycle === "always" || (recycle === "auto" && !this._disableNativeViewRecycling)) {
// nativeView = <android.view.View>getNativeView(context, this.typeName);
// }
// }
if (!nativeView) {
nativeView = this.createNativeView();
}

if (isAndroid) {
this._androidView = nativeView;
if (nativeView) {
if (this._isPaddingRelative === undefined) {
Expand Down Expand Up @@ -730,14 +735,10 @@ export abstract class ViewBase extends Observable implements ViewBaseDefinition
}
}
} else {
// TODO: Implement _createNativeView for iOS
nativeView = this.createNativeView();
this._iosView = nativeView || this.nativeViewProtected;
this._iosView = nativeView;
}

// This will account for nativeView that is created in createNativeView, recycled
// or for backward compatability - set before _setupUI in iOS contructor.
this.setNativeView(nativeView || this.nativeViewProtected);
this.setNativeView(nativeView);

if (this.parent) {
const nativeIndex = this.parent._childIndexToNativeChildIndex(atIndex);
Expand Down
2 changes: 1 addition & 1 deletion tns-core-modules/ui/core/view/view-common.ts
View file
Expand Up @@ -74,7 +74,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
private _measuredWidth: number;
private _measuredHeight: number;

private _isLayoutValid: boolean;
protected _isLayoutValid: boolean;
private _cssType: string;

private _localAnimations: Set<am.Animation>;
Expand Down
17 changes: 12 additions & 5 deletions tns-core-modules/ui/core/view/view.ios.ts
View file
Expand Up @@ -169,6 +169,14 @@ export class View extends ViewCommon {
}
}

get isLayoutValid(): boolean {
if (this.nativeViewProtected) {
return this._isLayoutValid;
}

return false;
}

public layoutNativeView(left: number, top: number, right: number, bottom: number): void {
if (!this.nativeViewProtected) {
return;
Expand Down Expand Up @@ -323,6 +331,8 @@ export class View extends ViewCommon {
return;
}

this._setupAsRootView({});

super._showNativeModalView(parentWithController, context, closeCallback, fullscreen, stretched);
let controller = this.viewController;
if (!controller) {
Expand All @@ -336,8 +346,6 @@ export class View extends ViewCommon {
this.viewController = controller;
}

this._setupAsRootView({});

if (fullscreen) {
controller.modalPresentationStyle = UIModalPresentationStyle.FullScreen;
} else {
Expand Down Expand Up @@ -536,9 +544,8 @@ export class CustomLayoutView extends View {

nativeViewProtected: UIView;

constructor() {
super();
this.nativeViewProtected = UIView.alloc().initWithFrame(iosUtils.getter(UIScreen, UIScreen.mainScreen).bounds);
createNativeView() {
return UIView.alloc().initWithFrame(iosUtils.getter(UIScreen, UIScreen.mainScreen).bounds);
}

get ios(): UIView {
Expand Down
11 changes: 5 additions & 6 deletions tns-core-modules/ui/date-picker/date-picker.android.ts
View file
Expand Up @@ -54,19 +54,18 @@ export class DatePicker extends DatePickerBase {
nativeViewProtected: android.widget.DatePicker;

public createNativeView() {
initializeDateChangedListener();
const picker = new android.widget.DatePicker(this._context);
picker.setCalendarViewShown(false);
const listener = new DateChangedListener(this);

picker.init(this.year, this.month - 1, this.day, listener);
(<any>picker).listener = listener;
return picker;
}

public initNativeView(): void {
super.initNativeView();
(<any>this.nativeViewProtected).listener.owner = this;
initializeDateChangedListener();
const nativeView = this.nativeViewProtected;
const listener = new DateChangedListener(this);
nativeView.init(this.year, this.month - 1, this.day, listener);
(<any>nativeView).listener = listener;
}

public disposeNativeView() {
Expand Down
20 changes: 14 additions & 6 deletions tns-core-modules/ui/date-picker/date-picker.ios.ts
View file
Expand Up @@ -11,14 +11,22 @@ export class DatePicker extends DatePickerBase {
private _changeHandler: NSObject;
public nativeViewProtected: UIDatePicker;

constructor() {
super();

this.nativeViewProtected = UIDatePicker.new();
this.nativeViewProtected.datePickerMode = UIDatePickerMode.Date;
public createNativeView() {
const picker = UIDatePicker.new();
picker.datePickerMode = UIDatePickerMode.Date;
return picker;
}

public initNativeView(): void {
super.initNativeView();
const nativeView = this.nativeViewProtected;
this._changeHandler = UIDatePickerChangeHandlerImpl.initWithOwner(new WeakRef(this));
this.nativeViewProtected.addTargetActionForControlEvents(this._changeHandler, "valueChanged", UIControlEvents.ValueChanged);
nativeView.addTargetActionForControlEvents(this._changeHandler, "valueChanged", UIControlEvents.ValueChanged);
}

public disposeNativeView() {
this._changeHandler = null;
super.disposeNativeView();
}

get ios(): UIDatePicker {
Expand Down
10 changes: 10 additions & 0 deletions tns-core-modules/ui/dialogs/dialogs-common.ts
View file
Expand Up @@ -2,6 +2,7 @@
import { View } from "../core/view";
import { Color } from "../../color";
import { Page } from "../page";
import { isIOS } from "../../platform";
import * as frameModule from "../frame";

export const STRING = "string";
Expand Down Expand Up @@ -67,6 +68,9 @@ export function getButtonColors(): { color: Color, backgroundColor: Color } {
if (!button) {
const Button = require("ui/button").Button;
button = new Button;
if (isIOS) {
button._setupUI({});
}
}

let buttonColor: Color;
Expand All @@ -82,6 +86,9 @@ export function getLabelColor(): Color {
if (!label) {
const Label = require("ui/label").Label;
label = new Label;
if (isIOS) {
label._setupUI({});
}
}

let labelColor: Color;
Expand All @@ -95,6 +102,9 @@ export function getTextFieldColor(): Color {
if (!textField) {
const TextField = require("ui/text-field").TextField;
textField = new TextField();
if (isIOS) {
textField._setupUI({});
}
}

let textFieldColor: Color;
Expand Down

0 comments on commit 46705ee

Please sign in to comment.