@nativescript/rive
Version:
Rive for NativeScript
363 lines • 14.3 kB
JavaScript
import { knownFolders, Utils } from '@nativescript/core';
import { RiveEvents, RiveViewBase, TypeRiveAlignment, TypeRiveDirection, TypeRiveFit, TypeRiveLoop, alignmentProperty, fitProperty, inputValueProperty, srcProperty } from './common';
export { TypeRiveAlignment, TypeRiveDirection, TypeRiveFit, TypeRiveLoop } from './common';
export class RiveView extends RiveViewBase {
constructor() {
super();
this.events = new RiveEvents(this);
}
createNativeView() {
this.ctrl = NSCRiveController.alloc().init();
return this.ctrl.view;
}
disposeNativeView() {
super.disposeNativeView();
this.stop();
this.riveFileDelegate = null;
this.riveStateMachineDelegate = null;
this.ctrl = null;
this.riveFile = null;
}
async [srcProperty.setNative](src) {
if (!src) {
console.log('No rive file specified');
}
else if (src[0] === '~' || src[0] === '@') {
if (!/.(riv)$/.test(src)) {
src += '.riv';
}
const app = knownFolders.currentApp();
const filename = src.replace(/^.*[\\\/]/, '');
const folder = app.getFolder(src.substring(2).replace(filename, ''));
const file = folder.getFile(filename);
// TODO: fix typings in 8.5.1 to includes these new file apis
// const bytes = await file.readBufferAsync();
const bytes = interop.bufferFromData(NSData.dataWithContentsOfFile(file.path));
this.riveFile = RiveFile.alloc().initWithBytesByteLengthLoadCdnError(bytes, bytes.byteLength, false);
this._init();
}
else if (src.startsWith(Utils.RESOURCE_PREFIX)) {
this.fileName = src.replace(Utils.RESOURCE_PREFIX, '').replace('.riv', '');
this._init();
}
else if (src.startsWith('http')) {
this.riveFileDelegate = RiveFileDelegateImpl.initWithOwner(new WeakRef(this));
this.riveFile = RiveFile.alloc().initWithHttpUrlLoadCdnWithDelegate(src, false, this.riveFileDelegate);
}
else {
console.log('[ui-rive] File not supported');
}
}
riveFileHttpSrcDidLoad(riveFile) {
this._init();
}
[fitProperty.getDefault]() {
return TypeRiveFit.CONTAIN;
}
[fitProperty.setNative](value) {
this.fit = value;
// this.nativeViewProtected.setFit(value);
}
[alignmentProperty.getDefault]() {
return TypeRiveAlignment.CENTER;
}
[alignmentProperty.setNative](value) {
// this.nativeViewProtected.setAlignment(value);
}
[inputValueProperty.setNative](value) {
this.setInputValue(value);
}
triggerInput(name) {
if (this.ctrl && name) {
this.ctrl.triggerInputWithName(name);
}
}
triggerInputValue(name, value) {
this._setInputValue(name, value);
}
setInputValue(value) {
this._setInputValue(this.input, value);
}
_setInputValue(name, value) {
this.input = name;
if (this.input && this.ctrl) {
if (Utils.isBoolean(value) || ['true', 'false'].includes(value)) {
this.ctrl.setInputWithNameBinary(this.input, value === true || value === 'true');
}
else {
const number = Number(value);
if (!isNaN(number)) {
this.ctrl.setInputWithNameNumber(this.input, number);
}
}
}
}
setTextRunValue(name, value) {
this.ctrl.setTextWithNameValueError(name, value);
}
_init() {
// console.log('init autoPlay:', this.autoPlay);
// console.log('init this.fit:', this.fit);
if (this.riveFile) {
this.ctrl.setModelWithFileFit(this.riveFile, this.getFit(this.fit));
}
else if (this.fileName) {
this.ctrl.setModelResourceWithNameFit(this.fileName, this.getFit(this.fit));
}
if (this.artboard || this.animation || this.stateMachine) {
this.ctrl.configureModelWithArtboardStateMachineAnimation(this.artboard, this.stateMachine, this.animation);
}
this.riveStateMachineDelegate = RiveStateMachineDelegateImpl.initWithOwner(new WeakRef(this));
this.ctrl.setDelegateWithDelegate(this.riveStateMachineDelegate);
if (this.input) {
if (this.inputValue) {
this.setInputValue(this.inputValue);
}
else {
this.ctrl.triggerInputWithName(this.input);
}
}
if (this.autoPlay) {
this.play(this.loop, this.direction);
}
}
isPlaying() {
if (this.ctrl) {
return this.ctrl.isPlaying();
}
return false;
}
play(loop = TypeRiveLoop.AUTO, direction = TypeRiveDirection.AUTO, settleInitialState = true) {
if (this.ctrl) {
// console.log('looop:', loop)
this.ctrl.playWithDirectionLoopName(this.getDirection(direction), this.getLoop(loop), null);
}
}
playWithAnimations(animationNames = [], loop = TypeRiveLoop.AUTO, direction = TypeRiveDirection.AUTO, areStateMachines = false, settleInitialState = true) {
// if (Array.isArray(animationNames)) {
// this.nativeViewProtected.play(this.buildList(animationNames), this.getLoop(loop), this.getDirection(direction), areStateMachines, settleInitialState)
// } else if (typeof animationNames === 'string') {
// this.nativeViewProtected.play(animationNames, this.getLoop(loop), this.getDirection(direction), areStateMachines, settleInitialState)
// }
}
stop() {
if (this.ctrl) {
this.ctrl.stop();
}
}
stopWithAnimations(animationNames = [], areStateMachines = false) {
if (this.ctrl) {
this.ctrl.stop();
}
// if (Array.isArray(animationNames)) {
// this.nativeViewProtected.stop(this.buildList(animationNames), areStateMachines);
// } else if (typeof animationNames === 'string') {
// this.nativeViewProtected.stop(animationNames, areStateMachines);
// }
}
pause() {
if (this.ctrl) {
this.ctrl.pause();
}
}
pauseWithAnimations(animationNames = [], areStateMachines = false) {
// if (Array.isArray(animationNames)) {
// this.nativeViewProtected.pause(this.buildList(animationNames), areStateMachines);
// } else if (typeof animationNames === 'string') {
// this.nativeViewProtected.pause(animationNames, areStateMachines);
// }
}
reset() {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.reset();
// }
}
fireState(stateMachineName, inputName) {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.fireState(stateMachineName, inputName);
// }
}
setBooleanState(stateMachineName, inputName, value) {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.setBooleanState(stateMachineName, inputName, value);
// }
}
setNumberState(stateMachineName, inputName, value) {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.setNumberState(stateMachineName, inputName, value);
// }
}
getStateMachines() {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.getStateMachines();
// }
}
getPlayingStateMachines() {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.getPlayingStateMachines();
// }
}
getAnimations() {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.getAnimations();
// }
}
getPlayingAnimations() {
// if (this.nativeViewProtected) {
// this.nativeViewProtected.getPlayingAnimations();
// }
}
addListener() {
// if (!this.listener) {
// this.listener = new Listener(this);
// this.nativeViewProtected.registerListener(this.listener);
// }
}
buildList(array) {
const animations = new java.util.ArrayList();
array.forEach((item) => animations.add(item));
return animations;
}
getLoop(riveLoop) {
switch (riveLoop) {
case TypeRiveLoop.ONESHOT:
return 'oneShot';
case TypeRiveLoop.LOOP:
return 'loop';
case TypeRiveLoop.PINGPONG:
return 'pingPong';
case TypeRiveLoop.NONE:
return 'none';
default:
return null;
}
}
getDirection(riveDirection) {
switch (riveDirection) {
case TypeRiveDirection.BACKWARDS:
return -1;
case TypeRiveDirection.FORWARDS:
return 1;
default:
return 0;
}
}
getFit(riveFit) {
switch (riveFit) {
case TypeRiveFit.FILL:
return 0 /* RiveFit.fill */;
case TypeRiveFit.CONTAIN:
return 1 /* RiveFit.contain */;
case TypeRiveFit.COVER:
return 2 /* RiveFit.cover */;
case TypeRiveFit.FIT_WIDTH:
return 4 /* RiveFit.fitWidth */;
case TypeRiveFit.FIT_HEIGHT:
return 3 /* RiveFit.fitHeight */;
case TypeRiveFit.SCALE_DOWN:
return 5 /* RiveFit.scaleDown */;
default:
return 6 /* RiveFit.noFit */;
}
}
getAlignment(riveAlignment) {
//: Alignment {
// switch (riveAlignment) {
// case RiveAlignment.TOP_LEFT:
// return Alignment.TOP_LEFT;
// case RiveAlignment.TOP_CENTER:
// return Alignment.TOP_CENTER;
// case RiveAlignment.TOP_RIGHT:
// return Alignment.TOP_RIGHT;
// case RiveAlignment.CENTER_LEFT:
// return Alignment.CENTER_LEFT;
// case RiveAlignment.CENTER_RIGHT:
// return Alignment.CENTER_RIGHT;
// case RiveAlignment.BOTTOM_LEFT:
// return Alignment.BOTTOM_LEFT;
// case RiveAlignment.BOTTOM_RIGHT:
// return Alignment.BOTTOM_RIGHT;
// default:
// return Alignment.CENTER;
// }
}
}
var RiveFileDelegateImpl = /** @class */ (function (_super) {
__extends(RiveFileDelegateImpl, _super);
function RiveFileDelegateImpl() {
return _super !== null && _super.apply(this, arguments) || this;
}
RiveFileDelegateImpl.initWithOwner = function (owner) {
var delegate = RiveFileDelegateImpl.new();
delegate._owner = owner;
return delegate;
};
RiveFileDelegateImpl.prototype.riveFileDidLoadError = function (riveFile) {
console.log('riveFileDidLoadError:', riveFile.isLoaded);
var owner = this._owner.deref();
if (owner) {
if (riveFile.isLoaded) {
owner.riveFileHttpSrcDidLoad(riveFile);
}
}
return riveFile.isLoaded;
};
RiveFileDelegateImpl.ObjCProtocols = [RiveFileDelegate];
return RiveFileDelegateImpl;
}(NSObject));
var RiveStateMachineDelegateImpl = /** @class */ (function (_super) {
__extends(RiveStateMachineDelegateImpl, _super);
function RiveStateMachineDelegateImpl() {
return _super !== null && _super.apply(this, arguments) || this;
}
RiveStateMachineDelegateImpl.initWithOwner = function (owner) {
var delegate = RiveStateMachineDelegateImpl.new();
delegate._owner = owner;
return delegate;
};
RiveStateMachineDelegateImpl.prototype.stateMachineDidChangeState = function (stateMachine, stateName) {
console.log('stateMachineDidChangeState:', stateName);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.stateChangedEvent, { stateMachine: stateMachine, stateName: stateName });
}
};
RiveStateMachineDelegateImpl.prototype.stateMachineReceivedInput = function (stateMachine, input) {
console.log('stateMachineReceivedInput:', input);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.receivedInputEvent, { stateMachine: stateMachine, input: input });
}
};
RiveStateMachineDelegateImpl.prototype.touchBeganOnArtboardAtLocation = function (artboard, location) {
console.log('touchBeganOnArtboardAtLocation:', location);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.touchBeganEvent, { artboard: artboard, location: location });
}
};
RiveStateMachineDelegateImpl.prototype.touchCancelledOnArtboardAtLocation = function (artboard, location) {
console.log('touchCancelledOnArtboardAtLocation:', location);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.touchCancelledEvent, { artboard: artboard, location: location });
}
};
RiveStateMachineDelegateImpl.prototype.touchEndedOnArtboardAtLocation = function (artboard, location) {
console.log('touchEndedOnArtboardAtLocation:', location);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.touchEndedEvent, { artboard: artboard, location: location });
}
};
RiveStateMachineDelegateImpl.prototype.touchMovedOnArtboardAtLocation = function (artboard, location) {
console.log('touchMovedOnArtboardAtLocation:', location);
var owner = this._owner.deref();
if (owner) {
owner.events.notifyEvent(RiveEvents.touchMovedEvent, { artboard: artboard, location: location });
}
};
RiveStateMachineDelegateImpl.ObjCProtocols = [RiveStateMachineDelegate];
return RiveStateMachineDelegateImpl;
}(NSObject));
//# sourceMappingURL=index.ios.js.map