TableView row content disappearing when scrolling - Intermittent

jefff182 · August 11, 2015, 1:27am

Hi All!

Completely new to the forum and fairly new to Corona. (I’ve been using it now for about 2 weeks so I apologize in advance for any stupid questions. But here comes one now… )

I have an app setup using Composer for the scenes and a tableView in 2 of them. The data source for the table view is a web api (my own) that simply returns an array of json objects with a network.request and then consumes it with a standard listener.

The data returned from the web api is not huge. (My issue is occuring with either 10 rows or 100+ rows).

When first running the app and scroll down (revealing the text below), everything works perfectly. But when I scroll back up (revealing text from the top), most of the rows have blank data. The row spacing is still there, as is the backgroud color I set for the “name” row but the text is missing. (Some of the Name row text is preserved but most isn’t.)

(*I can just see the text start to draw at the top of the scene as I scroll but it’s just a couple of pixels before it disappears.)

There are no errors anywhere and the console shows me the rows are being rendered with the correct data.

Here’s the code:

I populate the tableView from within the network listener .

local function networkListener( event ) local myData = {} &nbsp;&nbsp;&nbsp; if ( event.isError ) then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print( "Network error!" ) &nbsp;&nbsp;&nbsp; else &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; myNewData = event.response &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print ("From server: "..myNewData) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; local myData = (json.decode( myNewData)) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; --table.sort (myData) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for key,value in orderedPairs(myData) do &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; local h = 30 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print ("Looping1: "..value.RESULT) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (value.TRACK == "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; value.DATE = "" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; h = 30 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; myList:insertRow{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; rowHeight = h, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; isCategory = false, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; rowColor = { 1, 1, 1 }, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; lineColor = { 1, 1, 1 }, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; params = { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; name = value.TRACK, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; date = value.DATE, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; class = value.CLASS, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; results = value.CLASS.." :: "..value.RESULT &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp; end end

Here’s the tableView setup;

local navBarHeight = 60 local tabBarHeight = 50 local myList = widget.newTableView { &nbsp;&nbsp; top = navBarHeight, &nbsp;&nbsp; width = display.contentWidth, &nbsp;&nbsp; height = display.contentHeight, &nbsp;&nbsp; onRowRender = onRowRender, &nbsp;&nbsp; onRowTouch = onRowTouch, &nbsp;&nbsp; listener = scrollListener }

… and here’s the row renderer. (I wrap all the rows with If’s so that they don’t get created if there’s no data for a particular field).

&nbsp; local function onRowRender( event ) &nbsp;&nbsp; local row = event.row &nbsp;&nbsp; local id = row.index &nbsp;&nbsp; local params = event.row.params &nbsp;&nbsp; --print ("Setting: "..params.results) &nbsp;&nbsp; row.bg = display.newRect( 0, 0, display.contentWidth, 60 ) &nbsp;&nbsp; row.bg.anchorX = 0 &nbsp;&nbsp; row.bg.anchorY = 0 &nbsp;&nbsp; row.bg:setFillColor( 1, 1, 1 ) &nbsp;&nbsp; row.bg:setFillColor( 0, 0, 0 ) &nbsp;&nbsp; if (params.name ~= "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.bg:setFillColor( .1, .1, .1 ) &nbsp;&nbsp; end &nbsp;&nbsp; row:insert( row.bg ) &nbsp; if ( event.row.params ) then&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; if (params.name ~= "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText = display.newText( params.name, 12, 0, native.systemFontBold, 16 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText.anchorX = 0 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText.anchorY = 0.5 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText:setFillColor( 0, 1, 0 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText.y = 13 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.nameText.x = 10 &nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp; if (params.results ~= "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText = display.newText( params.results, 12, 0, native.systemFont, 14 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText.anchorX = 0 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText.anchorY = 0.5 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText:setFillColor( 1 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText.y = 13 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText.x = 10 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (params.name == "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.resultsText.y = 13 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp; if (params.date ~= "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText = display.newText( params.date, 12, 0, native.systemFontBold, 14 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText.anchorX = 0 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText.anchorY = 0.5 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText:setFillColor( 0, 4, 0 ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText.x = display.contentWidth - 75 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row.dateText.y = 13 &nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (params.name ~= "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row:insert( row.nameText ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row:insert( row.dateText ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (params.name == "") then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; row:insert( row.resultsText ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; --print ("Setting: "..params.results) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; end &nbsp;&nbsp; end &nbsp;&nbsp; return true end

Scene creation… (all the other scene functions are the default ones from the Composer template without any code changes).

function scene:create( event ) &nbsp;&nbsp;&nbsp; local sceneGroup = self.view &nbsp;&nbsp;&nbsp; -- Initialize the scene here. &nbsp;&nbsp;&nbsp; sceneGroup:insert( myList ) &nbsp;&nbsp;&nbsp; network.request( "MY\_URL", "GET", networkListener )&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; end

Any help would be appreciated.

Thanks!

jefff182 · August 12, 2015, 11:01pm

I finally figured it out.

It was the first row insert in onRender (the row background). Removing that fixed the disapearing content issue but trashed the menu above it. Soo… I gave that approach up. However, by simply setting the row color to transparent, it resolved everything. (Setting rowColor to my desired bg color in :insertRow method now).

(I don’t know how to mark this solved myself while not marking it as “Best answered” as well. So I’ll leave it open for now).

row.bg = display.newRect( 0, 0, display.contentWidth, 60 ) &nbsp;&nbsp; row.bg.anchorX = 0 &nbsp;&nbsp; row.bg.anchorY = 0 &nbsp;&nbsp; row.bg:setFillColor( 0, 0, 0, 0 ) -- transparent &nbsp;&nbsp; row:insert( row.bg )

jefff182 · August 12, 2015, 11:01pm

I finally figured it out.

It was the first row insert in onRender (the row background). Removing that fixed the disapearing content issue but trashed the menu above it. Soo… I gave that approach up. However, by simply setting the row color to transparent, it resolved everything. (Setting rowColor to my desired bg color in :insertRow method now).

(I don’t know how to mark this solved myself while not marking it as “Best answered” as well. So I’ll leave it open for now).

row.bg = display.newRect( 0, 0, display.contentWidth, 60 ) &nbsp;&nbsp; row.bg.anchorX = 0 &nbsp;&nbsp; row.bg.anchorY = 0 &nbsp;&nbsp; row.bg:setFillColor( 0, 0, 0, 0 ) -- transparent &nbsp;&nbsp; row:insert( row.bg )