Quick Links: Download Gideros Studio | Gideros Documentation | Gideros Development Center | Gideros community chat
Zoom effect like in Sinister Soccer - Gideros Forum

Zoom effect like in Sinister Soccer

Okay Mr Houdini how do you do that zoom effect? B)
Can you share some code snippets? :)


@SinisterSoft

I checked your apk, there are some pictures:
zoom1.jpg, zoom2.jpg ... zoom15.jpg

I've tried very basic zoom, just don't know where to go next :)
How to make it smooth without huge 1MB+ picture? (zoom1.jpg, zoom2.jpg, etc.?)
How to enter scene smoothly when zoom finished?
bigMap=Bitmap.new(Texture.new("bigMap.jpg",true))
bigMap:setAnchorPoint(.5,.5)
bigMap:setPosition(centerX,centerY)
bigMap:setScale(.25)
stage:addChild(bigMap)
rotationAllowed=true
 
--zoom:
GTween.new(bigMap, 4, {scaleX = 1, scaleY = 1}, {delay = 0, ease = easing.linear, onComplete = function() print("zoom finished") rotationAllowed=false end})
 
--rotate:
rotationTimer = Timer.new(10,0)
rotationTimer:addEventListener(Event.TIMER, function()
	if rotationAllowed then
	bigMap:setRotation(bigMap:getRotation()+0.2)
	else rotationTimer:stop()
	end
end)
 
rotationTimer:start()

Likes: SinisterSoft

zip
zip
testZoom.zip
1M
+1 -1 (+1 / -0 ) Share on Facebook

Comments

  • SinisterSoftSinisterSoft Maintainer
    This one is even better... ;)

    The APK...

    https://play.google.com/store/apps/details?id=com.sinistersoft.retrostar

    Here is a video...



    Basically you get something like Google Earth or similar.

    You start with a point and take a screen grab, then you zoom out 2x, then you take another screen grab ando so on. To get to space should take under 20 images.

    Then get each image cut to 256x256 or 512x512 depending on how accurate you want the image - it doesn't really matter if you use 256x256 if you zoom in quickly.

    Make a sprite called 'world'. Have a variable called scaler, set it to 1. Then add all the images as children of the world sprite starting with the one in space. Set the anchor point to 0.5,0.5 for each of these. On each add just halve scaler and set the next sprite scale to that scale. Now all you need to do is scale 'world' and they will all scale in perfectly.

    You can do other things like turn off/on the sprites as the scale changes for low-end devices.

    Easy. :)

    Likes: antix, Apollo14

    +1 -1 (+2 / -0 ) Share on Facebook
  • Wow! I managed to make it work! :D
    THX @SinisterSoft ! :)
    The effect is cool! :smiley:
    (i've attached project with pics)
    local world=Sprite.new()
    world:setPosition(centerX,centerY)
    stage:addChild(world)
     
    local scaler=1
    local zoomArr={}
     
    for i=1,10 do
    	zoomArr[i]=Bitmap.new(Texture.new("zoom"..i..".jpg",true))
    	zoomArr[i]:setAnchorPoint(.5,.5)
    	zoomArr[i]:setScale(scaler)
    	world:addChild(zoomArr[i])
    	scaler/=2
    end
     
    --zoom world:
    GTween.new(world, 6, {scaleX = 1000, scaleY = 1000}, {delay = 0, ease = easing.inCircular, onComplete = function() print("zoom finished") rotationAllowed=false end})
     
    --rotate world:
    rotationAllowed=true
    rotationTimer = Timer.new(10,0)
    rotationTimer:addEventListener(Event.TIMER, function()
    	if rotationAllowed then
    	world:setRotation(world:getRotation()+0.2)
    		if world:getRotation()>=70 then rotationAllowed=false end
    	else rotationTimer:stop() print(world:getRotation())
    	end
    end)
     
    rotationTimer:start()
    zip
    zip
    testZoom.zip
    1M
    +1 -1 (+2 / -0 ) Share on Facebook
Sign In or Register to comment.