Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Search field on IPad project

I am trying to use a search box outside a tableview in my IPad project.

Hal pointed me to the right direction:

http://developer.appcelerator.com/question/85611/search-field-not-search-bar

But for some weird reason, when i add the search bar the table view adds a white space above the table (check the screens) below. And i cannot get rid of the 'search bar' look. I just one the field, like we use here at the forum

tks in advance :)

alt text
alt text
alt text

//
// CREATE SEARCH BAR
//
var searchbox = Titanium.UI.createView({
    top:63,
    height:40,
    left:530,
    widht:60
})

var searcher = Titanium.UI.createSearchBar({
    barColor:'transparent',
//    backgroundImage:'',
    backgroundColor:'transparent',
    showCancel:false
});
searcher.addEventListener('change', function(e)
{
e.value; // search string as user types
});
searcher.addEventListener('return', function(e)
{
searcher.blur();
});
searcher.addEventListener('cancel', function(e)
{
searcher.blur();
});

searchbox.add(searcher);
win1.add(searchbox);


//
// create table view (
//
tableView = Titanium.UI.createTableView({
    data:data,
        backgroundColor:'white',
    width:325,
    height: 300,
    left:35,
    top: 150,
    filterAttribute:'clientname',
        borderColor:'red',
    border: 1,
    separatorStyle:Ti.UI.iPhone.TableViewSeparatorStyle.NONE
});
— asked December 6th 2010 by Daniel Ander
  • ipad
  • search
  • searchbar
0 Comments

5 Answers

  • look at you "left" and "top" values for how you are laying out the views, I believe that is what is causing some of your problems.

    — answered December 6th 2010 by Aaron Saunders
    permalink
    0 Comments
  • If you want the Search field to occupy the full width of your app, I would do the following:

    Set your 'width' as 100% and 'left' to 0, or just remove it.

    var searchbox = Titanium.UI.createView({
        top:63,
        height:40,
        left:0,
        width: '100%'
    });
    
    — answered December 6th 2010 by Antonio Silveira
    permalink
    0 Comments
  • Thanks for the tips Aaron and Antonio.

    I am not trying to occupy the full width. I just want to get rid of the "bar" style (like the search field here at the forum):

    Search Field

    But my problem is the WHITE space this search bar create on top of my tableview. When i add:

    tableView.search = searcher;
    

    The tableview seems to create a white space above the actual rows…

    any tips?

    — answered December 6th 2010 by Daniel Ander
    permalink
    0 Comments
  • try this:

    
    tableView.setContentInsets({top:0})
    

    let me know if it works.

    — answered December 6th 2010 by Dan Tamas
    permalink
    2 Comments
    • Hi Tamas,

      Thanks for your input but it didnt work :(

      Daniel

      — commented December 7th 2010 by Daniel Ander
    • setContentInsets() is undocumented function what is not supported on SDK 1.6.0, use scrollToTop() instead

      — commented February 19th 2011 by gondo gondo
  • Bump… Any insights? :)

    — answered December 8th 2010 by Daniel Ander
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.