Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-20432] ListItems are getting transparent with scrolling

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2016-03-16T03:21:07.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsAndroid
Labelsandroid, listView, listitem, listsection
ReporterPrafull Bansode
AssigneeHieu Pham
Created2016-02-14T19:16:37.000+0000
Updated2017-03-24T21:12:45.000+0000

Description

When I scroll down the list, the last item's background colour is getting vanished & displaying it as transparent. When I scroll up, same thing happens with top most list items. If I rapidly scrolls up & down, most of the list item's background colour is converting into transparent. I am attaching the demo project with this. Please review it.

Attachments

FileDateSize
POC_ListView.zip2016-02-14T19:16:29.000+00002356707
Screenshot_2016-03-08-22-07-51.png2016-03-08T16:35:33.000+0000230062
Screen Shot 2016-02-15 at 12.11.45 PM.png2016-02-15T06:12:34.000+000098889
Screen Shot 2016-02-15 at 12.11.59 PM.png2016-02-15T06:12:35.000+000097693
Screen Shot 2016-02-15 at 4.16.27 PM.png2016-02-15T10:50:11.000+0000112859
Screen Shot 2016-02-15 at 4.16.50 PM.png2016-02-15T10:50:11.000+0000116928

Comments

  1. Sharif AbuDarda 2016-02-15

    Hello, I tried to reproduce the issue as described. I wasn't able to reproduce the issue. I am testing the project provided. I have tested with SDK 5.1.2.GA in Nexus 5X emulator (Android 6.0.0). I did not observe any change of the listview item when I scroll up and down in the Listview. See the attachment when I scroll down and Up. Please provide screen shots of what you are seeing. Thanks.
  2. Prafull Bansode 2016-02-15

    Thanks for the attention. I am attaching the screenshots which are taken on Genymotion : Google Nexus5 5.0.0.
  3. Sharif AbuDarda 2016-02-17

    Hello, Can you try testing on a different emulator besides Google Nexus5 or in an actual device maybe. I am not able to regenerate the issue. Reply with your findings. Thanks.
  4. Prafulla Bansode 2016-02-17

    I had tried on the available actual devices as well. Following is the list of devices & their respective os versions: 1. Samsung s3 (4.3) 2. Samsung s4 (5.0.1) 3. LG Nexus5 (6.0.1)
  5. Prafull Bansode 2016-02-19

    Any updates, please??
  6. Rakhi Mitro 2016-02-23

    Hello, Tested the issue you reported. Using same background image for all rows (templateContainerView) can be a workaround of this problem. If I rapidly scrolls up & down, list item's background is displaying as expected. *Testing Environment:* Appcelerator Command-Line Interface, version 5.2.0 Titanium SDK Version:5.1.2GA Platform: Nexus 7(device), Emulator: PREVIEW - Google Nexus 5X - 6.0.0 - API 23 - 1080x1920 Appcelerator Studio, build: 4.5.0.201602170821 Mac OS X,Version = OSX EI Capitan 10.11.1 *Test code:* index.js 
       
   var menuJSON = {
       "data": [
           {
               "icon": "/images/dashboard/Android_robot1.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           },
           {
               "icon": "/images/dashboard/Android_robot2.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           },
           {
               "icon": "/images/dashboard/Android_robot3.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           },
           {
               "icon": "/images/dashboard/Android_robot4.png",
             //  "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           },
           {
               "icon": "/images/dashboard/Android_robot5.png",
             //  "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot6.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot7.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot8.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           },
           {
               "icon": "/images/dashboard/Android_robot5.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot6.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot7.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png"
           },
           {
               "icon": "/images/dashboard/Android_robot8.png",
              // "backgroundImage": "/images/dashboard/Android-logo-wordmark1.png",
           }
       ]
   };
   init(menuJSON);
   function init(menuJSON) {
   	var array = [];
   	for (var i = 0; i < menuJSON.data.length; i++) {
   		var layoutJSON = {
   			template : "menuBlocksListTemplate",
   			properties : {
   				itemId : i,
   				//height : "88.8dp"
   			},
   			iconImage : {
   				image : menuJSON.data[i].icon,
   				top : "25dp"
   			},
   			templateContainerView : {
   				backgroundImage: "/images/dashboard/Android-logo-wordmark1.png",
   				backgroundColor : 'white',
   				//height : auto
   			}
   		};
   
   		array.push(layoutJSON);
   	}
   	console.log(">>>>>>>", array);
   	$.menuBlocksListSection.setItems(array);
   }
   
   $.index.open();
    *Test Result:* [screenshot1](http://postimg.org/image/7ls28dnsv/) [screenshot2](http://postimg.org/image/bougzvtdh/) [scrrenshot3](http://postimg.org/image/5oe1r0rw1/http:/)
  7. Aminul Islam 2016-03-08

    Hi, Tested this issue with latest sdk 5.2.0.GA and experienced the same behavior on android devices. This a valid bug for actual android devices. Please find the attached screenshot. *Test Environment* 
       Operating System  Mac OS X
   Node.js Version             = 0.12.0
   npm Version                 = 2.5.1
   CLI Version                 = 5.0.6
   SDK Version                 = 5.2.0.GA
   Android Devices HTC One_M8 Ey android 5.0.2 (android-21)
    Thanks
  8. Hieu Pham 2016-03-15

    master PR: https://github.com/appcelerator/titanium_mobile/pull/7846
  9. Ashraf Abu 2016-03-16

    PR Merged.
  10. Lee Morris 2017-03-24

    Closing ticket as fixed with reference to previous comments.

JSON Source