0

私はWindowsの携帯電話の開発で新しく、私はそれにphonegap/cordovaを使用して私のアプリケーションを移植する必要があります。私のコードのほとんどはAndroid/iOSとwinphoneでも動作しますが、このFileOpenPickerではブロックされています。 私はwinjs 2.1を使用しています。この機能が必要なページにいるときにスクリプトを呼び出す準備をしたいと思います。FileOpenPicker WP8.1 - どのように

私は数多くの例を読んできました。私は解決策にかなり近いと思います。私のHTMLファイルに

私は宣言する:

<script src="//Microsoft.Phone.WinJS.2.1/js/base.js"></script> 
<script src="//Microsoft.Phone.WinJS.2.1/js/ui.js"></script> 
<script type="text/javascript" src="js/default.js"></script> 

そして、これは私にDefault.js、私はFileOpenPickerが呼び出されなければならページで使用するファイルです。

(function() { 
"use strict"; 

var app = WinJS.Application; 
var activation = Windows.ApplicationModel.Activation; 

app.onloaded = function (args) { 
    var activationKind = args.detail.kind; 

    document.getElementById("btnSnap").addEventListener("click", pickSinglePhoto); 

    if (activationKind === Windows.ApplicationModel.Activation.ActivationKind.pickFileContinuation) { 
     continueFileOpenPicker(options.activatedEventArgs); 
    }   
}; 

function pickSinglePhoto() { 
    // Clean scenario output 
    WinJS.log && WinJS.log("", "sample", "status"); 
    console.log("in pickSinglePhoto"); 

    // Create the picker object and set options 
    var openPicker = new Windows.Storage.Pickers.FileOpenPicker(); 
    openPicker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; 
    openPicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.picturesLibrary; 
    // Users expect to have a filtered view of their folders depending on the scenario. 
    // For example, when choosing a documents folder, restrict the filetypes to documents for your application. 
    openPicker.fileTypeFilter.replaceAll([".png", ".jpg", ".jpeg"]); 

    // Open the picker for the user to pick a file 
    openPicker.pickSingleFileAndContinue(); 
} 

// Called when app is activated from file open picker 
// eventObject contains the returned files picked by user 
function continueFileOpenPicker(eventObject) { 
    console.log("in continueFileOpenPicker"); 
    var files = eventObject[0].files; 
    var filePicked = files.size > 0 ? files[0] : null; 
    if (filePicked !== null) { 
     // Application now has read/write access to the picked file 
     WinJS.log && WinJS.log("Picked photo: " + filePicked.name, "sample", "status"); 
    } else { 
     // The picker was dismissed with no selected file 
     WinJS.log && WinJS.log("Operation cancelled.", "sample", "status"); 
    } 
} 

app.start(); 
})(); 

残念ながら、これは機能しません。私はcontinueFileOpenPickerに入ることができません。なぜなら、フラグactivationKindは常に定義されていないからです。私はapp.onloadedの代わりにapp.onactivatedを使うべきだと確信していますが、前者の場合、私はその関数に入ることができません。

私はすでにpickSinglePhotoという機能を試していましたが、うまくいくようですが、他のjavascriptファイルで機能を選択して使用できないため、アプリケーションがクラッシュしてから選択したページに戻れません。 bruteとして

ヒント?

答えて

0

私はついにそれを手に入れました。これは、Cordova Camera Plugin JIRAの問題(link)の正式な回答に基づいた私の作業ソリューションです。

  1. 使用公式カメラプラグインコルドバ(link
  2. メインファイル: index.htmlを、index.js、new.html、new.js、wp_get_image.js、utils.js。

まず、index.htmlを(私のメインページ)に私がwp_get_image.jsスクリプトを宣言:

<script type="text/javascript" src="js/localstoragedb.min.js"></script> 
<script type="text/javascript" src="js/utils.js"></script> 
<script type="text/javascript" src="js/wp_get_image.js"></script> 
<script type="text/javascript" src="js/index.js"></script> 

は覚えておいてください:

を「要するに、ギャラリーの原因から画像を選択しますアプリケーションが の画像が選択されるまで中断し、開始ページ( config.xmlで定義されているように)で再開します。別のページからgetPictureを呼び出した場合、この はアプリ全体を再読み込みして開きますrtページ。あなたは プラグインからどんな結果を得ることは決してないだろうので、また、getPictureへ のコールバックは、この場合にも拭います。」

だから、私はカメラからのコールバックを傍受するインデックスページ上のフックが必要これは私のwp_get_imageです。JS:

var goto_new_page_winphone = ""; 

(function() { 
    "use strict"; 

    var app = WinJS.Application; 
    var activation = Windows.ApplicationModel.Activation; 

    app.onactivated = function (args) { 

     if (args.detail.kind === activation.ActivationKind.launch) { 
      var that = this; 

      // Init: 
      goto_new_page_winphone = ""; 
      localStorage.setItem("image_url_winphone", ""); 
     } 

     if (args && args.detail.kind === activation.ActivationKind.pickFileContinuation) { 
      continueFileOpenPicker(args); 
     }; 

     args.setPromise(WinJS.UI.processAll().then(function() { 
      // Text 
     })); 
    }; 

    function continueFileOpenPicker(eventObject) { 

     console.log("in continueFileOpenPicker"); 
     var filePicked = eventObject.detail.files[0]; 
     var msgBox; 
     if (filePicked !== null) { 
      // Save filePicked.path in localstorage: 
      localStorage.setItem("image_url_winphone", filePicked.path); 
     } else { 
      msgBox = new Windows.UI.Popups.MessageDialog("Operation cancelled."); 
      msgBox.showAsync(); 
     } 
     // Save back page: 
     goto_new_page_winphone = read_backpage(); 
    }; 
app.start(); 
})(); 

私は(ページは、私がnew.htmlと呼ばれる)来たページを保存するために画像のURLとローカル変数を保存するためのlocalStorageを使用しています。 read_backpage()関数は、私のutils.jsファイルで宣言されています。このファイルでは、ユーザーが訪問したページを追跡します。 それで、私が写真を撮ったnew.htmlページのアクションの後、システムはインデックスページで私を蹴り返します。そこには、私が来たページを読む必要があります。だから私のindex.jsに:

window.addEventListener("load", load, false); 

function load() { 
    if (device.platform != undefined) { 
     var plat = device.platform; 
     plat = plat.substring(0, 3); 
     if (plat.toLowerCase() == "win") { 
      if (goto_new_page_winphone && goto_new_page_winphone.length > 0) { 
       window.location.href = goto_new_page_winphone; 
      } 
     } 
    } 
} 

月の注目:フローは次のとおりです。index.jsで$(ドキュメント).ready - > wp_get_image.jsにapp.onactivated - > index.jsでロード。したがって、$(document).readyの中にgoto関数(window.location.href = goto_new_page_winphone)を入れないでください。そうしないと、var goto_new_page_winphoneがnullになり、移動できなくなります。

この時点で、new.htmlページの画像が選択され、index.htmlに戻ってきましたが、goto_new_page_winphoneに宣言されたページにリダイレクトすることができます(私の場合、ページはnew.html)。私は、画像のパス拾うnew.jsで

(new.htmlに関連するスクリプト):私の場合は

if (is_winphone) { 
     var image_url = localStorage.getItem("image_url_winphone"); 
     if (image_url && image_url.length > 0) { 
      upload_img("newprofile", image_url, function (urlimg) { 
       // Reset localstorage var: 
       localStorage.setItem("image_url_winphone", ""); 
       if (urlimg.length > 0) { 
        urlimg = urlimg.replace(/\\/g, ''); 
        console.log(urlimg); 
        // Save remote url in my localstorage 
        wp_save_img_url(urlimg); 
       } 
      }); 
     } 
    } 

を、私はupload_imgのFUNCを介して自分のサーバーに画像を送信します私の目的のために私は保存するリモートURLとサーバーの答え。 upload img funcは、File Tranfer Pluginの文書に従って作成できるシンプルな関数です。

0
(function() { 
"use strict"; 

var app = WinJS.Application; 

app.onloaded = function (args) { 

document.getElementById("btnSnap").addEventListener("click", pickSinglePhoto); 
} 

//This is where the app should validate the ActivationKind 
app.onactivated = function (args) { 

var value = args.detail.kind; 

if (value ===  Windows.ApplicationModel.Activation.ActivationKind.pickFileContinuation) 
{ 
continueFileOpenPicker(args); 
} 

}

function pickSinglePhoto() { 

console.log("in pickSinglePhoto"); 

var openPicker = new Windows.Storage.Pickers.FileOpenPicker(); 

openPicker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; 

openPicker.suggestedStartLocation =  Windows.Storage.Pickers.PickerLocationId.picturesLibrary; 

openPicker.fileTypeFilter.replaceAll([".png", ".jpg", ".jpeg"]); 

openPicker.pickSingleFileAndContinue(); 

} 


function continueFileOpenPicker(eventObject) 
{ 
var imagen = eventObject.detail.files[0]; 

//whatch the properties of this object in the debuger 
console.log(imagen.displayName); 


} 


app.start(); 
})();  

このコードはあなたのために動作します。