Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-25221] Android: Vertical Layout with top+bottom broken

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2017-09-07T01:15:16.000+0000
Affected Version/sRelease 6.2.0
Fix Version/sRelease 6.2.0
ComponentsAndroid
Labelsandroid, automated, layout, regression
ReporterMichael Gangolf
AssigneeJoshua Quick
Created2017-09-01T14:37:45.000+0000
Updated2017-10-30T17:37:27.000+0000

Description

*Summary:* When setting both top AND bottom on an element inside a vertical layout view it won't add spacing between the elements but fill up the whole space. *Versions:* 6.1.2.GA: works fine !612_ga.png|thumbnail! 6.2.0.RC: broken layout when both properties are set !620_rc.png|thumbnail! *Work-around:* remove top OR bottom !620_rc_one.png|thumbnail! *Code:*
var win = Ti.UI.createWindow({
	backgroundColor: '#fff'
});

var scroller = Ti.UI.createScrollView({
    height:Ti.UI.FILL,
    width: Ti.UI.FILL,
    layout:"vertical"
});

for (var i=0;i<10;++i){
    var l = Ti.UI.createLabel({
        top:10,
        bottom:10,
        height:Ti.UI.SIZE,
        text: "Text",
        color:"#000"
    });
    scroller.add(l);
}

win.add(scroller);
win.open();

Attachments

FileDateSize
612_ga.png2017-09-01T14:33:46.000+000049998
620_rc_one.png2017-09-01T14:33:46.000+000047750
620_rc.png2017-09-01T14:33:46.000+000032260
CompositePinning-Bad.png2017-09-06T03:14:37.000+000054163
CompositePinning-Good.png2017-09-06T03:14:37.000+000055659
CompositePinningTest.js2017-09-06T03:14:37.000+00002755
VerticalPinning-Bad.png2017-09-06T01:25:11.000+000093032
VerticalPinning-Good.png2017-09-06T01:25:11.000+0000184002
VerticalPinningTest.js2017-09-06T01:25:11.000+0000766

Comments

  1. Ewan Harris 2017-09-01

    Thanks for the report [~michael], moving over to TIMOB Can reproduce using Ti SDK 6.2.0.v20170831112315 OnePlus 3 7.1.1
  2. Gary Mathews 2017-09-01

    [~jquick] Looks like it was caused by [4d867c87#L490](https://github.com/appcelerator/titanium_mobile/commit/4d867c8744fd66c850eaf3f60f0b31f64a337a6c#diff-b7d8226bed739c2390e67e486bad811fL490). You may want to check left and right too [4d867c87#L490](https://github.com/appcelerator/titanium_mobile/commit/4d867c8744fd66c850eaf3f60f0b31f64a337a6c#diff-b7d8226bed739c2390e67e486bad811fL460).
  3. Michael Gangolf 2017-09-01

    Left/right with horizontal was working fine
  4. Joshua Quick 2017-09-01

  5. Michael Gangolf 2017-09-01

  6. Joshua Quick 2017-09-06

    Attached a [^VerticalPinningTest.js] script to help test/exercise various top/bottom/left/right pinning in a vertical layout. The "VerticalPinning-Bad.png" shows the bad behavior in Titanium 6.2.0 RC. The "VerticalPinning-Good.png" is the expected behavior.
  7. Joshua Quick 2017-09-06

    Also attached [^CompositePinningTest.js] script to test with composite layouts as well, which has a similar regression as vertical layouts in 6.2.0.
  8. Joshua Quick 2017-09-06

    PR (master): https://github.com/appcelerator/titanium_mobile/pull/9403 PR (6.2.x): https://github.com/appcelerator/titanium_mobile/pull/9404
  9. Lokesh Choudhary 2017-09-07

    FR Passed. PR's merged.
  10. Lokesh Choudhary 2017-09-07

    Verified the fix in SDK 6.2.0.v20170907070223 & 7.0.0.v20170907070720. Closing. Studio Ver: 4.9.1.201707200100 OS Ver: 10.12.3 Xcode Ver: Xcode 8.3.3 Appc NPM: 4.2.9 Appc CLI: 6.2.4-9 Ti CLI Ver: 5.0.14 Alloy Ver: 1.9.13 Node Ver: 6.11.2 Java Ver: 1.8.0_101 Devices: ⇨ google Nexus 5 --- Android 6.0.1 ⇨ google Pixel --- Android 7.1.1
  11. Kerberos 2017-10-29

    This issue still continue with SDK 6.2.2GA
  12. Joshua Quick 2017-10-30

    [~Kerbooo], this JIRA case's specific issue along with its 3 attached JavaScript test cases is definitely solved in 6.2.0.GA. If you're running into a layout issue, then can you write up a new case via the "Create" button above and attach reproducible test code please? Thanks.

JSON Source