19
NativeScript On Fire

On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

  • Upload
    others

  • View
    14

  • Download
    0

Embed Size (px)

Citation preview

Page 1: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

NativeScript On Fire

Page 2: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

Cross-Platform Development

Page 3: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

Cross-Plattform Entwicklung

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

Page 4: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Page 5: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System

calls native API accesses native objects

Dispatcher

Page 6: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

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())

Page 7: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new 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())

Page 8: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

Page 9: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

platform-agnostic platform-specific

Page 10: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

JavaScript Engine

NativeScriptN

Hooks App code

NativeScript Runtime

System Dispatcher

Button

ListView

FileSystem

Modules

AOT

Routing Components

TypeScript

Any JS library

Page 11: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

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

Page 12: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

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

Page 13: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

NativeScriptN

Page 14: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

React NativeR

Page 15: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

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); } ...}

Page 16: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

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; } ...}

Page 17: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

N

Page 18: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

Thanks!Questions or remarks??

Page 19: On Fire NativeScript - nils-mehlhorn.de · NativeScript N App code Hooks NativeScript Runtime System calls native API accesses native objects Dispatcher Button button = new Button(getApplicationContext());

NativeScriptN