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");

我尝试了如上所示的不同路径，但没有一个标签项显示图像。

HEre是图像路径：

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

以下是创建标签栏项目的代码：

 * @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不被视为正确的路径。

如何将图像应用于Cordova中的选项卡栏项目

1 个答案: