How to remove the orange border onfocus in Android using Titanium?

Question

I been with this issue for hours now with no luck. My setup is simple: I have a TableView with a search bar which is called like this:

var tableviewMainProducts = Titanium.UI.createTableView({
    data : dataProducts,
    search : search,
    searchHidden : true,
    top : '0dp'
});

And the code for the searchBar is

var search = Titanium.UI.createSearchBar({
    barColor : '#CCC',
    showCancel : false,
    hintText : 'search'
});

The problem that I have is that when testing on Android I see an orange border around the searchBar which I am trying to remove with no luck.

It looks like there is a backgroundFocusedColor for Android but that is not working for me.

Any tip on how to remove that orange border will be deeply appreciated.

Answer 1

You can not remove the border from Searchbar. What you can do is create a custom searchbar using textField. Create a view for search bar, create a textField and add it to the view. Then set the backgroundColor or backgroundImage for the texField.

Here is an example

var txtSearch = Ti.UI.createTextField({
   hintText : 'My hint text',
   width     : '75%',
   top   : '5%',
   backgroundColor : 'transparent'//or backgroundColor : 'white'
});

Hope it helped you