Clever Geek Handbook

Titanium: tab icon image not working

I am trying to change the icons on a tab group of tabs, but no image is displayed.

For iOS

I used below code:

var win1 = Titanium.UI.createWindow
({  
    url:'Tab1.js'
});

var tab1 = Titanium.UI.createTab
({  
      icon:'footer_contactus_hover.png',
      window:win1
});

// create controls tab and root window
var win2 = Titanium.UI.createWindow
({        
    url:'Tab2.js'
});

var tab2 = Titanium.UI.createTab
({  
    icon:'footer_search.png',
    window:win2
});

I have 4 tabs . Image size 81x51 . It only shows me a blue rectangle instead of the original image.

Also I have tried <property name="ti.android.fastdev" type="bool">false</property>

What's wrong with the code?

+3


source to share


2 answers


Solved by making images Transparent .



Also found: - Icon should be fileld with color for visible pixels and transparent for invisible part. Os will apply a blue glowing material, so if the icon has no transparent pixels, you'll only see a rectangle.

+2


source


Assuming your image does exist in the locations shown, I am assuming that your images will not be rendered properly, so when you get the mask of everything you see it is a blue rectangle. I would suggest grabbing some other icon images from http://glyphish.com/ to make sure your images are not rendered properly (I don't have any that I've used my icons in my projects and they are first class).



Also you can check the Human Interface Guidelines as it sets the dimensions shown.

+1


source






More articles:


All Articles