Widget Positioning in G2

Remove any tableview.anchors you may have added and just use top left parameters.

Even for x & y in transition.to?

See my searchBar sample thread. I’m moving the whole tableview up when SearchBar is activated (as in IOS Mail app behavior). I found a workaround (I think…) but the transition.to is a little funny but I think that might be a topic for another bug report… 

I’m not sure about transitioning. On a mobile right now, can’t check. Maybe use delta property in transition property? Then you just specify the distance it should travel and not end location.

Ahh thats a great idea. I was using y values to move the tableview up and down. I think delta will do this much better. Thanks for the tip. Keep well. 

Yup. That did the trick!!! Thanks for the tip. While the root cause issue is not resolved I think this can be captured as a Gotcha in the API docs for tableView and we can move forward. Appreciate your help.

Confirmed the same in ScrollView sample. 

    left = 10,

    top = 10,

so what happened to the center? Confused…

Top and Left are not X and Y.

Lets say you have a 100x100 tableView.   You set Top to 10 and Left to 10.  The tableView will occupy 10-110 wide and 10-110 high.  The center of the table view will be 55, 55.  And if you print out the tableView’s .x and .y it should be 55 and 55.

Now if you set myTableView.x = display.contentCenterX the tableView should center itself horizontally.  In effect under 1.0, tableViews would have had a reference point of display.TopLeftReferencePoint, it’s now centered.  But this doesn’t impact Top and Left.

Ok. I understand the first part. The center of the table view will actually be 60, 60. Center of widget is 50+left, 50+top so it will be 60, 60. Got that one. 

Got the second part as well but I am not clear on when I would need to use this as opposed to moving the widget using its top/left. Anyways, I will study some more and try to get my head around this. Thanks for your time. 

I would say that x,y are used for positioning while top, left, width and height are used to figure out where the object’s bounds are. The x,y position of an object will be the same but the bounds can change depending on the anchor point.

Kerem, you have never been able to move a tableView after it’s created using it’s Top and Left parameters, you have always had to use it’s X and Y.  But I suspect that in 1.0 (I rarely move a tableView once it’s on screen), it had a TopLeft reference point in effect making X and Y the same as Top and Left.  With Graphics 2.0 one of our goals was to fix all the places where the API was inconsistent with regards to positioning thing and everything now has a default center reference point.  Any API where you had normally passed in an X, Y previously that was treated as Top, Left like display.newRect(), those are now by default center X, Y.

The problem with TableViews and other widgets that still kind of breaks the idea of positioning things by center is that the Key’s are the words “Top” and “Left”.  Semantically they mean “where is the Top Left corner of the object”, not “where I do I draw the object”, so for any API that uses Key-Value pairs in a table to create the object and those positioning parameters are defined as “Top” and "Left’ will be exactly what they say they are.   But once the object exists, you use .x and .y to reposition and that will be object center if you have not changed the Anchor Points.

Ok. I tested and verified that I can do away with putting top & left in the tableView definition. You need to give it an anchor anyways so I define the tableview, then give anchor of say 0,0 and then update x & y with 0, 0. Works. 

You shouldn’t have to give it an anchor, it has a default one of 0.5, 0.5 and centering by setting x = display.contentCenterX works like a charm!

Rob

Yes of course that would work but in my apps I have historically used a coordinate reference system based on 0,0 being top left of the screen and then all my specific positioning relies on tableView.y = screenTop + heightOfStatusBar etc type references. I simply can’t go to the middle of screen referencing approach. Doesn’t make sense for existing apps. Maybe for new ones going forward… Thanks anyways. Your help is most appreciated.

@ksan
I must be missing something here.
0,0 is still the top-left of the the screen in Graphics 2 as well…

Sure it is. All I was trying to say above in response to Rob’s suggestion is that my apps all use 0,0 + some value to position UI elements. Changing them over to using display.contentCenterX or display.contentCenterY +/- some values does not make sense since there is no added value for existing apps. For future apps I will try and get my head around this approach and follow it. Thanks for your help

Ok. The way I’m setting this up messes with the clickable area of the row. When I click / tap on the left half of my row nothing happens. Then when I click on the right half the click is picked and the row is painted on the right half only… See attached image. Something I’m doing is upsetting this thing.

Looks like same as this: http://forums.coronalabs.com/topic/41488-tableview-layout-bug-when-having-defined-defaults-for-anchorx-and-anchory/

Tableviews do not like to have anchor points other than 0.5, 0.5 it seems.

I’m in the process of converting a business app myself and I haven’t seen that behavior, however I don’t position my tableview with anchors or x,y.

This only positioning I do is this:

studentList = widget.newTableView { left=screen.left, top=math.round(screen.top + listTop), width=screen.width, height=screen.height - listTop, hideBackground=true, noLines=true, hideScrollBar=false, onRowRender=onRowRender, onRowTouch=onRowTouch, listener=tableViewListener };

It’s within a storyboard scene:createScene(), and it positions everything where it should be.

Bingo! I had, earlier on inserted the following at the top of my main.lua

display.setDefault( “anchorX”, 0 )

display.setDefault( “anchorY”, 0 )

This connects the dots back to your bug @jonjonsson… Getting rid of the setDefault calls brought back normal behavior. 

And you are right @ingemar… I was over thinking this. Getting rid of my 

tableView.anchorX = 0

tableView.anchorY = 0  

tableView.y = something

tableView.x = somethingelse

fixed it all. It was working with my G1 compliant code all this time actually…

Thanks much!

Yes even if you skip tableView.x and y and do same as Ingimar (with Left and Top), as long as you have that setDefault for anchors at 0,0 its not working properly.

Personally I think default anchors at 0,0 for business apps (and many games) make a lot of sense, but at the moment it will not work properly with tableviews.