How far can table view go?

Back from a long and deep dive into native development, I am looking for a cross-platform approach again. As a test for myself (and Corona, of course) I decided to reproduce one of my native iPhone apps with Corona SDK. An important component of that app is a table view, and I was able to display my data with Corona table view quite nicely. 

However, I don’t just display data, I need to give the user ability to delete some rows. I looked around and figured out that with some additional coding I can do that in Corona. However, its table view is a bit peculiar. If you tell it to delete the 3rd row, that row disappears. If you tell it to delete the third row again, nothing happens. My understanding is that the table view is created once, and you can’t really modify its core structure without creating another table view. It can hide the third row, but that row is still somewhere there.

Okay, I can delete some rows, fine. But I also need to give the user a possibility of reordering the rows - like, dragging the fifth row and dropping it into the second place. From looking at the API, and remembering my experience with deleting rows, I believe reordering of table rows isn’t possible in Corona at all, and won’t be possible even in the future.

Am I right or not?

Hi Sundraw,

Grabbing and dropping rows into another slot is not supported in the base tableView, but it may be possible to create this kind of interactivity. The main issue will be how in-depth you want to go. Do the rows dynamically “separate” as you drag one row around, and visually open up to indicate that the dragged row will be dropped there? If not, how do you signal to the user where the row will be dropped? No doubt this kind of functionality would be tricky, but with the proper efforts, I believe it could be done.

Best regards,

Brent

Hi Brent,

I thought it could be possible, when you are drawing the table view in OpenGL (unlike, say, Titanium, where they are using a native component). But maybe the framework enforces some limitations with its lifecycle etc? Like, a component has to stay immutable once it was created?

If reordering of rows could be implemented, it would give a great boost to Corona, in my opinion. It would mean that you can do this reordering on Android nicely and easily, which would be a real treat. 

As for how to do it visually, iOS can show a good example. There, you enable that reordering with a few lines of code, and there you go – drag and drop rows as you wish. If you need a specific example (and you have an iPhone), I can give you a link to one of my free hobby apps that implements the feature.

Another highly desirable ability for the Corona table view (and I think it would be easy to implement) is an ability to show and hide complete sections, with an animation, when tapping on the section header. This would allow to easily create accordion interfaces that are currently very popular with UX/UI guys – at least in the company I currently work for. 

Thanks,

Alex

Hi Sundraw,

Grabbing and dropping rows into another slot is not supported in the base tableView, but it may be possible to create this kind of interactivity. The main issue will be how in-depth you want to go. Do the rows dynamically “separate” as you drag one row around, and visually open up to indicate that the dragged row will be dropped there? If not, how do you signal to the user where the row will be dropped? No doubt this kind of functionality would be tricky, but with the proper efforts, I believe it could be done.

Best regards,

Brent

Hi Brent,

I thought it could be possible, when you are drawing the table view in OpenGL (unlike, say, Titanium, where they are using a native component). But maybe the framework enforces some limitations with its lifecycle etc? Like, a component has to stay immutable once it was created?

If reordering of rows could be implemented, it would give a great boost to Corona, in my opinion. It would mean that you can do this reordering on Android nicely and easily, which would be a real treat. 

As for how to do it visually, iOS can show a good example. There, you enable that reordering with a few lines of code, and there you go – drag and drop rows as you wish. If you need a specific example (and you have an iPhone), I can give you a link to one of my free hobby apps that implements the feature.

Another highly desirable ability for the Corona table view (and I think it would be easy to implement) is an ability to show and hide complete sections, with an animation, when tapping on the section header. This would allow to easily create accordion interfaces that are currently very popular with UX/UI guys – at least in the company I currently work for. 

Thanks,

Alex

I would also love to see this functionality in Corona.

Sundraw: I’d suggest that you take a look at the scrollView and build your interface on top of that. You lose some of the automatic niceness of tableView, like row rendering when it’s nearly onscreen, but you can do that yourself. I wrote a left/hamburger menu module where you can delete elements with animation, and it works well. Adding reordering would probably take a day or two of work.

Separately, I’ve built accordion-like interface (similar to the way the new Material Design-themed YouTube Android app looks, with “v” icons for expansion) atop a tableView. Keep a master copy of the data external to the module, and feed it only what it needs based on the status of the accordion buttons.

It’s painful but possible, as long as you don’t mind building it yourself. Though I suspect Corona would be a far more attractive proposition for non-game developers if these were included in the core widget library!

I would also love to see this functionality in Corona.

Sundraw: I’d suggest that you take a look at the scrollView and build your interface on top of that. You lose some of the automatic niceness of tableView, like row rendering when it’s nearly onscreen, but you can do that yourself. I wrote a left/hamburger menu module where you can delete elements with animation, and it works well. Adding reordering would probably take a day or two of work.

Separately, I’ve built accordion-like interface (similar to the way the new Material Design-themed YouTube Android app looks, with “v” icons for expansion) atop a tableView. Keep a master copy of the data external to the module, and feed it only what it needs based on the status of the accordion buttons.

It’s painful but possible, as long as you don’t mind building it yourself. Though I suspect Corona would be a far more attractive proposition for non-game developers if these were included in the core widget library!