Como carregar recursos de arquivos (HTML)
[ Este artigo destina-se aos desenvolvedores do Windows 8.x e do Windows Phone 8.x que escrevem aplicativos do Windows Runtime. Se você estiver desenvolvendo para o Windows 10, consulte documentação mais recente ]
Saiba como carregar recursos de arquivo de vários locais.
É possível acessar os recursos dos arquivos do aplicativo que você oferece como parte do pacote do aplicativo, ou inclui como parte de um componente ou pacote de estrutura, de dados do aplicativo ou da Web. Você pode fazer referência a esses arquivos na marcação (como HTML ou XML de Notificações) ou através de código (como as APIs Windows.Web.Http ou storage file). Os exemplos aqui mostram os recursos de arquivo em contextos específicos, mas você pode usar a maioria deles em vários outros contextos.
Web
Para acessar arquivos da Web, você pode usar URIs HTTP absolutos padrão.
<img src="https://www.contoso.com/images/logo.png" alt="Logo" />
Pacote do aplicativo
Para acessar arquivos do seu pacote de aplicativo, você pode usar um caminho de arquivo lógico ou direto para fazer referência ao recurso. Isso vale mesmo quando os arquivos têm vários idiomas, escalas, contrastes ou outras variações como qualificadores do nome do arquivo. Veja o Guia de início rápido: usando recursos de arquivo ou imagem para uma introdução.
Por exemplo, você carrega
Images/en-US/homeregion-USA/logo.scale-100_contrast-white.png
fazendo referência a
Images/logo.png
Para acessar arquivos relativos ao documento atual na marcação, você pode usar URIs relativos.
<img src="images/logo.png" />
Para acessar arquivos relativos à raiz do pacote, você pode usar URIs de caminho absolutos (aqueles que começam com "/").
<img src="/images/logo.png" />
Para acessar os arquivos armazenados no mesmo pacote, mas a partir de uma biblioteca de classes, use o nome da biblioteca de classes:
<img src="/ClassLibraryName/images/logo.png" />
Para acessar arquivos armazenados dentro do pacote do aplicativo, mas de código em que não há nenhuma raiz indicada no documento base, use o esquema ms-appx:.
var uri = new Windows.Foundation.Uri('ms-appx:///images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Para acessar arquivos armazenados em um pacote de biblioteca ou estrutura que foi incluído com o aplicativo, use um URI absoluto (e o esquema ms-appx:).
<script src="ms-appx:///Bing.Maps.JavaScript//js/veapicore.js"></script>
Para acessar arquivos que serão carregados no compartimento da Web, use o esquema ms-appx-web:.
<iframe src="ms-appx-web:///html/webcompartment.html"></iframe>
Para acessar arquivos no mesmo compartimento da Web ou local que o documento atual, não especifique um esquema.
<script src="//Microsoft.WinJS.2.0/js/ui.js"></script>
Dados do aplicativo
Para acessar arquivos armazenados nos dados do aplicativo, use o esquema ms-appdata:. Os dados do aplicativo podem ser armazenados em uma pasta local, roaming ou temp.
Para acessar arquivos armazenados na pasta local:
<img src="ms-appdata:///local/images/logo.png" />
Para acessar arquivos armazenados na pasta roaming:
<img src="ms-appdata:///roaming/images/logo.png" />
Para acessar arquivos armazenados na pasta temp:
<img src="ms-appdata:///temp/images/logo.png" />
As storage file APIs podem acessar arquivos dentro do pacote de aplicativo do mesmo modo:
var uri = new Windows.Foundation.Uri('ms-appdata:///local/images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Alterações de eventos e contexto
Seu aplicativo é responsável por atualizar a exibição de seus recursos, quando necessário.
Os aplicativos da Windows Store ainda podem estar em execução quando o sistema é alterado, como quando o usuário ativa o alto contraste. O resultado é que o aplicativo usa um conjunto de qualificadores diferente. Diversas alterações do sistema invocarão eventos no objeto ResourceContext.
No JavaScript, a maneira mais simples de escutar esses eventos é usando o método addEventListener:
WinJS.Resources.addEventListener('contextchanged', refresh, false);
Os elementos de imagem não são atualizados automaticamente quando o contexto muda e depende do aplicativo substituir as imagens. As consultas de mídia CSS são uma alternativa que atualiza imediatamente as propriedades CSS, como a imagem de tela de fundo.
Tópicos relacionados
Como carregar recursos de cadeias de caracteres