On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime...

NativeScript On Fire

Cross-Platform Development

Cross-Plattform Entwicklung

MobiDev. Angular Native. https://mobidev.biz/blog/angular-native-nativescript-with-angular-2

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System

calls native API accesses native objects

Dispatcher

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System

calls native API accesses native objects

Dispatcher

Button button = new Button(getApplicationContext());

var button = new android.widget.Button(getApplicationContext())

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System

calls native API accesses native objects

calls callback functioncalls JavaScript functions Dispatcher

Button button = new Button(getApplicationContext());

var button = new android.widget.Button(getApplicationContext())

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

platform-agnostic platform-specific

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

AOT

Routing Components

TypeScript

Any JS library

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

AOT

Routing Components

TypeScript

Any native .... interface.. UI component.. library

Any JS library

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

AOT

Routing Components

TypeScript

Any native .... interface.. UI component.. library

Any JS library

Live Reload

Over-the-air updates

Zero Day Support

NativeScriptN

React NativeR

React NativeR

...

public class ReactButtonManager extends SimpleViewManager<ReactButtonView> {

public static final String REACT_CLASS = "RCTButtonView";

@Override public String getName() { return REACT_CLASS; }

@Override public ReactButtonView createViewInstance(ThemedReactContext context) { return new ReactButtonView(context, new Button(), mCallerContext); } ...}

NativeScriptN

...export class MyButton extends MyButtonBase {

// added for TypeScript intellisense. nativeView: android.widget.Button;

public createNativeView(): Object { // Initialize ClickListener. initializeClickListener();

// Create new instance of android.widget.Button. const button = new android.widget.Button(this._context);

// set onClickListener on the nativeView. button.setOnClickListener(clickListener);

return button; } ...}

N

Thanks!Questions or remarks??

NativeScriptN