android - 如何在 Nativescript 中显示 base64 字符串并将其绑定(bind)到图像作为源?

标签 android typescript nativescript

我试图在我的 View 中显示和绑定(bind) base64 图像作为 ImageSource,但它根本没有显示。我在文档中找不到任何有用的信息..我做错了什么吗?

imageSource 是应该保存 Image src 数据的属性..

这是 View :

<Page loaded = "loaded" xmlns = "http://schemas.nativescript.org/tns.xsd" >
    <StackLayout>
        <TextField hint = "String for encoding!" text = "{{ message }}" />
        <Button  tap = "{{ onGenerateQrTap }}" text = "Generate QR" class = "button" />
        <Image src = "{{ imageSource }} " />
    </StackLayout>
</Page>

这是 View 背后的代码:

import { Page } from 'ui/page';
import { EventData } from 'data/observable';
import { QrGeneratorViewModel } from '../../ViewModels/QrGeneratorViewModel';
import { Button } from 'ui/button';
import { Image } from 'ui/image';

let viewModel =  new QrGeneratorViewModel();

export function loaded(args: EventData) {
  let page = <Page>args.object;
  page.bindingContext = viewModel;
}

这是 ViewModel:

import { Observable } from 'data/observable';
import { QrGenerator } from '../Common/QrGenerator';
import { ImageSource } from "image-source";

export class QrGeneratorViewModel extends Observable {

    private _message: string;
    private _qrGenerator: QrGenerator.Generator;
    private _imageBase64String: string;
    private _imageSource: ImageSource;

    constructor() {
        super();
        this._qrGenerator = new QrGenerator.Generator();
        this._imageSource = new ImageSource();
    }

    get message() {
        return this._message;
    }

    set message(newMessage: string) {
        this._message = newMessage;
    }

    get imageSource(): ImageSource {
        return this._imageSource;
    }

    public onGenerateQrTap(): void {
        this._imageBase64String = this._qrGenerator.qr(this._message);
        this._imageSource.loadFromBase64(this._imageBase64String);
    }

}

最佳答案

快速浏览一下代码,您似乎没有设置要更新的 _imageSource。您在 ImageSource 实例上调用该方法,但没有设置 UI 绑定(bind)。我会尝试为 _imageSource 设置一个 setter 或使用 Observable 设置它:

this.set('imageSource', this._imageSource.loadFromBase64(this._imageBase64String);

关于android - 如何在 Nativescript 中显示 base64 字符串并将其绑定(bind)到图像作为源?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40328606/

相关文章:

Angular7 和 NgbModal : how to remove default auto focus

Nativescript 6.1 在向页面添加自定义 css 文件时返回错误

android - 在android中访问gridview内的单元格

android - 将语音转换为发音的最佳方式

android - 通过 BroadcastReceiver 替代 FileObserver?

Typescript - 将类类型存储为变量,以便从中创建对象或其他等效功能

javascript - 如何让网页上的图片自动刷新

android - Nativescript doInBackground被抛出并导致OutOfMemory错误

javascript - Nativescript ScrollView 不滚动

android - 尝试编译 AOSP 7.1.1 第 6 版时缺少 'libaudiopolicyservice_intermediates"?