Quick Links: Download Gideros Studio | Gideros Documentation | Gideros Development Center | Gideros community chat | DONATE
Sprite rotation around anchor point? — Gideros Forum

Sprite rotation around anchor point?

CarolineCaroline Guru
edited December 2011 in General questions
I'm looking at the Hierarchy Example, and wondered how it is possible to rotate group2 around a specified anchor point.

I found that a bitmap has setAnchorPoint (not in docs though), but is it possible to apply this to a Sprite? I can do group2:setRotation(45), but I can't change the anchor point for that.

Edit: I just found this thread, and realise that you won't be doing it for sprites :)
http://www.giderosmobile.com/forum/discussion/85

Likes: shu, jdbc, seppsepp

+1 -1 (+3 / -0 )Share on Facebook

Comments

  • CarolineCaroline Guru
    edited December 2011
    I just realised that the setAnchorPoint for a bitmap does not work how I thought it did.

    What I would like is to set a pivot point, and then set the rotation in degrees, so that the bitmap/sprite rotates around that point.

    Edit: I think what might be happening is a problem that I had with this in Objective C, where the Affine Transformations come into play.
    I fixed it with this code:
    http://stackoverflow.com/a/5666430/359578

    but can't work out how to do that in Lua.

    (CGAffineTransform slays me)
  • atilimatilim Maintainer
    Hi Caroline,

    For example assume that you have a sprite
    local sprite = Sprite.new()
    -- create your whole hierarchy here
    and then you want to rotate it from center point.

    1. You need to put this sprite to a parent sprite:
    local parent = Sprite.new()
    parent:addChild(sprite)
    2. Center it
    sprite:setPosition(-sprite:getWidth() / 2, -sprite:getHeight() / 2)
    3. And finally, rotate the parent sprite
    parent:setRotation(30)
  • CarolineCaroline Guru
    edited December 2011
    Yes, thanks, I can do that - but say I have a png of a head, I want to be able to do

    parent:setRotation(45)
    or
    parent:setRotation(-45)

    and have the pivot point at the neck point, rather than the center of the head.

    I would do that with a child bitmap, I guess, which is what I'm experimenting with now.
  • CarolineCaroline Guru
    edited December 2011
    Actually after 3 hours of scratching head and a half hour break and subsequent reverting to original code, it does seem to be working now.

    I created a pivot texture to indicate where the point of rotation is, which made it a bit clearer:
    local function positionPivot(pivot, bitmap)
    	local anchorX, anchorY = bitmap:getAnchorPoint()
    	local width = pivot:getWidth()
    	local height = pivot:getHeight()
    	local newX = anchorX - (width/2)
    	local newY = anchorY - (height/2)
    	pivot:setPosition(newX, newY)
    end
     
    function classNode:init()
    	local bitmap = Bitmap.new(Texture.new("head.png"))
    	bitmap:setX(140)
    	bitmap:setY(260)
    	bitmap:setAnchorPoint(0.5,0.9)
    	bitmap:setRotation(45)
    	self:addChild(bitmap)
            --setup a pivot texture to indicate pivot point
    	local pivot = Bitmap.new(Texture.new("pivot.png"))
    	bitmap:addChild(pivot)
    	positionPivot(pivot, bitmap)
    end
    Edit: I couldn't work out how to get my code tag looking as neat as yours
  • atilimatilim Maintainer
    edited December 2011
    You can place you code between

    <pre lang="lua">
    -- my lua code
    </pre>

    There is one thing about your code, bitmap:setAnchorPoint works with ratios (usually between 0 and 1). Therefore it seems there is no need to get and use anchor point at function positionPivot.
  • Right, pre, thanks :).

    That getting the anchor point was only to get a pivot png to show at the head png's pivot point, to indicate to me that it is really rotating where it should. A debugging thing, I guess.

    Likes: Abiz

    +1 -1 (+1 / -0 )Share on Facebook
Sign In or Register to comment.