Hi Guys, i need some help here.
Hi have my table view on my screen and a nav bar at the top with the classic “back” button.
My nav bar is transparent ( iOS7 style) and i want to se my list (widget tableview) object under that while scrolling. so, no mask.
How to handle the touch event on my back button without “touching” the row below?
Thanks,
Andrea.
here a screenshot:
Hi Andrea,
I assume you’re using a “tap” listener on the button? If so, the hit event will pass through that, even if you “return true”.
There are various solutions to this, including the following… I’ve used it before and it works, but some other users may have better suggestions.
[lua]
local underBox = display.newRect( 50,50,100,100 ) ; underBox:setFillColor(255,255,255,100)
local overBox = display.newRect( 75,10,50,200 ) ; overBox:setFillColor(255,0,0,100)
local function underBoxListener( event )
if ( event.phase == “began” ) then print(“UNDERLYING BOX TOUCHED”) end
end
local function overBoxListener( event )
if ( event.name ~= “tap” ) then
print(“TOUCH VOIDED ON OVERLYING BOX”) ; return true
else
print(“OVERLYING BOX TAPPED!!!”)
end
end
underBox:addEventListener( “touch”, underBoxListener )
overBox:addEventListener( “tap”, overBoxListener )
overBox:addEventListener( “touch”, overBoxListener )
[/lua]
Basically, what you do here is add both a “tap” and a “touch” listener to the overlaying object (in your case, the button). You can use the same listener function to handle both. In that listener, if the hit/event is not equal to “tap”, you void the process by returning true. If the hit/event is equal to “tap”, then you handle it like normal (go back to your menu or whatever).
Hope this helps,
Brent
Thanks a lot Brent, you solve my problem as usual 
Hi Brent, if i could, i need to know another thing. I can’t find in the Api’s the “onRowRender” thing, but seems that te rows are rendered everytime i scroll (i have an image on everyone 7kb that i download dinamically by requesting an url i retrive by json), is that true?
Thanks,
Andrea.
local function onRowRender( event ) local phase = event.phase local row = event.row local function downloadFoto( event ) if ( event.isError ) then print ( "Network error - download failed" ) else listelements['testa'..row.index] = display.newImage(row,row.index..".jpg",system.TemporaryDirectory) listelements['testa'..row.index].height = 70 listelements['testa'..row.index].width = 50 listelements['testa'..row.index].x = 40 listelements['testa'..row.index].y = 50 listelements['cornice'..row.index] = display.newImageRect(row,"cornice.png",70,81) listelements['cornice'..row.index].x=40 listelements['cornice'..row.index].y=50 end --img.y = math.floor(img.height\*0.5) end network.download(pagelle[row.index].urlf, "GET", downloadFoto,row.index..".jpg", system.TemporaryDirectory) listelements['nome'..row.index] = display.newText(row,pagelle[row.index].nome,0,0,"HelveticaNeue-UltraLight",30) listelements['nome'..row.index]:setTextColor( 0, 0, 0 ) listelements['nome'..row.index].x = row.contentWidth/2 listelements['nome'..row.index].y = row.contentHeight/2 listelements['voto'..row.index] = display.newText( row,pagelle[row.index].media, 0, 0, "HelveticaNeue-UltraLight", 35 ) listelements['voto'..row.index].x = row.contentWidth - 50 listelements['voto'..row.index].y = row.contentHeight \* 0.5 local media = tonumber(pagelle[row.index].media) if pagelle[row.index].media \< "6" then listelements['voto'..row.index]:setTextColor( 255, 0, 0 ) else listelements['voto'..row.index]:setTextColor( 0, 255, 0 ) end if pagelle[row.index].gialli \> "0" then listelements['cartellino1'..row.index]=display.newImageRect(row,"giallo.png",8,11) else listelements['cartellino1'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino1'..row.index].x=130 listelements['cartellino1'..row.index].y=80 if pagelle[row.index].gialli == "2" then listelements['cartellino2'..row.index]=display.newImageRect(row,"giallo.png",8,11) else listelements['cartellino2'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino2'..row.index].x=150 listelements['cartellino2'..row.index].y=80 if pagelle[row.index].rosso == "1" then listelements['cartellino3'..row.index]=display.newImageRect(row,"rosso.png",8,11) else listelements['cartellino3'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino3'..row.index].x=170 listelements['cartellino3'..row.index].y=80 if pagelle[row.index].gol \> "0" then listelements['pallone'..row.index]=display.newImageRect(row,"pallone.png",11,11) listelements['pallonetext'..row.index]=display.newText( row,"x"..pagelle[row.index].gol, 0, 0, "HelveticaNeue-UltraLight", 10 ) listelements['pallonetext'..row.index]:setTextColor(0, 0, 0 ) listelements['pallonetext'..row.index].x=203 listelements['pallonetext'..row.index].y=80 else listelements['pallone'..row.index]=display.newImageRect(row,"pallonegrigio.png",8,11) end listelements['pallone'..row.index].x=190 listelements['pallone'..row.index].y=80 endHi Andrea,
Can you somehow load the row images in advance (from the URLs) and store them in memory? You may experience problems (in performance) if you try to download them during the TableView scroll, especially if there is some slow-down in the core network connection, or between the app and the server.
Brent
Oh… so, the row are rendered everytime i scroll?
Thanks.
Hi Andrea,
TableView rows are rendered as they enter the screen, and their view is destroyed when they exit the screen. If possible, I suggest that you try to cache the images locally, and only load them (network) if they don’t exist locally.
Take care,
Brent
oh Ok.
Basically i have a list of soccer match (my team lol) and when i touch a match i switch to another scene with another list with all my team mates faces with statistics… so for every match peaple change… i could download at the very beginning of the app all the photos of them.
Very good! Downloading in advance will be the best solution, for performance.
Brent
Hi Andrea,
I assume you’re using a “tap” listener on the button? If so, the hit event will pass through that, even if you “return true”.
There are various solutions to this, including the following… I’ve used it before and it works, but some other users may have better suggestions.
[lua]
local underBox = display.newRect( 50,50,100,100 ) ; underBox:setFillColor(255,255,255,100)
local overBox = display.newRect( 75,10,50,200 ) ; overBox:setFillColor(255,0,0,100)
local function underBoxListener( event )
if ( event.phase == “began” ) then print(“UNDERLYING BOX TOUCHED”) end
end
local function overBoxListener( event )
if ( event.name ~= “tap” ) then
print(“TOUCH VOIDED ON OVERLYING BOX”) ; return true
else
print(“OVERLYING BOX TAPPED!!!”)
end
end
underBox:addEventListener( “touch”, underBoxListener )
overBox:addEventListener( “tap”, overBoxListener )
overBox:addEventListener( “touch”, overBoxListener )
[/lua]
Basically, what you do here is add both a “tap” and a “touch” listener to the overlaying object (in your case, the button). You can use the same listener function to handle both. In that listener, if the hit/event is not equal to “tap”, you void the process by returning true. If the hit/event is equal to “tap”, then you handle it like normal (go back to your menu or whatever).
Hope this helps,
Brent
Thanks a lot Brent, you solve my problem as usual
Hi Brent, if i could, i need to know another thing. I can’t find in the Api’s the “onRowRender” thing, but seems that te rows are rendered everytime i scroll (i have an image on everyone 7kb that i download dinamically by requesting an url i retrive by json), is that true?
Thanks,
Andrea.
local function onRowRender( event ) local phase = event.phase local row = event.row local function downloadFoto( event ) if ( event.isError ) then print ( "Network error - download failed" ) else listelements['testa'..row.index] = display.newImage(row,row.index..".jpg",system.TemporaryDirectory) listelements['testa'..row.index].height = 70 listelements['testa'..row.index].width = 50 listelements['testa'..row.index].x = 40 listelements['testa'..row.index].y = 50 listelements['cornice'..row.index] = display.newImageRect(row,"cornice.png",70,81) listelements['cornice'..row.index].x=40 listelements['cornice'..row.index].y=50 end --img.y = math.floor(img.height\*0.5) end network.download(pagelle[row.index].urlf, "GET", downloadFoto,row.index..".jpg", system.TemporaryDirectory) listelements['nome'..row.index] = display.newText(row,pagelle[row.index].nome,0,0,"HelveticaNeue-UltraLight",30) listelements['nome'..row.index]:setTextColor( 0, 0, 0 ) listelements['nome'..row.index].x = row.contentWidth/2 listelements['nome'..row.index].y = row.contentHeight/2 listelements['voto'..row.index] = display.newText( row,pagelle[row.index].media, 0, 0, "HelveticaNeue-UltraLight", 35 ) listelements['voto'..row.index].x = row.contentWidth - 50 listelements['voto'..row.index].y = row.contentHeight \* 0.5 local media = tonumber(pagelle[row.index].media) if pagelle[row.index].media \< "6" then listelements['voto'..row.index]:setTextColor( 255, 0, 0 ) else listelements['voto'..row.index]:setTextColor( 0, 255, 0 ) end if pagelle[row.index].gialli \> "0" then listelements['cartellino1'..row.index]=display.newImageRect(row,"giallo.png",8,11) else listelements['cartellino1'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino1'..row.index].x=130 listelements['cartellino1'..row.index].y=80 if pagelle[row.index].gialli == "2" then listelements['cartellino2'..row.index]=display.newImageRect(row,"giallo.png",8,11) else listelements['cartellino2'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino2'..row.index].x=150 listelements['cartellino2'..row.index].y=80 if pagelle[row.index].rosso == "1" then listelements['cartellino3'..row.index]=display.newImageRect(row,"rosso.png",8,11) else listelements['cartellino3'..row.index]=display.newImageRect(row,"grigio.png",8,11) end listelements['cartellino3'..row.index].x=170 listelements['cartellino3'..row.index].y=80 if pagelle[row.index].gol \> "0" then listelements['pallone'..row.index]=display.newImageRect(row,"pallone.png",11,11) listelements['pallonetext'..row.index]=display.newText( row,"x"..pagelle[row.index].gol, 0, 0, "HelveticaNeue-UltraLight", 10 ) listelements['pallonetext'..row.index]:setTextColor(0, 0, 0 ) listelements['pallonetext'..row.index].x=203 listelements['pallonetext'..row.index].y=80 else listelements['pallone'..row.index]=display.newImageRect(row,"pallonegrigio.png",8,11) end listelements['pallone'..row.index].x=190 listelements['pallone'..row.index].y=80 endHi Andrea,
Can you somehow load the row images in advance (from the URLs) and store them in memory? You may experience problems (in performance) if you try to download them during the TableView scroll, especially if there is some slow-down in the core network connection, or between the app and the server.
Brent
Oh… so, the row are rendered everytime i scroll?
Thanks.
Hi Andrea,
TableView rows are rendered as they enter the screen, and their view is destroyed when they exit the screen. If possible, I suggest that you try to cache the images locally, and only load them (network) if they don’t exist locally.
Take care,
Brent
oh Ok.
Basically i have a list of soccer match (my team lol) and when i touch a match i switch to another scene with another list with all my team mates faces with statistics… so for every match peaple change… i could download at the very beginning of the app all the photos of them.
Very good! Downloading in advance will be the best solution, for performance.
Brent