次の方法で共有

クイック スタート: リムーバブル記憶装置の一覧表示 (HTML)

  • [アーティクル]

このチュートリアルでは、Windows.Storage.KnownFolders を使って、現在接続されているデバイスのスナップショットを StorageFolder オブジェクトとして取得する方法について説明します。

目標: Windows.Storage.KnownFolders を使ってリムーバブル記憶装置を一覧表示する方法について説明します。

必要条件

JavaScript と HTML について理解している必要があります。

リムーバブル記憶装置が必要です。

完了までの時間: 20 分.

手順

1. Microsoft Visual Studio を開く

Visual Studio のインスタンスを開きます。

2. 新しいプロジェクトを作る

[新しいプロジェクト] ダイアログ ボックスで、JavaScript のプロジェクトの種類から新しいアプリケーションを選びます。

3. リムーバブル ストレージの機能を宣言する

ソリューション エクスプローラーで package.appxmanifest をダブルクリックします。[機能] タブをクリックします。[機能] の一覧で、[リムーバブル ストレージ] をオンにします。

4. アプリケーションの HTML と JavaScript を挿入する

Default.html を開き、次のコードをこのファイルにコピーして、元の内容を置き換えます。


<!DOCTYPE html>
<html>
<head>
<title>Removable Storage Devices</title>
<link rel="stylesheet" href="/winjs/css/ui-dark.css" />
<script type = "text/javascript" >

// Use the Removable Devices KnownFolder to get a snapshot of the currently 
// connected devices as StorageFolders. 
 function listStorages() {
        document.getElementById("output").innerHTML = "";
        Windows.Storage.KnownFolders.removableDevices.getFoldersAsync().
        then(
            function (removableStorages) {
            // Display each storage device.
            var numRemovableStorages = removableStorages.length;
            if (numRemovableStorages > 0) {
                removableStorages.forEach(function (removableStorage, i) {
                    document.getElementById("output").innerHTML +=
                             removableStorage.name + "<br/>";
                });
            } else {
                document.getElementById("output").innerHTML = 
                        "No storages found. Attach a removable storage " +
                        "such as a camera or USB drive.)";
            }
        },
            function (e) {
            document.getElementById("output").innerHTML = 
                    "Failed to find all storage devices. Error: " +
                     e.message;
        });
    }
</script>
</head>
<body>
<p>
Click "List Storages" to get a list removable storage devices.<br /></p>
<input type="button" onclick="listStorages()" value="List Storages" /><br />

<div id=output></div>

</body>
</html>

5. アプリケーションをテストする

  1. リムーバブル記憶装置を接続します (まだ接続していない場合)。
  2. [デバッグ]、[デバッグ開始] の順にクリックし、ソリューションをテストします。
  3. [List Storages] (記憶装置の一覧表示) ボタンをクリックすると、リムーバブル ストレージが一覧表示されます。

注  エラーが発生した場合は、次の点を確認してください。

  • リムーバブル ストレージへのアクセスが有効になっていることを確認します。ソリューション エクスプローラーで package.appxmanifest を開き、[機能] タブの [リムーバブル ストレージ] を確認してください。

 

要約

次回は、ピクチャにあるファイルを記憶装置にコピーします。

関連トピック

Windows Phone アプリでの SD カードへのアクセス