我使用this
建立了相机组件HTML
<StackLayout exampleTitle toggleNavButtonrm>
<ScrollView>
<!-- >> camera-module-html -->
<FlexboxLayout flexDirection="column-reverse">
<Image [src]="imageTaken" flexGrow="3" class="img-rounded"></Image>
<Button text="Take Photo" class="btn btn-primary btn-active" (tap)="onTakePhoto()" flexGrow="1"></Button>
<Button text="Request permissions" class="btn btn-primary btn-active" (tap)="onRequestPermissions()" flexGrow="1"></Button>
</FlexboxLayout>
<!-- << camera-module-html -->
</ScrollView>
</StackLayout>
component.ts
import { Component } from "@angular/core";
import { ImageAsset } from "image-asset";
import * as camera from "nativescript-camera";
@Component({
selector: 'using-camera-component',
templateUrl: 'pages/createexpense/expense-photo.html'
})
export class ExpensePhotoComponent {
public imageTaken: ImageAsset;
public saveToGallery: boolean = true;
public keepAspectRatio: boolean = true;
public width: number = 300;
public height: number = 300;
onTakePhoto() {
var options = { width: this.width, height: this.height, keepAspectRatio: this.keepAspectRatio, saveToGallery: this.saveToGallery };
camera.takePicture(options)
.then(imageAsset => {
this.imageTaken = imageAsset;
console.log("Size: " + imageAsset.options.width + "x" + imageAsset.options.height);
}).catch(err => {
console.log(err.message);
})
}
onRequestPermissions() {
camera.requestPermissions();
}
onCheckForCamera() {
var isCameraAvailable = camera.isAvailable();
console.log("Is camera hardware available: " + isCameraAvailable);
}
}
这是我得到的痕迹:
java.lang.RuntimeException: Unable to resume activity {org.nativescript.finlyng/com.tns.NativeScriptActivity}:
com.tns.NativeScriptException: 调用js方法onCreateView失败
TypeError: Cannot read property 'LayoutParams' of undefined File: "/data/data/org.nativescript.finlyng/files/app/tns_modules/ui/core/view.js,
行:507,专栏:68
StackTrace: Frame: function:'ViewStyler.setNativeLayoutParamsProperty', file:'/data/data/org.nativescript.finlyng/files/app/tns_modules/ui/core/view.js',
行:507,栏目:69 框架:功能:&#39; StylePropertyChangedHandler.applyProperty&#39;,file:&#39; /data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js', 行:1326,专栏:14 框架:功能:&#39; Style._applyStyleProperty&#39;,file:&#39; /data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js', 行:1086,专栏:25 框架:功能:&#39; Style._applyProperty&#39;,file:&#39; /data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js', line:1049,column:14
我该如何解决这个问题? 感谢
答案 0 :(得分:2)
您的代码很好,但为了使用 FlexboxLayout 和 ImageAsset 模块,您需要在应用程序中使用tns-core-modules @(因为这些功能不正式已发布,将与NativeScript 2.4.0一起出现
请注意,您引用的示例应用程序在其package.json
中具有以下依赖关系"tns-core-modules": "next"
尝试以这种方式更新tns-core-modules:
tns plugin remove tns-core-modules
tns plugin add tns-core-modules@next
然后删除 node_modules 和 平台 文件夹并重建您的应用。