CODEWITHSUNDEEP
iosuitextfieldtitanium-mobile
Wytze
Wytze

Reputation: 7904

Why is the leftButton (or rightButton) inside Titanium textField not showing?

I grappled with this for a while. Seems to be a semi bug.

If you add a leftButton or a rightButton to a textField like so:

var leftButton = Ti.UI.createButton({
    image: 'someImage.png'
})
var textField = Ti.UI.createTextField({

    leftButton: leftButton,
    leftButtonMode: Ti.UI.INPUT_BUTTONMODE_ALWAYS,
    leftButtonPadding: 100

})

...then you won't get to see your button. Why?

Upvotes: 0

Views: 922

Answers (3)

Durul Dalkanat
Durul Dalkanat

Reputation: 7445

var win = Titanium.UI.createWindow({
    title:"Configuring text field and text area keyboard types",
    backgroundColor:"#347AA9",
    exitOnClose:true
});

//These buttons will appear within the text field
var clearButton = Titanium.UI.createButton({
    title:"Clear",
    height:24,
    width:52
});

var submitButton = Titanium.UI.createButton({
    title:"Submit",
    height:24,
    width:60
});

var textField = Titanium.UI.createTextField({
    top:"25%",
    height:35,
    width:600,
    backgroundColor:"#ffffff",
    borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
    hintText:"Type something",
    keyboardType:Titanium.UI.KEYBOARD_DEFAULT,
    leftButton:clearButton,
    rightButton:submitButton
});

clearButton.addEventListener("click", function(e){
    //Clear the value of the text field
    textField.value = "";
});

submitButton.addEventListener("click", function(e){
    //Pretend to submit the value of the text field
    //Be sure that you've typed something in!
    if(textField.value != ""){
        alert(textField.value); 
    }else{
        alert("Enter some text");
    }
});

//Add an event listener to the window that allows for the keyboard or input keys to be hidden if the user taps outside a text field
//Note: each text field to be blurred would be added below
win.addEventListener("click", function(e){
    textField.blur(); // Cause the text field to lose focus, thereby hiding the keyboard (if visible)
});

win.add(textField);

win.open();

Upvotes: 1

Hasnain
Hasnain

Reputation: 461

There might be 2 issues with this code. 1- Check image path you assigning to button .. ? (Height,width) for test purpose try use any system button and see if its appear or not .?

var leftButton = Titanium.UI.createButton({
    style:Titanium.UI.iPhone.SystemButton.DISCLOSURE
});

2- second issue might be with padding of left button try to use it without padding and then see what happens.

Upvotes: 1

Wytze
Wytze

Reputation: 7904

The problem is in the leftButtonMode property. Give it any value at all, and the button won't show. If you don't use this property, the button will show just fine.

The padding property is not a problem for leftButton. But if you use it on a rightButton, it will likely throw your button outside the screen. I've tried a negative value too, without success.

Be aware too that the leftButton and rightButton options don't work on Android.

Upvotes: 0

Related Questions