Search Bar search RESULTS TABLE background color change

You must Login before you can answer or comment on any questions.

Hello all.

We are developing an iphone app with titanium v1.8.2 and ios sdk5.0.

We want to change the background color of the TEMPORARY TABLE that is displayed/generated when you type in text inside the search bar.

For eg: In the image at

http://www.exploremetro.com/blog/wp-content/uploads/2009/11/screenshot2.png "search bar

Snapshot Image In the above image we want to have the search result table background "transparent" instead of white.

We tried setting the tableView backgroundColor to transparent, but on iphone the background color of the table ALWAYS turns white as soon as you type in a character in the search box.

Is there a way to have it always transparent.

Thank you.

3 Answers

I resolved this issue by editing the titanium SDK.

I'm not an Objective-C programmer, so probably this could be done in a more elegant way, but it just does the trick.

Open the sdk project and edit:

/Classes/Modules/UI/Tableview & Groupvuew/TiUITableview.m

scroll until the end of the file and append this code:

- (BOOL) searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString
{
    [controller.searchResultsTableView setBackgroundColor:RGBACOLOR(0, 0, 0, 0)];
    [controller.searchResultsTableView setSeparatorStyle: UITableViewCellSeparatorStyleNone];
    return YES;
}
after

#pragma mark Search Display Controller Delegates

then do a clean build. Now the results table will have a transparent background.

Hope this helps,

  • Alessandro

I have a work around but is not pretty. Use the focus event of the search bar to change the background color of the table, and then use any other event to change it back to transparent.

// changes the color of the table to blue every you focus the search bar
search.addEventListener('focus', function(e) {
    tableView.backgroundColor = 'blue' ;     
});
 
// changes the color of the table to transparent 
search.addEventListener('blur', function(e) {
        tableView.backgroundColor = 'transparent'
});
hope this works

Thanks Arian.

We tried your code. It does change the 'tableView' background, BUT not completely - explanation follows.

What happens is, the iphone search bar GENERATES a TEMPORARY table on top of the ORIGINAL table ('tableView'). This temporary table contains the filtered SEARCH results.

AND THIS TEMPORARY SEARCH TABLE IS NEVER ACCESSIBLE through 'search' object and HAS ALWAS A WHITE BACKGROUND (iphone default).

After the search results are populated in this temporary table and NOW when you CLICK or FOCUS on this temporary table 'blur' and 'focus' events are fired and the background is changed.

The table (TEMPORARY table) stays white as long as the cursor stays in the search bar. And when the searchBar blurs the ORIGINAL table ('tableView') color changes.

Is there any other way you can reference the temporary table object using the 'search' object.

Thanks.

— answered 3 years ago by pawan jain
answer permalink
2 Comments
  • Hmmm I'm having the same problem. I had a poke around in TiUiSearchBar.m and seams as tho a new Table View is being created over the top of the old one however the backgroundColor value from the underlying table View isn't being passed to it.

    Seams like an easy fix unfortunately not sure of the exact approach in Obj C.

    Good ol Titanium one step forward 2 steps back.

    — commented 3 years ago by Adam Moritz

  • Anyone have a fix or a workaround for this yet? I tried following this (http://developer.appcelerator.com/question/132618/style-tableview-search) to make a custom search bar, but that's a lot of extra work to get it working just right.

    — commented 3 years ago by Brendan Young

Your Answer

Think you can help? Login to answer this question!