1 
var myImage = canvas.toDataURL("image/png");

myImage画像バイトがpng形式でエンコードされていると思いますがmyImage、ファイルとして（画像フォルダーに）保存する方法は？

4

2 に答える 2

6

を使用する代わりに.toDataUrl、次を使用する必要があります.msToBlob。

var blob = canvas.msToBlob();

次に、これをディスクに書き出す必要があります。

var output;
var input;
var outputStream;

Windows.Storage.ApplicationData.current.localFolder.createFileAsync("yourFile", 
          Windows.Storage.CreationCollisionOption.replaceExisting).
    then(function(file) {
        return file.openAsync(Windows.Storage.FileAccessMode.readWrite);
    }).then(function(stream) {
        outputStream = stream;
        output = stream.getOutputStreamAt(0);
        input = blob.msDetachStream();
        return Windows.Storage.Streams.RandomAccessStream.copyAsync(input, output);
    }).then(function() {
        return output.flushAsync();
    }).done(function() {
        input.close();
        output.close();
        outputStream.close();
    });

アプリケーション アプリ データ フォルダーで、イメージがディスクに書き込まれます。

他の場所に配置したい場合 (私の写真など)、他のストレージ フォルダのいずれかを使用する必要があります。ここでサンプルを参照してください。写真ライブラリにアクセスするには、その機能をマニフェストに追加する必要があることに注意してください (VS の package.appxmanifest エディターのチェックボックスのみ)。

出力ファイルをより複雑に操作するための、他にも多くのイメージング オプションがあります。コードについては、イメージング サンプルを参照してください。

于 2012-09-01T18:15:35.583 に答える
1

これは、単純な画像処理のサンプルの中で最も役立つコードであることがわかりました。キャンバス データをダンプするだけでなく、PNG または JPG にエンコードできます。

Helpers.getFileFromSavePickerAsync().then(function (file) {
    filename = file.name;

    switch (file.fileType) {
        case ".jpg":
            encoderId = Imaging.BitmapEncoder.jpegEncoderId;
            break;
        case ".bmp":
            encoderId = Imaging.BitmapEncoder.bmpEncoderId;
            break;
        case ".png":
        default:
            encoderId = Imaging.BitmapEncoder.pngEncoderId;
            break;
    }

    return file.openAsync(Windows.Storage.FileAccessMode.readWrite);
}).then(function (_stream) {
    stream = _stream;

    // BitmapEncoder expects an empty output stream; the user may have selected a
    // pre-existing file.
    stream.size = 0;
    return Imaging.BitmapEncoder.createAsync(encoderId, stream);
}).then(function (encoder) {
    var width = id("outputCanvas").width;
    var height = id("outputCanvas").height;
    var outputPixelData = Context.getImageData(0, 0, width, height);

    encoder.setPixelData(
        Imaging.BitmapPixelFormat.rgba8,
        Imaging.BitmapAlphaMode.straight,
        width,
        height,
        96, // Horizontal DPI
        96, // Vertical DPI
        outputPixelData.data
        );

    return encoder.flushAsync();
}).then(function () {
    WinJS.log && WinJS.log("Saved new file: " + filename, "sample", "status");
    id("buttonSave").disabled = false;
    id("buttonRender").disabled = false;
}).then(null, function (error) {
    WinJS.log && WinJS.log("Failed to save file: " + error.message, "sample", "error");
}).done(function () {
    stream && stream.close();
});
于 2013-06-04T00:32:14.923 に答える