[Resolved] Scaling a group makes it disappear

ferdiwillemse · July 21, 2012, 2:43am

I’ve got a group holding my screen elements. As a transition from one page (group) to the other, I use different transition effects.

For this particular effect, I’m transitioning to the next page using a zoom-out-function, like this:

transitionNewScreen = function( group )  
 group:setReferencePoint( display.CenterReferencePoint )  
 group:scale( 2, 2 )  
 group.alpha = 0  
 transition.to( group, { time = t, xScale = 1, yScale = 1, alpha = 1, transition = ease } )  
end

However, as soon as I set a scale ANY OTHER than 1, the group won’t appear at all. It’s not in the transition because when I leave that part out (and set group.alpha to 1), it won’t show up either.

The group contains two objects:

\_class table: 080268B8  
\_proxy userdata: 08122390

_class holds:

removeEventListener function: 027FF2940  
initProxy function: 02721768  
addEventListener function: 07FF18C0  
\_\_index table: 0802EC28

What’s happening here? Any ideas? [import]uid: 86582 topic_id: 28869 reply_id: 328869[/import]

ferdiwillemse · July 21, 2012, 3:07am

By the way, when I try the code on a very simple group, it will work. Could it be that the group has too many objects in it? I can’t imagine since there are only about 10 in there with nothing special that’s going on. [import]uid: 86582 topic_id: 28869 reply_id: 116297[/import]

peach_pellen · July 21, 2012, 3:48am

That should make the group disappear then fade in; are you saying it doesn’t fade in at all? If so, more code/plug and play would be very useful here. [import]uid: 52491 topic_id: 28869 reply_id: 116304[/import]

ignis075 · July 21, 2012, 9:59am

Hi there,
A few other questions which might help resolve this issue…

When you say that you set a “scale other than 1”, is that in Line 3 where you say group:scale()? Or are you referring to where you set “xScale” and “yScale” in the transition?
Rememeber that there’s a slight difference between object:scale() and object.xScale/object.yScale. The former is a relative multiplication of the current scale on that object (or group). The latter are direct value settings for the scale value. This might be causing some small issue in your scenario.
The issue might be the reference point. Groups have a reference point of top-left (default), versus objects which default to center reference point. My point is, sometimes when scaling a GROUP, you must actually “adjust” the X and Y values of that group during the transition to make it scale around the center point. I know that seems odd, but that’s my past experience when scaling groups.
It’s certainly not an issue of the number of objects in your group. I’ve scaled (in transition) groups with dozens and dozens of objects and it’s no problem. So that’s not a concern in this case!
I assume you define the variable “ease” somewhere else? As in, you set “ease” as a local variable (transition parameter) somewhere above so you don’t need to type out the full transition parameter every time? That’s perfectly valid, I just want to check that you’ve defined it somewhere.

Anyway, my suspicion is that this is definitely an issue with the use of “:scale” versus “xScale”/“yScale”, and also the reference point of the group. If you can please post some more code, that should help narrow it down.

Sincerely,
Brent Sorrentino

[import]uid: 9747 topic_id: 28869 reply_id: 116337[/import]

ferdiwillemse · July 22, 2012, 1:12am

@Peach
Yes, you are correct. The way it is supposed to be is like this:

The new group (screen) is created on top of the old group (screen), starting with an alpha of 0 and a scale of 2.
It should then fade in to scale 1 with alpha 1. The old group is then removed.

@Brent
Thank you so much for your help. You were absolutely correct about point 3 in your reply. I removed the setReferencePoint function and created an initial offset for the group and a final offset for the end of the transition. All works well now!

Here is the updated code:

transitionNewScreen = function( group )  
 group.x, group.y = 0 - display.contentWidth / 2, 0 - display.contentHeight / 2  
 group.xScale, group.yScale = 2, 2  
 group.alpha = 0  
 transition.to( group, { time = t, x = 0, y = 0, xScale = 1, yScale = 1, alpha = 1, transition = ease } )  
end

On a small side note, the custom “ease”-variable is set through parameters, so it’s not a typo

Thanks again for all your help and time everybody!

Ferdi [import]uid: 86582 topic_id: 28869 reply_id: 116389[/import]

ferdiwillemse · July 22, 2012, 1:45am

One last question though, I’m also adding a rotation in the transition. But without the reference point set to center, it will rotate around the top-left corner. Adding the setReferencePoint() function back in makes the group disappear once again. It doesn’t matter what I set the referencePoint to, it just disappears.

Edit:
I fixed it with setting the referencePoint manually using xReference, yReference. I didn’t know these two parameters existed, but they do their job. Is setReferencePoint() therefore bugged?

Here is the final code:

transitionNewScreen = function( group ) group.xReference, group.yReference = display.contentWidth / 2, display.contentHeight / 2 group.x, group.y = 0, 0 group.xScale, group.yScale = 2, 2 group.alpha = 0 group.rotation = -180 transition.to( group, { time = t, xScale = 1, yScale = 1, rotation = 0, alpha = 1, transition = ease } ) end [import]uid: 86582 topic_id: 28869 reply_id: 116390[/import]

peach_pellen · July 22, 2012, 11:33am

These are actually a little different-

setReferencePoint: By design, an object’s reference point is statically positioned relative to the object’s local origin. This means that if you explicitly set an object’s reference point using setReferencePoint() and then later modify the height or width of the object, the reference point may no longer refer to the same point.
http://developer.coronalabs.com/reference/index/objectsetreferencepoint

xReference:
It is relative to another point in the object, not to its parent. Conceptually, the reference point is the location about which scaling and rotations occur. Sometimes this is referred to as the registration point. For most display objects, this value defaults to 0, meaning the x-position of the origin and the reference point are the same.
http://developer.coronalabs.com/content/objectxreference [import]uid: 52491 topic_id: 28869 reply_id: 116414[/import]