How to make a navigation bar button have a background color
I create a navigation bar and place a button in the navigation bar. I would like for the button to be blue. I am trying to mimic the iPhone functionality of a "DONE" style button in the navigation bar.
Here is the code to create the button and a navgroup.
var button = Ti.UI.createButton({
title: "Login",
style: Ti.UI.iPhone.SystemButtonStyle.DONE
});
var loginWindow = Ti.UI.createWindow({
title:"Login",
rightNavButton: button,
barColor: '#000'
});
var navGroup = Ti.UI.iPhone.createNavigationGroup({
window:loginWindow
});
var main = Ti.UI.createWindow();
main.add(navGroup);
main.open();
I have tried using the style property as well as the backgroundColor property and I do not see any changes. Also, I changed the color property to see if I can change the text color and that also has no effect.
4 Answers
-
Use a buttonBar with one label only.
It allows you to set the backgroundColor ;) -
I had the same question.
And I finally made an image of my colored button and created my button with a background image.
And there it goes, I've got a blue button on a white navigation bar ! -
I was use one trick to change color of system buttons. For parent window I was added barColor: '–button_background_color–', and redefine bar color by barImage. Only I haven't idea, hot to change buttons border and add gradient background.
-
Background colours on system buttons is not possible in Appcelerator and as far as I can see the iPhone SDK.
More information can be found here: http://bit.ly/d4HsnQ