Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-1726] hideNavbar/showNavbar on tableview searchbar focus/blur whites out first page of results

GitHub Issuen/a
TypeBug
PriorityTrivial
StatusClosed
ResolutionFixed
Resolution Date2011-04-17T01:56:59.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
Labelsblur, ios, searchbar, tableview
ReporterRobby
AssigneeReggie Seagraves
Created2011-04-15T03:00:37.000+0000
Updated2011-11-29T05:06:46.000+0000

Description

Another tableview bug I've noticed with a working test case. Basically I like to hide the navbar when searching as it creates more room for the user to see his/her results. With a tableview with custom labels in it and/or one with a custom row height (not sure which exactly), searching causes the first page of results to be blank. It appears to be a rendering error as if you scroll past it and then back up, they are redrawn correctly.

To reproduce, do the following: 1. Take the code below, throw it in a navgroup (or tabgroup, whatever works)...or change it slightly to make it its own window
2. When you go to the page, you'll see a list of rows. Search for the text "test"
3. As you type you'll notice the results are shown correctly, no problems here
4. Then, hit the blue Search button on the keyboard. The searchbar blur event is sent, and the navbar is restored. This clears the first page of results.
5. Scrolling down and back up shows the first page properly.

I've confirmed this with both 1.4.0 and the 1.4.1 nightly from 9/2/2010. The controls are contained in a rowView, but removing that doesn't fix it. Also, trying to scroll the tableview to the top to try to invoke a refresh doesn't work either.

Here's the code:

var win = Ti.UI.currentWindow;
var max = 100;
var data = [];

for (var i=0; i<max; i++) {

        var row = Ti.UI.createTableViewRow({
            label:"Testing: " + i,
            className:'testRow'+i,
            height:100,
        });

        var rowView = Ti.UI.createView({ 
           top:0,
           left:0, 
           height:100,
        });
    
        var nameText = Ti.UI.createLabel({
            font:{fontSize:18,fontWeight:'bold'},
            left:70,
            top:2,
            height:25,
            width:220,
            text: "Testing: " + i
        });
        rowView.add(nameText);
    row.add(rowView);
    data[i] = row;
}

    //
    // CREATE SEARCH BAR
    //
    //disable it for now due to bug rendering results (first few rows are blank after Search btn is selected)
    // however, filtering while we type works fine...very weird...
    var search = Ti.UI.createSearchBar({
        showCancel:false
    });
    search.addEventListener('change', function(e) {
       return e.value; // search string as user types
    });
    search.addEventListener('cancel', function(e) {
       search.blur();
    });
    
    //HAVING THIS HERE IS WHAT MESSES THE TABLE DISPLAY UP AFTER THE SEARCH BUTTON IS CLICKED 
    search.addEventListener('focus', function(e){
        win.hideNavBar();
    });
     
    search.addEventListener('blur', function(e){
        win.showNavBar();
    });
    //////////////////


var tableview = Ti.UI.createTableView({
    search:search,
    data:data,
    filterAttribute:'label'
});


//Setup
win.add(tableview);

Comments

  1. James K 2011-04-15

    I also have this problem.

    It would be nice to be able to reproduce Apple's search bar implementation.

    version=1.5.0
    timestamp=11/21/10 21:50
    githash=9d2b18d

  2. Stephen Tramer 2011-04-15

    Tested 1.6.0GM. Test in bugtests.

  3. Mauricio Meirelles 2011-11-29

    Is this fixed? Because it's still happening to me (v1.8 / iOs 5).

JSON Source