So wird’s gemacht: Laden von Dateiressourcen (HTML)
[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation ]
Hier erfahren Sie, wie Sie Dateiressourcen von verschiedenen Speicherorten laden.
Sie können auf Dateiressourcen in App-Dateien, die Sie als Teil des App-Pakets bereitstellen oder die Sie als Teil eines Komponenten- oder Frameworkpakets hinzufügen, oder in App-Daten oder im Web zugreifen. Sie können im Markup (z. B. HTML oder Benachrichtigungs-XML) oder im Code (z. B. mit Windows.Web.Http- oder storage file-APIs) auf diese Dateien verweisen. Die folgenden Beispiele zeigen die Dateiressourcen in bestimmten Kontexten, die meisten von ihnen können aber auch in vielen anderen Kontexten verwendet werden.
Web
Für den Zugriff auf Dateien im Web können Sie standardmäßige absolute HTTP-URIs verwenden.
<img src="https://www.contoso.com/images/logo.png" alt="Logo" />
App-Paket
Für den Zugriff auf Dateien im App-Paket können Sie mit einem direkten oder logischen Dateipfad auf die Ressource verweisen. Dies gilt auch dann, wenn für die Dateien mehrere Sprach-, Skalierungs- und Kontrastversionen oder andere Varianten als Qualifizierer im Dateinamen vorhanden sind. Eine entsprechende Einführung finden Sie unter Schnellstart: Verwenden von Datei- oder Bildressourcen.
Beispielsweise laden Sie
Images/en-US/homeregion-USA/logo.scale-100_contrast-white.png
durch einen Verweis auf
Images/logo.png
Für den Zugriff auf Dateien relativ zum aktuellen Dokument im Markup können Sie relative URIs verwenden.
<img src="images/logo.png" />
Für den Zugriff auf Dateien relativ zum Stamm des Pakets können Sie absolute URIs (URIs, die mit einem "/" beginnen) verwenden.
<img src="/images/logo.png" />
Verwenden Sie für den Zugriff auf Dateien, die zwar im gleichen Paket gespeichert sind, aber aus einer Klassenbibliothek stammen, den Namen der Klassenbibliothek:
<img src="/ClassLibraryName/images/logo.png" />
Um in Code, in dem kein Stamm vom Basisdokument abgeleitet wurde, auf im App-Paket gespeicherte Dateien zuzugreifen, verwenden Sie das ms-appx:-Schema.
var uri = new Windows.Foundation.Uri('ms-appx:///images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Zum Zugreifen auf Dateien, die in einem in der App enthaltenen Framework- oder Bibliothekspaket gespeichert sind, verwenden Sie einen absoluten URI (und das ms-appx:-Schema).
<script src="ms-appx:///Bing.Maps.JavaScript//js/veapicore.js"></script>
Für den Zugriff auf Dateien, die in das Webdepot geladen werden, verwenden Sie das ms-appx-web:-Schema.
<iframe src="ms-appx-web:///html/webcompartment.html"></iframe>
Für den Zugriff auf Dateien, die sich im gleichen Webdepot oder lokalen Depot wie das aktuelle Dokument befinden, geben Sie kein Schema an.
<script src="//Microsoft.WinJS.2.0/js/ui.js"></script>
App-Daten
Verwenden Sie für den Zugriff auf Dateien, die in den App-Daten gespeichert sind, das ms-appdata:-Schema. App-Daten können in einem Ordner local, roaming oder temp gespeichert werden.
So greifen Sie auf Dateien im Ordner local zu
<img src="ms-appdata:///local/images/logo.png" />
So greifen Sie auf Dateien im Ordner roaming zu
<img src="ms-appdata:///roaming/images/logo.png" />
So greifen Sie auf Dateien im Ordner temp zu
<img src="ms-appdata:///temp/images/logo.png" />
Die storage file APIs können auf die gleiche Weise auf Dateien im Anwendungspaket zugreifen:
var uri = new Windows.Foundation.Uri('ms-appdata:///local/images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Ereignisse und Kontextänderungen
Ihre App ist dafür zuständig, die Anzeige ihrer Ressourcen bei Bedarf zu aktualisieren.
Windows Store-Apps werden u. U. ausgeführt, wenn im System Änderungen vorgenommen werden, z. B. wenn Benutzer den hohen Kontrast aktivieren. Dies führt dazu, dass die App einen anderen Satz von Qualifizierern verwendet. Verschiedene Systemänderungen rufen Ereignisse für das ResourceContext-Objekt auf.
In JavaScript können Sie am einfachsten mit der addEventListener-Methode auf diese Ereignisse lauschen:
WinJS.Resources.addEventListener('contextchanged', refresh, false);
Bildelemente werden nicht automatisch aktualisiert, wenn sich der Kontext ändert, und müssen von der App ersetzt werden. CSS-Medienanfragen sind eine Alternative, durch die CSS-Eigenschaften wie Hintergrundbilder sofort aktualisiert werden.