在实时图块中循环图像

时间:2012-11-11 21:55:03

标签: visual-studio-2012 winjs

我有一个 winJS 应用程序,它是一个用于蒸汽游戏的工作启动器。我想让它循环显示5张图像,即使没有运行。

它仅使用 小图块 - 此应用程序没有宽图块图像。

以下是代码:

(function () {
"use strict";

WinJS.Namespace.define("Steam", {
    launch: function launch(url) {
        var uri = new Windows.Foundation.Uri(url);

        Windows.System.Launcher.launchUriAsync(uri).then(
             function (success) {
                 if (success) {
                     // File launched
                     window.close();
                 } else {
                     // File launch failed
                 }
             }
        );
    }
});

WinJS.Namespace.define("Tile", { 
    enqueue: function initialize() {
        var updaterHandle = Windows.UI.Notifications.TileUpdateManager.createTileUpdaterForApplication();
        updaterHandle.enableNotificationQueue(true);
        return updaterHandle;
    },
    update: function update () {
        var template = Windows.UI.Notifications.TileTemplateType.tileSquareImage;
        var tileXml = Windows.UI.Notifications.TileUpdateManager.getTemplateContent(template);

        var randIndx = Math.floor(Math.random() * 5);
        var randUpdatetime = 1000 * 3 * (((randIndx == 0) ? 1 : 0) + 1); // let the base image stay longer

        var tileImageAttributes = tileXml.getElementsByTagName("image");

        tileImageAttributes[0].setAttribute("src", "ms-appx:///images/Borderlands2/borderlands_2_" + randIndx + "_sidyseven.png");
        tileImageAttributes[0].setAttribute("alt", "Borderlands 2");

        var tileNotification = new Windows.UI.Notifications.TileNotification(tileXml);
        var currentTime = new Date();

        tileNotification.expirationTime = new Date(currentTime.getTime() + randUpdatetime);
        tileNotification.tag = "newTile";

        var updater = Tile.enqueue();
        updater.update(tileNotification);

        setTimeout('Tile.update();', randUpdatetime);
    }
});


WinJS.Binding.optimizeBindingReferences = true;

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

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {                 
        setTimeout('Steam.launch("steam://rungameid/49520");', 800);
        args.setPromise(WinJS.UI.processAll().then(function () {
            return WinJS.Navigation.navigate("/default.html", args).then(function () {
                Tile.update();
            });
        }));
    }
};

app.start();
})();

注意:

  • 代码当前不会循环图像,而是 显然永远不会改变,或者在发布后取代应用程序 使用默认图像的微小视图命名文本。这回归到了 短时间后发短信,循环可能会重复。它永远不会显示出来 不同的图像(在小图像中都没有错误地显示,也没有 在主要的瓷砖)。

  • 当我在调试中运行并在其中设置断点时 TileUpdater.update(TileNotification)阶段,我可以验证 控制台将图像 src 属性设置为随机图像 就像我想要的那样:

    >>>>tileNotification.content.getElementsByTagName("image")[0].getAttribute("src")

    "ms-appx:///images/Borderlands2/borderlands_2_4_sidyseven.png"

    但这实际上从未显示在瓷砖上。

  • 这些图像文件包含在解决方案中,它们出现在解决方案资源管理器中的正确目录中。

1 个答案:

答案 0 :(得分:0)

如果在调试中正确设置了图像src属性,则图像可能没有正确的“构建操作”。

在每张图片的“属性”中,将“构建操作”设置为“资源”。

enter image description here