how to change hintText color in textField Titanium?

Question

this is my code,and I want to change the hintText Color, how to do?

    "#email":{
    width: '70%',
    left:'13%',
    font:{
        fontSize:'20sp'
    },
    color: '#fff',
    hintText:'请输入手机号',
    borderColor:'transparent',
    bottom:'2%',
    //backgroundColor:'#d9d9d9',
    backgroundColor:'transparent',
    borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED
}

Answer 1

actually you can't i tried before
here what i did to change the hint color and font
you need to create a view, textfeild and label with adding change listener on textfeild to show or hide the hint

 var mh_view = Ti.UI.createView({
    backgroundColor : "white",
    height : "40dp",
    top : "224dp",
    left : "10dp",
    right : "10dp",
    width : Ti.UI.FILL
});
var mail_hint = Ti.UI.createLabel({
    color : "#88817F",
    font : {
        fontFamily : customfont2,
        fontSize : "15dp"
    },
    left : "47dp",
    //top:"14dp",
    text : "E-mail"
});
mh_view.add(mail_hint);
var mail = Ti.UI.createTextField({
    backgroundImage : "/images/trans.png",
    width : Ti.UI.FILL,
    height : "40dp",
    top : "224dp",
    left : "10dp",
    right : "10dp",
    bubbleParent:false,
    paddingLeft : "47dp"
    // hintText:"E-mail"
});

var visible = true;
mail.addEventListener("change", function() {
    if (visible) {
        mail_hint.hide();
    } else {
        if ((mail.value).length == 0)
            mail_hint.show();
    }
    visible = !visible;

});

hope it help :)

Answer 2

This can also be done using AttributedString and AttributedHintText, which supports both Android and iOS.

var emailHintText = "Your email";

var attributedEmailHintText = Titanium.UI.createAttributedString({
		text : emailHintText,
		attributes : [{
			type : Ti.UI.ATTRIBUTE_FOREGROUND_COLOR,
			range : [0, emailHintText.length],
			value : '#88817F',
		}]
	});

$.email.setAttributedHintText(attributedEmailHintText);

AttributedString will also allow you to add more attributes to your string/hintText in addition to color. Read about it in Appcelerators Documentation:

AttributedString Foreground Color

Ti.UI.AttributedString

UPDATE 15.08.16

After the Titanium SDK 5.4.0.GA release, iOS now support the property hintTextColor and the method setHintTextColor for TextFields. Read more in the Titanium SDK Release Notes for iOS

Answer 3

Just add hintTextColor property.

"#email":{
    width: '70%',
    left:'13%',
    font:{
        fontSize:'20sp'
    },
    color: '#fff',
    hintText:'Hint Text',
    hintTextColor : "#787878",
    borderColor:'transparent',
    backgroundColor:'transparent',
    borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED
}

Answer 4

you will have to create a theme for android with such properties. you can find how to do that http://docs.appcelerator.com/platform/latest/#!/guide/Android_Themes

they have a good doccument for it

Answer 5

For those that were searching around, you can do this using "hintTextColor", you can use it for a textfield, but I used it for a search bar, see example below:

var searchInputBox = Titanium.UI.createSearchBar({
   backgroundColor:'#fff',
   hintTextColor:'#777',
   backgroundFocusedColor: "red",
   color: "#000",
   showCancel:true,
   height: 60,
   width: "94%",
   top: 100,
   left: "3%",
   hintText: "E.g. Bananas...",
   font: { color: "#fff"},
});

I found this mentioned here in a post: https://jira.appcelerator.org/browse/TIMOB-18433

Answer 6

I think, Just put color:'red' it will show your text as well as hint text in red color