How to change the color of a row in tableView?

Solar2D General Questions/Discussion
#1

Hi,
when I select a row in my tableRow its color changes, but if I select another row the first one mantain its new color.
How can I restore the default color in the first selected row?
I’ve tried this code:

function reloadTable()
  local rowOptionList = {}
  local count= tableView.getNumRows()
  for i = count, 1, -1 do
	row=tableView:getRowAtIndex( rowIndex )
           row.RowColor={ default = { 255, 255, 255 }, over = { 217, 217, 217 },}
  end
end

local function onRowTouch( event )
    local phase = event.phase
	local row = event.target
    row:setRowColor( { default = { 1, 1, 1 }, over = { 1,1,1} } )
    if "press" == phase then
        reloadTable()
        row:setRowColor(  {default = { 0, 255, 255 }, over = { 0,0, 255, 0 } } )
        strMazzo=row.params .. strFile[row.id].suffisso
     end
 end

 tableView = widget.newTableView
 {
  top = 60,
  left = 50,
  rowHeight=16,
  width = deviceWidth, 
  height = deviceHeight - 120,
 backgroundColor = backColor,
 onRowRender = onRowRender,
 onRowTouch = onRowTouch,
 listener = tableViewListener,
 }
group:insert( tableView )
 
local max=table.maxn(strFile)
 for i=1, max do
 rowColor = { default = { 255, 255, 255 }, over = { 217, 217, 217 },}
 rParam = strFile[i].titolo --- string.sub(strFile[i],1,string.len(strFile[i])-4)
tableView:insertRow
 {
 id = i,
 rowHeight = 32,
 lineColor = lineColor,
-- At this line I get an error
 rowColor=rowColor,
-- -------------------------------
fontColor=fontColor,
params = rParam
}
end

At the line:

rowColor=rowColor

I get an error.

How can I fix that?
Many thanks in advance.

#2

The simplest is you should create a rect for the background instead of the default row background

#3

@Kan98 I don’t know how to replace the row background! :frowning:

#4

Hi @Kan98 can you help me? I know how to use a rect instead of the default background, but I don’t understand how to reset the color to the row when I select a different row.

#5

Hi Saleh,

My first advise is not to use table views unless you have to.

I used to think TableViews are my savior because most of my apps are business apps with so many data coming from a database which need to be viewed in some sort of list.

When i knew about scrollviews i stopped using table views!

the problems i personally faced with Tableviews are:

  • Items are inserted via a loop, and rendered via render and touch listeners, and render listener can give you a hard time of you don’t know how to deal with it … specially in your case, if you change anything in a specific row, and then scroll away from that row, then scroll back … all of your changes will disappear, and the default values that were inserted will show again and whatever you changed will disappear … unless you store your things in arrays or tables and use if statements in your render listener

  • rows are designed to look the same, because you provide certain dimensions for rows, and you have to change the row content again by if statements and variables

so if you want to display a list of static objects, which look almost the same in structure, then tableviews are good, and i think they perform well because they will only render whatever is displayed currently on the screen

but scrollviews on the other hand, allow you to add whatever you want, wherever you want, whenever you want

and to solve your problem if you still want to use tableviews is to declare a local variable at the top of your lua file … this variable has to be an array or lua table, then you can store whatever you want in this array … like flags, numbers …etc

and in your render listener you can check

if myVariable[row.index]==1 then
--do your stuff and change the colors
else
--do your stuff and change the colors
end

and in your touch listener you need to modify the value of this array as well

if myVariable[row.index]==1 then
     myVariable[row.index]=1
else
     myVariable[row.index]=0
end

there are of course many other ways to do it … but this is one way …

i attached a working example for you :slight_smile:

TableViewForSaleh.zip (66.8 KB)

#6

For your case, I think scrollView should be used, because the tableView will delete the rows that are not displayed.

#7

Hi @kakula I tried to use scrollView but I failed! :frowning: I’m still a beginner.
Your example is working, but it doesn’t do what I want. It seems that I didn’t explain well.

In your example the default color is blue and when I press on one row it changes to red. That’s OK, but if I press on another row this new row becames red, but even the previous row remain red, it doesn’t get back the default color blue as I would like. So I would like that when I press on two rows the first one go back to the default color.

Thanks for your attention.

#8

i like your enthusiasm Saleh, you remind me of myself when i started with Soalr2D
and soon you will be helping others

attached is a modified code to fit your needs

TableViewForSaleh.zip (66.7 KB)

1 Like
#9

That’s it! Thank you very much!
I hope I will be able to help others as you do!

#10

Hi Saleh,

Try to scroll down a few rows … and click a row … it will crash :slight_smile:

This is why i hate Tableviews

i think it can be easily solved…

#11

This one is working properly

TableViewForSalehFinal.zip (67.2 KB)

1 Like
#12

@kakula I’ve not learned to use scrollView, yet. :frowning:
Do you know any tutorial about scrollView?

#13

in scrollviews you need to specify the object location … x and y

and the scollview will keep growing

it can scroll horizontally and vertically

1 Like
#14

@kakula thanks. I know Sola2D Documentation, but I don’t understand if scrollView will work like I want. How can I control the row colors?

#15

@kakula excuse me if I abuse your patience. I’m trying to use scrollVIew, but it seems more difficult than tableView!
How can I select a row and how can I set and unset row colors?

#16

Hi Saleh,

No problem man, nothing makes more happy than helping a colleague

The forum was offline for a while!

Scrollviews do not behave like tableviews
think of a scrollview as a display group that allows you to add into it other objects freely
and can be scrolled vertically and horizontally

attached is a sample code

ScrollViewForSaleh.zip (66.8 KB)

2 Likes
#17

@kakula thank you. I think I understood. I’ll try to use it. If I succeed to finish my first application I’ll send it to you for an evaluation.

#18

perfect and good luck…

i can provide you with good evaluation, but there are many developers here who are far better than me, programming is an endless world, and you can always become better … even John Carmack enhances his skills until today :slight_smile:
nowadays i can create a full business app in a couple of weeks, including frontend, backend, notifications, ads, in app purchases, web services, camera, mic, gps … you name it
the most important thing is to try to write a reusable clean code, which can always become better and more fine tuned
And the good thing is that Solar2D is designed to allow you to create apps and games insanely quickly, so try to make use of Solar2D power

2 Likes