Question

我想在NativeScript中开发一个简单的应用程序，它显示存储在SD卡存储中的图像数组。我可以使用＆＃34; file-system＆＃34;来访问这些文件。 NativeScript的模块，但我无法显示它。

我在这里告诉你我的代码

主视-model.js

var fs = require("file-system");
var imageModule = require("ui/image");
var Observable = require("data/observable").Observable;
var imageSource = require("image-source");




var mediaFiles=[];
var cont=0;
var viewModel;
function createViewModel() {
    viewModel = new Observable();
    var sdcard = fs.path.join(android.os.Environment.getExternalStoragePublicDirectory(android.os.Environment.DIRECTORY_DCIM).getAbsolutePath(), "Camera");
    var folder = fs.Folder.fromPath(sdcard);
    folder.getEntities()
    .then(function (entities) {
        // entities is array with the document's files and folders.
        entities.forEach(function (entity) {
            if (entity.extension==".png" || entity.extension==".jpg" ){
                mediaFiles.push(entity.path);
            }
        });
        //transicion();
    }, function (error) {
    });
}
function transicion() 
{ 
    //while (cont < mediaFiles.length){
    cont++;
    mostrarImagen(mediaFiles[cont]);
    //transicion() 

}
function mostrarImagen(ImagePath){
    console.log("muestro imagen "+ ImagePath);
    var img = imageSource.fromFile(ImagePath);
    console.log(JSON.stringify(img));
    viewModel.set("image", image);
    page.bindingContext = viewModel;

    //if (cont<mediaFiles.length-1)
  //  setTimeout("transicion()",2000);
}
exports.createViewModel = createViewModel;

主page.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo">
  <StackLayout>
    <Label text="Portaretratos" class="title"/>
       <Image src="{{ image }}" />
    </StackLayout>
</Page>

Answer 1

尝试将viewModel.set("image", image);更改为viewModel.set("image", ImagePath);

Answer 2

在img：

中使用image代替viewModel.set()

//You're creating 'img' here
var img = imageSource.fromFile(ImagePath);

//Logging 'img' here
console.log(JSON.stringify(img));

//And using 'image' here. (Use img instead)
viewModel.set("image", image);

Answer 3

在函数mostrarImagen(ImagePath)中，执行以下操作：

var ImageModule = require("ui/image"); 
function mostrarImagen(ImagePath){
    var img = new ImageModule.Image();
    img.imageSource = imageSource.fromFile(ImagePath);
    viewModel.set("image", img.src);
    page.bindingContext = viewModel;
}

希望这有帮助。

在NativeScript中显示sdcard中的图像

3 个答案: