Nativescript：TypeError：无法读取未定义的属性“LayoutParams”

Posted 2023-04-13

【中文标题】Nativescript：TypeError：无法读取未定义的属性“LayoutParams”

【英文标题】：Nativescript : TypeError: Cannot read property 'LayoutParams' of undefined

【发布时间】：2017-03-15 10:13:07

【问题描述】：

我正在使用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 框架：函数：'StylePropertyChangedHandler.applyProperty'，文件：'/data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js'， 行：1326，列：14 框架：函数：'Style._applyStyleProperty'，文件：'/data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js'， 行：1086，列：25 框架：函数：'Style._applyProperty'，文件：'/data/data/org.nativescript.finlyng/files/app/tns_modules/ui/styling/style.js'， 行：1049，列：14

我应该如何解决这个问题？ 谢谢

【参考方案1】：

您的代码很好，但为了使用 FlexboxLayout 和 ImageAsset 模块，您需要在应用程序中使用 tns-core-modules@next（因为这些功能不是官方的已发布并将与 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 和 platforms 文件夹并重建您的应用。

【讨论】：

我已经安装了 tns-core-modules@next，尽管如此。

或许你还需要tns-core-modules-widgets@next？

@Manijak 也有。没有帮助。