[TIMOB-15249] Android: TableView header and footer cannot be removed or resized dynamically

GitHub Issue	n/a
Type	Bug
Priority	Low
Status	Closed
Resolution	Fixed
Resolution Date	2018-05-21T20:07:37.000+0000
Affected Version/s	n/a
Fix Version/s	Release 7.3.0
Components	Android
Labels	android, footerview, headerview, tableview
Reporter	Fokke Zandbergen
Assignee	Joshua Quick
Created	2013-08-15T08:17:21.000+0000
Updated	2018-07-02T21:18:10.000+0000

Description

In contrast with iOS, on Android the headerView and footerView of a TableView cannot be removed or resized (height) after once the window is opened and the table layed out. Since the [docs](http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.UI.TableView) do not mention any platform differences, I'd expect this to work on Android like it does on iOS.

Steps to reproduce

Create a new project: `titanium create -p ios,android -n testHeader -d . --id test.header`

For `app.js` use:

    var w = Ti.UI.createWindow({
        backgroundColor: 'white'
    });

    var t = Ti.UI.createTableView({
        data: [
            { title: 'One' },
            { title: 'Two' },
            { title: 'Three' },
            { title: 'Four' },
            { title: 'Five' }
        ]
    });

    var h = Ti.UI.createView({
        backgroundColor: 'red',
        height: 100,
        width: Ti.UI.FILL
    });

    h.addEventListener('click', function () {
        h.height = 50;
        f.height = 50;
    });

    var f = Ti.UI.createView({
        backgroundColor: 'green',
        height: 100,
        width: Ti.UI.FILL
    });

    f.addEventListener('click', function () {
        t.headerView = null;
        t.footerView = null;
    });

    t.headerView = h;
    t.footerView = f;

    w.add(t);
    w.open();

Run the app on both Android and iOS devices.

Tap the red headerView and notice that only on iOS it resizes both the header and footerView.

Tap the green footerView and notice that only on iOS it removes both the header and footerView.

Attachments

File	Date	Size
device-2013-09-13-163711.png	2013-09-13T14:37:31.000+0000	14310

Comments

Motiur Rahman 2013-09-13

Hi Fokke Zandbergen, Please provide me some sample code or snapshot of the table view so that i can understand and fix this bug. And i think if you not set header and footer it will be not set or if you set this you can remove this simple. Thanks,
Fokke Zandbergen 2013-09-13

Updated with test case and screenshot.

Motiur Rahman 2013-09-13

Hi Fokke Zandbergen, You can use this code where header and footer has removed,

   var w = Ti.UI.createWindow({
       backgroundColor: 'white'
   });
    
   var t = Ti.UI.createTableView({
       data: [
           { title: 'One' },
           { title: 'Two' },
           { title: 'Three' },
           { title: 'Four' },
           { title: 'Five' }
       ]
   });
    
    
   w.add(t);
   w.open();

And if you want to re-sized the header and footer just decrease the height of f and h view. Thanks,

Fokke Zandbergen 2013-09-13

So your solution is NOT to use headerView and footerView? I don't think that's a valid solution.

Motiur Rahman 2013-09-13

Hi Fokke Zandbergen, This code is used header and footer and that re-sized. You can test this.

   var w = Ti.UI.createWindow({
       backgroundColor: 'white'
   });
    
   var t = Ti.UI.createTableView({
       data: [
           { title: 'One' },
           { title: 'Two' },
           { title: 'Three' },
           { title: 'Four' },
           { title: 'Five' }
       ]
   });
    
   var h = Ti.UI.createView({
       backgroundColor: 'red',
       height: 25,
       width: Ti.UI.FILL
   });
    
   h.addEventListener('click', function () {
       h.height = 50;
       f.height = 50;
   });
    
   var f = Ti.UI.createView({
       backgroundColor: 'green',
       height: 25,
       width: Ti.UI.FILL
   });
    
   f.addEventListener('click', function () {
       t.headerView = null;
       t.footerView = null;
   });
    
   t.headerView = h;
   t.footerView = f;
    
   w.add(t);
   w.open();

Thanks

Fokke Zandbergen 2013-09-15

[~morahman] the only difference between your code and mine in the ticket's description is that you've set the header and footerView's height to 25 on creation. The very point of this ticket is that on iOS you can change the height of the views after the table has been created and even remove them. On Android this does not work.
Sergey Volkov 2017-07-04

https://github.com/appcelerator/titanium_mobile/pull/9193
Sergey Volkov 2018-05-22

{quote}Summary < Android: headerView & footerView cannot be removed or resized after creation --- > Android: TableView header and footer cannot be added/removed dynamically{quote} There was problem with resizing (fixed in [79e33e1](https://github.com/appcelerator/titanium_mobile/pull/9193/commits/79e33e19f9cbb54a62bc2074873dc78147a053d7)) and adding always worked. Current ticket title is incorrect.
Joshua Quick 2018-05-22

[~s.volkov], it sounds like it needs to be re-tested to prove that resizes work. Once proven, we'll update the title. [~smohammed], can you re-run the following resize test please? It's the one where you tap the red button. Thanks. https://github.com/appcelerator/titanium_mobile/pull/9193#issuecomment-314890439
Samir Mohammed 2018-05-22

[~jquick] Using SDK build 7.3.0.v20180522085724 and running the test case mentioned in https://github.com/appcelerator/titanium_mobile/pull/9193#issuecomment-314890439. The headerView and footerView resize when pressing the red button.
Joshua Quick 2018-05-23

I've also confirmed that header/footer can be added and replaced dynamically as well. So, this was just a removal and resize issue. Thanks everyone.
Lokesh Choudhary 2018-07-02

Verified the fix in SDK 7.3.0.v20180628132121. Closing.

JSON Source