How to make the row height of Tableview widget flexible to the content ?

Solar2D Widgets
#1

Hi all,

I am wondering if there is a way to make the row height flexible to the content that is inserted into it ? like for example tweeter …

my data is read from database and it can vary in size. So I want the height to match the data .

[lua]

      list = widget.newTableView
      {
          left =0,
          top = 200,
          height = _H - 300 ,
          width = _w,
          onRowRender = onRowRender,
          onRowTouch = onRowTouch,
          --listener = scrollListener
      }

  local function InsertRows()
       
        for i = 1, #listRecs  do
           list:insertRow{
            rowHeight = 150,
            --isCategory = true,
            rowColor = { default={ 1, 1, 1 }, over={ 1, 0.5, 0, 0.2 } },
            lineColor = { 0.5, 0.5, 0.5 }
           
         }
        end 

[/lua]

I appreciate your advice

Abdul

#2

any advice team

thx

Abdul

#3

Its not possible in a nice way as far as I know.

I’m rendering the text object temporarily with same size etc, checking the height, then removing the object and then add it to the tableview .

#4

aha, 

but how do you check the size and the height of the text ?? are you using string functions 

#5

I have a function something like this:

[lua]

local widthOfRow = 200

local function renderChatText(txt)

    return display.newText(txt, 0, 0, widthOfRow, 0, font, 22)

end[/lua]

Before inserting row I have to get the height of my text:

[lua]local tempText  = renderChatText(txt) – Workaround to get row height before inserting.

local rowHeight       = verticalPadding + tempText.height

tempText : removeSelf()

tempText = nil[/lua]

In my onRowRender function I use the same renderChatText function.

[lua]local chat  = renderChatText(txt)

row:insert(chat)

[/lua]

Hope that is clear. 

#6

i think it is clear, i need to try… one question…

what do you put in the list:insertRow as height…

i assume you do the following  :

[lua]

 

list:insertRow{

  1.             rowHeight = rowHeight,
  2.             --isCategory = true,
  3.             rowColor = { default={ 1, 1, 1 }, over={ 1, 0.5, 0, 0.2 } },
  4.             lineColor = { 0.5, 0.5, 0.5 }
  5.            
  6.          }

[/lua]

correct ?

#7

The code above is just to figure out the height before inserting the row. You don’t need to use it, just follow these steps:

  1. Render the text in the same way it will eventually be in the table. 

  2. Check the height of that object

  3. Discard the object, not needed anymore.

  4. Insert the row with the height you just figured out should be

#8

While this isn’t a precise means, if you can predict the height before you do the insertRow() call, you can set the height for that row then.

Rob

#9

any advice team

thx

Abdul

#10

Its not possible in a nice way as far as I know.

I’m rendering the text object temporarily with same size etc, checking the height, then removing the object and then add it to the tableview .

#11

aha, 

but how do you check the size and the height of the text ?? are you using string functions 

#12

I have a function something like this:

[lua]

local widthOfRow = 200

local function renderChatText(txt)

    return display.newText(txt, 0, 0, widthOfRow, 0, font, 22)

end[/lua]

Before inserting row I have to get the height of my text:

[lua]local tempText  = renderChatText(txt) – Workaround to get row height before inserting.

local rowHeight       = verticalPadding + tempText.height

tempText : removeSelf()

tempText = nil[/lua]

In my onRowRender function I use the same renderChatText function.

[lua]local chat  = renderChatText(txt)

row:insert(chat)

[/lua]

Hope that is clear. 

#13

i think it is clear, i need to try… one question…

what do you put in the list:insertRow as height…

i assume you do the following  :

[lua]

 

list:insertRow{

  1.             rowHeight = rowHeight,
  2.             --isCategory = true,
  3.             rowColor = { default={ 1, 1, 1 }, over={ 1, 0.5, 0, 0.2 } },
  4.             lineColor = { 0.5, 0.5, 0.5 }
  5.            
  6.          }

[/lua]

correct ?

#14

The code above is just to figure out the height before inserting the row. You don’t need to use it, just follow these steps:

  1. Render the text in the same way it will eventually be in the table. 

  2. Check the height of that object

  3. Discard the object, not needed anymore.

  4. Insert the row with the height you just figured out should be

#15

While this isn’t a precise means, if you can predict the height before you do the insertRow() call, you can set the height for that row then.

Rob

#16

Hi All,

Any unintended side effects for this workaround? Any plans to provide an option in the future to update the row.height (and other row options) inside the onRowRender function?

Thanks jonjonsson for sharing the workaround.

Jeremiah.

#17

Hi All,

Any unintended side effects for this workaround? Any plans to provide an option in the future to update the row.height (and other row options) inside the onRowRender function?

Thanks jonjonsson for sharing the workaround.

Jeremiah.