Как сохранить холст на телефоне и получить местоположение изображения с помощью телефонной паузы?

Как можно сохранить холст в телефонном альбоме (фотопленка и т. д.) с помощью Phonegap?

И при сохранении, как мне получить URL-адрес изображения с помощью Cordova? Какие плагины я должен рассмотреть для этого?

Способ 1. Плагин Canvas2Image

С помощью этого плагина вы можете сохранить холст в библиотеке телефона, используя:

<canvas id="myCanvas" width="165px" height="145px"></canvas>

function onDeviceReady()
{
    window.canvas2ImagePlugin.saveImageDataToLibrary(
        function(msg){
            console.log(msg);
        },
        function(err){
            console.log(err);
        },
        document.getElementById('myCanvas')
    );
}

Однако непонятно, как передается или возвращается imageURI после сохранения?

ОБНОВЛЕНИЕ 23/02. Я пробовал следующее, но он никогда не достигает моего успешного обратного вызова:

$scope.done = функция () {

    // todo: iterate over cloaks
    $ionicLoading.show({
            template: 'Saving images...'
    });


    // #issue: callback is not called
    saveCanvasToPhone().then(successCallback, errorCallback);

    var successCallback = function(output) {
        $ionicLoading.hide();

        window.alert("success call back: " + output) // never reached

        $scope.addNewImage(output);
        $state.go('tab.dash', {}, {reload: true}); // does not work
        $state.go('tab.dash') // does not work

        $scope.refreshLocalstorage();

    }

    // #issue4-nl: not working
    var errorCallback = function(error) {
        $ionicLoading.hide();
        console.log("error cb: "+ error)
        window.alert("error cb: " + error)
    }

    function saveCanvasToPhone() {



        var defer = $q.defer();

        try {
            window.canvas2ImagePlugin.saveImageDataToLibrary(
            function(output){

                $scope.addNewImage(output); // does not work to save imagepath on localstorage

                $scope.debugEntryOther = output // works fine
                defer.resolve(output)
                $ionicLoading.hide()
            },
            function(error){
                defer.reject(error)
                $ionicLoading.hide()
                window.alert(error)
            },
            document.getElementById('canvas')
        );
        } catch(error) {
                defer.reject(error)
                $ionicLoading.hide()
                console.log("saveCanvasToPhone: trycatch: error: " + error)
        }
        return defer.promise;
    } // save canvas to phone
} // done

cordova angularjs phonegap-plugins
person AMG    schedule 23.02.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

К сожалению, плагин Canvas2Image изначально был разработан для сохранения холста в галерее, а не для сохранения в файл и последующей работы с файлом.

Я не нашел альтернатив этому плагину (и особо не искал), но вы можете получить путь к файлу, в котором файл был сохранен.

Это зависит от того, на какую платформу вы ориентируетесь:

  • Для андроида путь к файлу передается в параметре 'msg' функции успеха
  • Для Windows Phone параметр «msg» возвращает строку «Изображение сохранено:», за которой следует путь к файлу. Итак, вам нужно разделить строку.
  • Для IOS это фактически невозможно с оригинальным плагином, но есть несколько форков, позволяющих это сделать.

Мне сообщили, что автору скоро понадобится некоторое время, чтобы улучшить свой плагин, поэтому я уверен, что скоро можно будет получить путь к файлу с «официальным» плагином даже для IOS.

А пока вы можете использовать мою вилку. В этом случае для IOS путь возвращается в параметре msg, как и для android.

person QuickFix    schedule 23.02.2015
comment
Спасибо за это. Это звучит тревожно. Я попробовал это, но он не доходит до моего успешного обратного вызова, см. мой обновленный пост с комментариями о том, где это работает, а где нет. Может быть, есть другой способ справиться с холстом? возможно, преобразовать в изображение, а затем добавить плагин для сохранения изображений (загрузить из локального хранилища)? тогда мне понадобится холст для изображения в браузере...? - person AMG; 23.02.2015
comment
На самом деле вы могли бы иметь дело с холстом только с HTML5, но причина, по которой мне понадобился этот плагин, заключалась в том, что поддержка холста в веб-просмотре Android не работала, если не ориентироваться только на устройства kitkat. - person QuickFix; 23.02.2015