nativescript-wikitude
由 b.ingham 编写 | v7.2.1-1.8.5
您出色的 NativeScript 插件。
npm i --save nativescript-wikitude

nativescript-wikitude

npm version

NPM

提供对 Wikitude AR 的 NativeScript 访问。

版本格式如下 ${wikitude-version}-${plugin-version} 例如: 7.2.1-1.1.0 表示 Wikitude 版本 7.2.1,插件版本 1.1.0。

截图即将推出!

先决条件 / 要求

权限

在您可以使用此插件之前,您应该确保您的应用程序具有相机和位置的权限,为了在 Android 和 iOS 上轻松完成此操作,您可以使用此插件 @spartadigital/nativescript-permissions

运行演示

我们在演示应用程序中包含了一个非常基本的 AR 示例,

但如果您想从 wikitude 示例 中检查一些更高级的内容并将它们放入 demo/app/wikitude... 然后更新 Nativescript-angular 的 items.component.ts 或 Regular Nativescript 的 main-view-model.ts 中的 URL 引用。

然后前往 Wikitude 网站 获取试用许可证,并将其放在 demo/app/main-view-model.ts 的第 13 行

安装

要为您的项目安装,您可以使用

tns plugin add nativescript-wikitude

对于 Nativescript Angular 项目,您需要在您的 app.component.ts 中导入元素

    import { Wikitude } from 'nativescript-wikitude';
// ...snip....
registerElement('Wikitude', () => Wikitude);

然后在您的 ar.component.html

    <Wikitude [url]="WikitudeURL" 
(WorldLoaded)="onWorldLoaded($event)"
(JSONReceived)="onJSON($event)">

</Wikitude>

并在您的 ar.component.ts

    import { Wikitude } from 'nativescript-wikitude';

// ...snip...

WikitudeInstance: Wikitude;
WikitudeURL: string = "~/wikitude_world/index.html";

onWorldLoaded($event) {
this.WikitudeInstance = $event.owner; // or you can use Angular's ViewChild
}

onJSON($event) {
console.log(JSON.stringify($event.data));
}

// ...snip...

并在您的应用程序的某个位置定义 Wikitude 许可证,您可以从 Wikitude(免费试用许可证)获取一个

    (global as any).wikitudeLicense: string = "YOUR_LICENSE_KEY_HERE"

然后,您的 Nativescript 应用程序中就出现了 Wikitude AR!

使用方法

使用您自己的位置提供者

默认情况下,此插件有一个基本的位置提供者,如果这不符合您的目的,您可以在完全加载后禁用它,以下代码


onWorldLoaded($event) {
this.WikitudeInstance = $event.owner; // or you can use Angular's ViewChild
this.WikitudeInstance.disableLocationProvider();
}

禁用后,基于地理定位的 AR 将不会工作,除非您提供自己的位置,这可以通过以下方式实现

    this.WikitudeInstance.setLocation({ latitude, longitude, altitude, accuracy });

如果您需要一个单一的位置状态,这将很有用。

禁用后,您可以使用以下代码重新启用它

    this.WikitudeInstance.enableLocationProvider();

TODO

  • 插件 API 暴露,不确定如何进行,Wikitude 允许使用内置的 CPP 插件,并通过其插件 API(插件的一个例子是面部识别)进行链接。我不确定如何允许用户这样做。任何建议都将受到欢迎...
  • 检测设备是否需要校准:目前由于 Android 导致尝试监听此事件时崩溃而被阻止。
  • 相机事件:对于开发人员来说,检查相机打开、关闭和任何崩溃可能很有用。
  • 设置 Wikitude LicenseKey 和必需功能的一种更好的方式。

API

属性

属性 默认值 描述
url "" Wikitude "ARWorld" 的 URL
功能 ` Features.ImageTracking Features.InstantTracking

函数

函数 参数 描述
setLocation() { latitude: number, longitude: number, altitude: number, accuracy: number } 在 ARWorld 中设置位置
hasFeature() feature : number 检查您的设备是否可以支持这些功能(或您的许可证是否支持它)
loadUrl() url: string 在 Wikitude WebView 中加载 URL
reload() 重新加载当前 Wikitude WebView
clearCache() 清除 Wikitude 缓存
toggleFlash() 切换设备闪光灯
switchCamera() 切换 Wikitude 使用的摄像头
captureScreen() captureWebViewContent: boolean 捕获当前视图,也可以捕获 WebView 内容
disableLocationProvider() 禁用位置提供者(您需要提供自己的位置提供者以使 GEO/POI 功能正常工作)
enableLocationProvider() 启用位置提供者

事件

事件 描述 类型
WorldLoadSuccess 当 ARWorld 成功加载时触发 WorldLoadSuccessEventData
WorldLoadFail 在加载 AR World 时发生错误时触发 WorldLoadFailedEventData
JSONReceived 当 ARWorld 发送 JSON 对象时触发 JSONReceivedEventData
ScreenCaptureSuccess 当屏幕被捕获时触发 ScreenCaptureSuccessEventData
ScreenCaptureFail 当 Wikitude 无法捕获屏幕时触发 ScreenCaptureFailedEventData

所有这些都可以从 index.d.ts 中导入。

许可

Wikitude 是 (c) Wikitude GmbH。在使用前,请参阅他们的 最终用户许可协议

Apache 许可证版本 2.0,2004 年 1 月