Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

2 possible problems with TableView in G2
Started by claudeturcot Nov 21 2013 11:03 AM

26 replies to this topic
[TOPIC CONTROLS]
Page 1 of 2 1 2
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

claudeturcot

[GLOBAL: userInfoPane.html]
claudeturcot
  • Enthusiast

  • 30 posts
  • Corona SDK

I'm not using compatibility mode v1 by the way, full G2 with 2076 and 2085 (same effect)

 

1. I have a background where 2 animations (transition) is going on. I'm then displaying a tableview in a container (the new one from G2) in the middle of the screen (about half of the screen). The tableview is displayed but as soon as a scroll the list, one of my animation (transition) in the background stops. Only if a scroll. 

 

2. Having the tableview in a container is perfect for me but the single line between a row category and a single row is not full width, the listview for example is 380px large but that single line is missing about 10 pixels on the left and the right.

       With those values:

         nolines = false,

         hideBackground = true

 

* Screen shot for #2 below where you see the white line not the same width as the rest, it was ok pre G2

Attached Files



[TOPIC: post.html]
#2

jonjonsson

[GLOBAL: userInfoPane.html]
jonjonsson
  • Corona Geek

  • 1,051 posts
  • Corona SDK

I can confirm #1. There is some transition problem with tables. I have a slide to delete option and fade in the delete button, the transition is never completed. 



[TOPIC: post.html]
#3

jonjonsson

[GLOBAL: userInfoPane.html]
jonjonsson
  • Corona Geek

  • 1,051 posts
  • Corona SDK

Here is code to reproduce problem with item 1. Bug reported, case 28269.

 

-- Copy paste into main.lua
local widget        = require("widget")
local tableView   = widget.newTableView {
    left            = 0,
    top             = 200,
    topPadding      = 0,
    width           = display.contentWidth, 
    height          = display.contentHeight-200, 
}
    
local text = display.newText("DRAG ON THE TABLE", 150, 100, native.systemFont, 25 )
 
local function move()
    local function moveDown()
        transition.to(text, {y = 150, onComplete = move})
    end
     transition.to(text, {y = 30, onComplete = moveDown})
end
 
move()


[TOPIC: post.html]
#4

bjsorrentino

[GLOBAL: userInfoPane.html]
bjsorrentino
  • Veteran

  • 8,506 posts
  • Corona SDK

I can reproduce #1, it's very odd. Thanks for submitting the report.

 

@claudeturcot, for #2, the line indent mimics iOS as far as I can tell, so it's intentional. One alternative, for full-spanning lines, is that you turn the lines off (internally) and then add a line to the top or bottom of each row in your rendering function.

 

Thanks,

Brent



[TOPIC: post.html]
#5

claudeturcot

[GLOBAL: userInfoPane.html]
claudeturcot
  • Enthusiast

  • 30 posts
  • Corona SDK

Brent, ok I will try that but what is funny (that's why I think it's not intentional) is that sometimes the line doesn't have the same indent on the left end side. 

 

Anyway, not a big deal and very happy that jonjonson found a way to reproduce the #1 problem, that is more critical!

 

Now just need to see if somebody will find a way to fix or reproduce the jerkiness of some animations that was not there before. 

 

Thanks



[TOPIC: post.html]
#6

ksan

[GLOBAL: userInfoPane.html]
ksan
  • Corona Geek

  • 2,795 posts
  • Corona SDK

I'm observing the same line indent issue. I don't know of any IOS native apps from Apple that exhibit this. Besides, we develop not just for Apple. Suggest this "intentional" design element is either removed or made optional. Thanks!!!



[TOPIC: post.html]
#7

max84

[GLOBAL: userInfoPane.html]
max84
  • Enthusiast

  • 37 posts
  • Corona SDK

@ksan - I think the indent is present in almost every iOS 7 tableview (settings, contacts, messages), at least on the left. The indent on the right is only present on lists such as the contacts where an alphabet picker takes up the right side. But I agree this should probably be optional.

 

@Brent Sorrentino - Setting noLines = true does nothing for me. The lines remain, despite having no lineColor passed to insertRow. More importantly, when lines are present they flicker very badly whilst the tableview is being scrolled. Is this a known issue in G2?



[TOPIC: post.html]
#8

bjsorrentino

[GLOBAL: userInfoPane.html]
bjsorrentino
  • Veteran

  • 8,506 posts
  • Corona SDK

Hi @max84,

Your issue may be related to something else we're investigating, but can you post your widget code so I can see how you've set it up? Remember to surround it with "lua" code brackets for readability.

[lua] [/lua]

Thanks,

Brent



[TOPIC: post.html]
#9

max84

[GLOBAL: userInfoPane.html]
max84
  • Enthusiast

  • 37 posts
  • Corona SDK

@Brent, here's some code for you.

 

TableView creation:

self.slideList = widget.newTableView {
      width = 665,
      height = screenHeight,
      hideBackground = true,
      -- backgroundColor = {0.24, 0.16, 0.11},
      noLines = true,
      onRowRender = function(event)
          -- insert stuff here
      end,
      onRowTouch = function(event)
          -- something here
      end
}
 

    self.slideList.anchorX = 0
    self.slideList.anchorY = 0
    self.slideList.x = screenWidth
    self.slideList.y = 0

 

And here is the insert code:

-- category 'header' row
    self.slideList:insertRow
    {
        isCategory = true,
        rowHeight = 100,
        rowColor = {
            default = {0.24, 0.16, 0.11},
        }
    }
 
    -- Create all our rows
    for i = 1, #self.brands do
        -- Insert the row into the tableView
        self.slideList:insertRow
        {
            isCategory = false,
            rowHeight = 150,
            rowColor = {
              default = {0.24, 0.16, 0.11}
            },
            -- lineColor = { 0.34, 0.23, 0.16 },
        }
    end



[TOPIC: post.html]
#10

ksan

[GLOBAL: userInfoPane.html]
ksan
  • Corona Geek

  • 2,795 posts
  • Corona SDK

@ksan - I think the indent is present in almost every iOS 7 tableview (settings, contacts, messages), at least on the left.


You are right of course but the problem is the bleed through of the category colour if we are trying to do the new Apple indented line thing. In any case this behaviour should best be developer selectable.

[TOPIC: post.html]
#11

ksan

[GLOBAL: userInfoPane.html]
ksan
  • Corona Geek

  • 2,795 posts
  • Corona SDK

I want to make it clear what I'm talking about here. I used the LIstDemo2, changed the row color to a vibrant red and added lineColor. See the result in attached screen shot. The row color is bleeding through to the empty space left by the line that is not drawn for the full width of the row. I circled those with black. 

Attached Files



[TOPIC: post.html]
#12

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,328 posts
  • Corona Staff

The 15px indent should only show up for tableViews using the IOS7 widget theme.  On Android or if you specifically use the previous widget_theme_ios, you will get that line covering the whole area.

 

As for the background bleeding through, that is a bug I believe that has been filed.

 

In the mean time, if you are using a colored tableView (which on iOS 7 is kind of against the pattern), you can drop a rectangle behind the tableView that's the same color as  your rows as a work around.

 

Rob



[TOPIC: post.html]
#13

ksan

[GLOBAL: userInfoPane.html]
ksan
  • Corona Geek

  • 2,795 posts
  • Corona SDK

Thanks for the confirmation that different platform themes handle this need. That helps a lot. Also thanks for the report on bug being filed. Appreciated. 



[TOPIC: post.html]
#14

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,328 posts
  • Corona Staff

Bug #26439 for reference.

 

Have you also tried setting the backgroundColor property in the tableView constructor to match the row colors?



[TOPIC: post.html]
#15

ksan

[GLOBAL: userInfoPane.html]
ksan
  • Corona Geek

  • 2,795 posts
  • Corona SDK

Thanks for the added suggestion. Did not try backgroundColor but will do. In this app each row is one of 6 colors pointing out to a location on a color coded map so the bleed can be in one of six colors. Setting a single backgroundColor therefore may not help much but still something to try. This is not a major issue so I can wait for the reported bug to be fixed. Thanks



[TOPIC: post.html]
#16

dvboren

[GLOBAL: userInfoPane.html]
dvboren
  • Enthusiast

  • 59 posts
  • Corona SDK

#2 has been a problem for a while in TableView.  Pre - GFX2.0 as I am on build 1244 and see the same thing.  IMO, It seems that if you set noLines=true, it should have the ROW color show through rather than the TABLE background color.  If that were the case you could, as you suggest, make any kind of line that you want using , full width, indented, dotted, thick, thin, whatever.  I'm not sure how the bug is described in 26439, but that's how it seems to me it should work.



[TOPIC: post.html]
#17

guy.stockwell

[GLOBAL: userInfoPane.html]
guy.stockwell
  • Contributor

  • 100 posts
  • Corona SDK

Any information on Bug# 28269



[TOPIC: post.html]
#18

bjsorrentino

[GLOBAL: userInfoPane.html]
bjsorrentino
  • Veteran

  • 8,506 posts
  • Corona SDK

Hi @guy.stockwell,

This bug was reported as fixed by the engineers quite some time ago. Just to confirm, this case pertained to "unrelated" transitions being cancelled upon dragging around a tableView.

 

Best regards,

Brent



[TOPIC: post.html]
#19

guy.stockwell

[GLOBAL: userInfoPane.html]
guy.stockwell
  • Contributor

  • 100 posts
  • Corona SDK

I am have had this issue win two different apps with builds > 2014.2188 The solution in the first app that is now in the store "Simply Invoice" is to compile under 2188. Not a great solutions. I am now in the midst of another app for another company and am experiencing the same issue. Reverting to 2188 resolved the issue. Assistance would be appreciated.



[TOPIC: post.html]
#20

guy.stockwell

[GLOBAL: userInfoPane.html]
guy.stockwell
  • Contributor

  • 100 posts
  • Corona SDK

Worked around by adding the following to the end of loadRows()...

 

    -- added to prevent the first row from displaying in the middle of the tableview
    tableView:scrollToY( { y=0, time=100} )


[TOPIC: post.html]
#21

Fixdit

[GLOBAL: userInfoPane.html]
Fixdit
  • Enthusiast

  • 86 posts
  • Corona SDK

Hi @max84,

Your issue may be related to something else we're investigating, but can you post your widget code so I can see how you've set it up? Remember to surround it with "lua" code brackets for readability.

[lua] [/lua]

Thanks,

Brent

 

Has there been a fix found for this bug? I'm still experiencing being unable to remove a line that badly flickers between TableView rows.

 

Thanks in Advance,

 

Ash



[TOPIC: post.html]
#22

bjsorrentino

[GLOBAL: userInfoPane.html]
bjsorrentino
  • Veteran

  • 8,506 posts
  • Corona SDK

Hi Ash,

Can you describe your issue in more detail? Are you speaking about line separators for the table view? If so, are you using the built-in table view "lines", or are you creating those lines yourself within each row? What is your content area size? What is the width (thickness) of these lines? When do they flicker?

 

Thanks,

Brent



[TOPIC: post.html]
#23

Fixdit

[GLOBAL: userInfoPane.html]
Fixdit
  • Enthusiast

  • 86 posts
  • Corona SDK

I'm using the Corona's TableView.

 

1. There is a gap from the left hand edge of the device screen to where the in-built line of the TableView begins. The line is supposed to be flush to the edge.

 

2. Rendering issue on Simulators: When zoomed out the lines between tables flicker (when vertically scrolling). However if you zoom in far enough with the Simulator it stops flickering. This issue is just annoying because the amount you have to zoom in is prohibitive.

 

Thanks in Advance,



[TOPIC: post.html]
#24

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,328 posts
  • Corona Staff

Without seeing a screen shot and your creation code, it's going to be hard to address #1.

 

For #2, this is the reality of high resolution devices.  If you're screen is only 800 pixels high and you're trying to simulate a 1920 pixel high screen, you have to halve and or quarter the screen size to make it fit on your screen.  We have to throw away pixels as we resize the screen.  Going from 100% to 50% means loosing half the vertical pixels.   That means a 1 pixel divider line may or may not show up as things move on and off of even/odd numbered pixel rows.

 

Rob



[TOPIC: post.html]
#25

Fixdit

[GLOBAL: userInfoPane.html]
Fixdit
  • Enthusiast

  • 86 posts
  • Corona SDK

 
TableView creation code:
tableView = widget.newTableView
{
top = scrollview_middle.y + scrollview_middle.contentHeight*.5,
left = 0,
width = (viewableScreenW)+ox+ox,
height = viewableScreenH/3,
hideBackground = false,
listener = tableViewListener,
onRowRender = onRowRender,
onRowUpdate = onRowUpdate,
--onRowTouch = onRowTouch,
}

group:insert(tableView)

The group it's contained in has 0 'x' position and when I try moving the TableView, the line (and its gap) follows.

 

It seems to follow what people above are experiencing too.

 

Thanks,




[topic_controls]
Page 1 of 2 1 2
 
[/topic_controls]