Possible to 'detach' children from container?

[chris_3eleven]

I’ve created a container which fills a portion of my screen. I had hoped to add children to the container, out of its current bounds, and then move the container (using transition.to) such that its children became visible. The effect I’m wanting to achieve is like an x-ray, revealing otherwise hidden objects on the screen when the container is moved. Unfortunately I have found that container children move with the container, whether anchorChildren is set to false or not.

I’ve attached a diagram for reference, any help would be much appreciated.

[chris_3eleven]

I had the idea of updating the child object’s position using an enterFrame function to keep it’s position relative to the screen rather than the container ( childObject.y = display.actualContentHeight - myContainer.y - 100 ), but the results are not ideal, the child object jumps around a little as the group animates, this is particularly evident when the group starts moving upwards.

https://giphy.com/gifs/3o7aCQTvN9gVZOSbUQ

[anaqim]

there must be an easier way to do this than using containers.

what about layering (display group) the children below, and use a scanner object with a transparent view area, which you move up and down?

not tested but “children” should remain completely still.

sometimes i get stuck in a certain way of thinking and whatever i do, it wont work.

then next morning, i wake up with the solution, which is very often a different angling to the problem.

hope you figure this out.

anaqim

[chris_3eleven]

@anaqim

there must be an easier way to do this than using containers.

what about layering (display group) the children below, and use a scanner object with a transparent view area, which you move up and down?

not tested but “children” should remain completely still.

sometimes i get stuck in a certain way of thinking and whatever i do, it wont work.

then next morning, i wake up with the solution, which is very often a different angling to the problem.

hope you figure this out.

anaqim

Thank you for the suggestion. Unfortunately, in this instance, that wouldn’t work as I need objects displayed above the ‘scanner’, which are hidden when the scanner moves over them. The attached image serves as my inspiration for the effect I’m trying to achieve, using your proposed method, the character would be hidden by the scanner layer.

[roaminggamer]

You can put the children in a group and the group in the container.

Then when the container is moved, move the container the equal, but opposite direction.

If you are using a transition, then use the transition on a proxy and have the container and group use an enterrFrame listener to watch the transitioned proxy object’s x,y values.  Otherwise the movement will be a little out of sync.

Post back if you can’t figure this out and I may make a small demo for you/the community.

If you’re an SSK2 user, there is (IIR) a way to do this without the enterframe listener(s).  It is something I’d have to demo though.

[roaminggamer]

If you have two layers of objects (exposed versus not-exposed), this may be simpler.  

I’ll give it more thought and if time permits I’ll try out some of my ideas and share.

Apologies for the tease, but I have less and less time lately to help directly.

[roaminggamer]

Last post for now.  Have you examined the xray example that come bundled with Corona?

[chris_3eleven]

@roaminggamer

You can put the children in a group and the group in the container.

Then when the container is moved, move the container the equal, but opposite direction.

If you are using a transition, then use the transition on a proxy and have the container and group use an enterrFrame listener to watch the transitioned proxy object’s x,y values.  Otherwise the movement will be a little out of sync.

Post back if you can’t figure this out and I may make a small demo for you/the community.

If you’re an SSK2 user, there is (IIR) a way to do this without the enterframe listener(s).  It is something I’d have to demo though.

Thanks for your response. Apologies for my naivety, but what do you mean by using the transition on a proxy? Also, what is SSK2?

I did attempt to transition the group and use an enterFrame function to move the child object accordingly, but the movement was jerky.

[chris_3eleven]

@roaminggamer

Last post for now.  Have you examined the xray example that come bundled with Corona?

Yes, it is not suitable in this instance.

[splash21]

I did something similar a while ago using a container and group…

local composer = require( "composer" ) local scene = composer.newScene() local container, innerGroup local function onEnterFrame() container.y = container.y + 0.25 innerGroup.y = innerGroup.y - 0.25 end function scene:create( event ) local view = self.view container = display.newContainer( view, 100, 50 ) container.x, container.y = display.actualContentWidth \* 0.5, 0 innerGroup = display.newGroup() container:insert( innerGroup ) innerGroup.x, innerGroup.y = container:contentToLocal( display.actualContentWidth \* 0.5, display.contentHeight \* 0.5 ) local bg = display.newRect( innerGroup, 0, 0, 1000, 1000 ) bg:setFillColor( 0.3, 0, 0 ) local shape = display.newRect( innerGroup, 0, 0, 10, 200 ) shape:setFillColor( 0.1, 0.1, 0.7 ) shape.rotation = 15 end function scene:show( event ) if event.phase == "did" then Runtime:addEventListener( "enterFrame", onEnterFrame ) end end scene:addEventListener( "create", scene ) scene:addEventListener( "show", scene ) return scene

[roaminggamer]

1.  Proxy Part 1 - In the context of my first post, I meant a Lua table.  Create a table with the same x,y values as the container.  Then, call transition on the table.

Finally, have a enterFrame listener on the container that does the following:

A. Calculates dx,dy of container x,y versus proxy.

B. Adds dx,dy to container.

C. Subtracts dx,dy from group inside container.

… repeat next frame

prox·y

ˈpräksē/

noun

noun:  proxy

1.

2.

a figure that can be used to represent the value of something in a calculation.

“the use of a US wealth measure as a  proxy for  the true worldwide measure”

2. SSK 2 - Sorry I forgot to post a link.

3. Proxy Part 2 - Finally, SSK2 has a special feature called Proxy which is not to be confused with my example above.  It is a smart piece of code that… well I’d have to show you, but it does the above kind of work but in a more elegant way.

There is a example with the link to Proxy (in SSK) that may tell you all you need about this special feature.

[chris_3eleven]

@roaminggamer

1.  Proxy Part 1 - In the context of my first post, I meant a Lua table.  Create a table with the same x,y values as the container.  Then, call transition on the table.

Finally, have a enterFrame listener on the container that does the following:

A. Calculates dx,dy of container x,y versus proxy.

B. Adds dx,dy to container.

C. Subtracts dx,dy from group inside container.

… repeat next frame

prox·y

ˈpräksē/

noun

noun:  proxy

1.

2.

a figure that can be used to represent the value of something in a calculation.

“the use of a US wealth measure as a  proxy for  the true worldwide measure”

2. SSK 2 - Sorry I forgot to post a link.

3. Proxy Part 2 - Finally, SSK2 has a special feature called Proxy which is not to be confused with my example above.  It is a smart piece of code that… well I’d have to show you, but it does the above kind of work but in a more elegant way.

There is a example with the link to Proxy (in SSK) that may tell you all you need about this special feature.

Thanks, I will give this a go.

[chris_3eleven]

@roaminggamer

1.  Proxy Part 1 - In the context of my first post, I meant a Lua table.  Create a table with the same x,y values as the container.  Then, call transition on the table.

Finally, have a enterFrame listener on the container that does the following:

A. Calculates dx,dy of container x,y versus proxy.

B. Adds dx,dy to container.

C. Subtracts dx,dy from group inside container.

… repeat next frame

prox·y

ˈpräksē/

noun

noun:  proxy

1.

2.

a figure that can be used to represent the value of something in a calculation.

“the use of a US wealth measure as a  proxy for  the true worldwide measure”

2. SSK 2 - Sorry I forgot to post a link.

3. Proxy Part 2 - Finally, SSK2 has a special feature called Proxy which is not to be confused with my example above.  It is a smart piece of code that… well I’d have to show you, but it does the above kind of work but in a more elegant way.

There is a example with the link to Proxy (in SSK) that may tell you all you need about this special feature.

Hey @roaminggamer, just wanted to say thank you, the proxy thing is genius, I had no idea you could apply transitions to non display objects, it works like a charm, and I have a feeling this is going to come in handy a lot in future.

[roaminggamer]

I love both the ‘dumb or manual’ proxy (using enterframes to check it)

and 

The smart proxy (the external library included with  SSK2 written by a very smart developer, not myself).

Cheers,

Ed

[chris_3eleven]

I had the idea of updating the child object’s position using an enterFrame function to keep it’s position relative to the screen rather than the container ( childObject.y = display.actualContentHeight - myContainer.y - 100 ), but the results are not ideal, the child object jumps around a little as the group animates, this is particularly evident when the group starts moving upwards.

https://giphy.com/gifs/3o7aCQTvN9gVZOSbUQ

[anaqim]

there must be an easier way to do this than using containers.

what about layering (display group) the children below, and use a scanner object with a transparent view area, which you move up and down?

not tested but “children” should remain completely still.

sometimes i get stuck in a certain way of thinking and whatever i do, it wont work.

then next morning, i wake up with the solution, which is very often a different angling to the problem.

hope you figure this out.

anaqim

[chris_3eleven]

@anaqim

there must be an easier way to do this than using containers.

what about layering (display group) the children below, and use a scanner object with a transparent view area, which you move up and down?

not tested but “children” should remain completely still.

sometimes i get stuck in a certain way of thinking and whatever i do, it wont work.

then next morning, i wake up with the solution, which is very often a different angling to the problem.

hope you figure this out.

anaqim

Thank you for the suggestion. Unfortunately, in this instance, that wouldn’t work as I need objects displayed above the ‘scanner’, which are hidden when the scanner moves over them. The attached image serves as my inspiration for the effect I’m trying to achieve, using your proposed method, the character would be hidden by the scanner layer.

[roaminggamer]

You can put the children in a group and the group in the container.

Then when the container is moved, move the container the equal, but opposite direction.

If you are using a transition, then use the transition on a proxy and have the container and group use an enterrFrame listener to watch the transitioned proxy object’s x,y values.  Otherwise the movement will be a little out of sync.

Post back if you can’t figure this out and I may make a small demo for you/the community.

If you’re an SSK2 user, there is (IIR) a way to do this without the enterframe listener(s).  It is something I’d have to demo though.

[roaminggamer]

If you have two layers of objects (exposed versus not-exposed), this may be simpler.  

I’ll give it more thought and if time permits I’ll try out some of my ideas and share.

Apologies for the tease, but I have less and less time lately to help directly.

[roaminggamer]

Last post for now.  Have you examined the xray example that come bundled with Corona?