Changing the default image for a tableView list?

Is there a better way to change the default image for a tableView list than destroying the list and recreating it?

In the CoffeeDemo Universal they pass in the new image name to a function that creates the tableView.newlist. Then, when they want to swap images, they destroy the list, pass the image name to the function and insert the list back into the group. I guess that works, but it seems like a long way to go just to swap out the image in the rows.

Any tips, references, or suggestions?

Thanks in advance. [import]uid: 107536 topic_id: 28462 reply_id: 328462[/import]

Each row is a display group and the image in each row is just a display.newImageRect so in the row render function delete the image and add your new one making sure to insert it back into the row group [import]uid: 19626 topic_id: 28462 reply_id: 114878[/import]

Thank you Rob. I think I’m only understanding about half of that. I can grasp, “Each row is a display group and the image in each row is just a display.newImageRect”.

But I’m confused at “so in the row render function delete the image and add your new one making sure to insert it back into the row group”.

The standard example looks something like this:

 subCatList = tableView.newList{  
 data=subCatData,  
 default="images/listItemBg.png",   
 over="images/listItemBg\_over.png",   
 onRelease=subCatListButtonRelease, top=60,  
 bottom=1,  
  
 callback=function(item)  
  
 local t = display.newText(item.state, 0, 0, native.systemFontBold, 20)  
 t:setTextColor(255, 255, 255)   
 t.x = math.floor(t.width/2) + 20   
 t.y = 26  
 return t  
 end   
 }  

This works, until I want to change out the default background image for each row.

The CoffeeDemo Universal example uses a system.getInfo to determine the device and then destroys the list view. Based on the device orientation it passes an image to a function called createList with an image name as the parameter. Finally it adds the list back into the group, called main in this case.

 --destroy the list view  
 myList:cleanUp()  
  
 if direction == "landscapeLeft" or direction == "landscapeRight" then  
 --redraw the list with a wider background image.  
 createList("listItemBg-horiz.png")  
 else  
 --redraw the list with the normal background image.  
 createList("listItemBg.png")  
 end  
 main:insert(2,myList)  

Is that what you mean, or am I missing something even more basic?

I’m a programmer, but I’m also very new to Corona, so please feel free to speak to me like a 4 year old :slight_smile:

Thanks in advance. [import]uid: 107536 topic_id: 28462 reply_id: 114982[/import]

I think what rob means is make each tableView button a separate imageRect, and then insert them all into the tableView group. Set a listener for when you tap a tableViewButton, delete it and display the new imageRect as the ‘over’ image and insert it into the group

binc [import]uid: 147322 topic_id: 28462 reply_id: 115015[/import]

yea, that’s what I meant. Any graphic in a row is just an display.newImageRect. You position them using .x and .y like you would any other graphic except it’s relative to the row (0,0 being the top left of the row)
[import]uid: 19626 topic_id: 28462 reply_id: 115031[/import]

Thank you binc, but I’m not sure if that solves the problem I’m trying to solve.

I just want to refresh the background image of the rows when I change the orientation of the device.

Ultimately, I’m trying to get the expand the width of the row to its maximum viewable space when the the orientation changes from portrait to landscape.

My understanding is that the group will resize to match the largest item in the group, so when the device is in landscape I want to refresh the rows so they will have a larger background image.

Maybe I’m missing the bigger picture. Is there another way to explain the solution?

Thanks. [import]uid: 107536 topic_id: 28462 reply_id: 115032[/import]

I’m so sorry, I must have confused both you and rob. I had a tabBar in my mind the whole time. Sorry.

So let me get this straight:

You have a table view in your thing, or something like one.
You want your app to support both landscape and portrait modes.
You want to be able to when the orientation changes reset your bar to the new length.
You don’t want to have to rebuild the entire bar.

Is that correct? If it’s correct, I’m not too much of a tableView guy, but couldn’t you make a function in tableView.lua that can make two possibilities, myTableView[1] and [2] and myTableView[3] and [4]? Then you could make a function that when the orientation changes, switch them out and say, ‘showView2’ or something to that effect.

binc [import]uid: 147322 topic_id: 28462 reply_id: 115126[/import]

Hey binc & robmiracle,

Thank you for the follow up. Yes, I have created a tableView in my app and I want to be able to switch between portrait and landscape and have the tableView grow and shrink accordingly. The examples I’ve seen completely rebuild the listView each time the orientation changes.

Here’s a full example without orientation support:
http://developer.coronalabs.com/content/list-view-1

My question is this: Is there a way to refresh the default image in the listView rows without having to rebuild the listView each time the orientation changes.

Thanks again. [import]uid: 107536 topic_id: 28462 reply_id: 115277[/import]

I’d say you could just rotate it and, like some apps I’ve seen, put a menu bar or something to the blank space to the side. You might also make the functions ‘listView:landscape’ or ‘listView:portrait’.

Why don’t you want to rebuild it, again? If you’re worried about memory space, that’s no problem. When you rebuild it just remove and nil the previous one.

binc [import]uid: 147322 topic_id: 28462 reply_id: 115334[/import]

Interesting. Note to @Corona Labs… You need to update your sample code online to be compatible with the Wdiget Library.

What build of Corona SDK are you using?

The link you provided to the sample code is not using the Widget library API calls. You need to look inside your Corona SDK folder (on a Mac it’s in:

Applicaitons->CoronaSDK->Sample Code->Interface->WidgetDemo

I have no idea on how to do thiings with the method you are trying to use. In the widget.newTableView way of doing things you setup a function that gets called when a row need’s rendered and you manage all of the drawing of that row in that function.

[import]uid: 19626 topic_id: 28462 reply_id: 115338[/import]

Thanks @robmiracle. I’m using CoronaSDK 2012.849.

So, I take it from your response that using the tableView library is not what you’d recommend? Is that correct?

In general, do you only use what’s included in the Corona API or do you use third party libraries as well? Remember, I’m new to Corona, so that’s why I’m asking.

Thanks. [import]uid: 107536 topic_id: 28462 reply_id: 115464[/import]

I think a little history is in order…

In the beginning Corona didn’t have any “App” widgets. It was pretty much a game platform. Then the community built some widgets…

Then Corona Labs started a project that was a UI beta as an external library. I think what you are using is from that UI Beta.

Some time last year, instead of it being external, they rolled it into the actual product. This is known as the widget API which if you go to the documents section of the website and if you go to widget.* subsection this is what is documented there.

If I were you, I would use the new stuff that’s documented using widget.*. It’s supported. You’re not going to get a lot of help out of the old discontinued stuff.
[import]uid: 19626 topic_id: 28462 reply_id: 115468[/import]

Thank you @ robmiracle. That’s the advice I was needing. I’m not interested in spending time on learning old stuff. I’ll definitely switch gears and look more into implementing the widget API version instead. Thanks so much for taking the time to set me straight. I’ll do as much leg work as possible from here.

Thank you @binc as well. I appreciate your support. [import]uid: 107536 topic_id: 28462 reply_id: 115484[/import]