如何将图像应用到 Cordova 中的标签栏项目

Question

我正在尝试使用 cordova 构建一个简单的标签栏模板。

到目前为止，我有这段代码，它向应用程序添加了一个简单的标签栏。

            var tabBar = cordova.require("cordova/plugin/iOSTabBar");
            tabBar.init();

            tabBar.create({selectedImageTintColorRgba: "255,40,0,255"});
            tabBar.createItem("tab1", "Home", "");
            tabBar.createItem("tab2", "Locations", "");
            tabBar.createItem("tab3", "Utilities", "");
            tabBar.createItem("tab4", "Inspire", "");
            tabBar.createItem("tab5", "Cloud Sync", "", {
                onSelect: function() {
                    alert("Cloud tab selected");
                }
            });

            tabBar.show();
            tabBar.showItems("tab1", "tab2","tab3","tab4","tab5");

结果是这样的：

当我尝试将图像添加到图标时，

           var tabBar = cordova.require("cordova/plugin/iOSTabBar");

            tabBar.init();

            tabBar.create({selectedImageTintColorRgba: "255,40,0,255"});
            tabBar.createItem("tab1", "Home","/www/res/icon/ios/Home.png");
            tabBar.createItem("tab2", "Locations", "Home.png");
            tabBar.createItem("tab3", "Utilities", "/www/img/Home.png");
            tabBar.createItem("tab4", "Inspire", "/www/Home.png");
            tabBar.createItem("tab5", "Cloud Sync", "/Home.png", {
                onSelect: function() {
                    alert("Cloud tab selected");
                }
            });

            tabBar.show();
            tabBar.showItems("tab1", "tab2","tab3","tab4","tab5");

我尝试了如上所示的不同路径，但选项卡项都没有显示图像。

这里是图片路径：

我将图像复制到不同的地方并尝试过，但没有一个适合我。

这里是创建标签栏项目的代码：

 * @param {String} name internal name to refer to this tab by
 * @param {String} [title] title text to show on the tab, or null if no text should be shown
 * @param {String} [image] image filename or internal identifier to show, or null if now image should be shown
 * @param {Object} [options] Options for customizing the individual tab item


    TabBar.prototype.createItem = function(name, label, image, options) {
    var tag = this.tag++;
    if (options && 'onSelect' in options && typeof(options['onSelect']) == 'function') {
        this.callbacks[tag] = {onSelect: options.onSelect, name: name};
        //delete options.onSelect;
    }

    exec(null, null, "TabBar", "createItem", [name, label, image, tag, options]);
};

我不确定，要在图像字段中传递的正确参数是什么。

谁能建议我正确的做法？

我正在使用这个插件：https://github.com/AndiDog/phonegap-ios-tabbar-plugin

Answer 1

奇怪的是教程建议在路径开头提到/，但是图像应用于项目，而我没有在路径开头提到/。

这对我有用：

            tabBar.createItem("tab1", "Home", "www/Home.png");

图片的正确路径是"www/Home.png"而不是"/www/Home.png"

我不确定为什么 /www 不被视为正确路径。