Corona SDK dynamic width objects

Question

I'm trying to implement a game mechanics of "Hooking" objects... Here's picture of what i'm talking about:

But I have a problem with the chain/string of the hook.

I've tried create it step by step when the hook is on the fly, using timer and enterFrame events, but they both generate huge gaps between chain segments.

I've tried creating big image of whole chain and changing width dynamicly, but it only stretches and looking funny :D

Maybe anyone faced the same problem?

Answer 1

I would suggest you to try following.

1. Create whole chain
2. place it inside container (display.newContainer)
3. change width of container.

Container automatically generates masks so instead of stretching you will have just part of your chain hidden under mask.

here is link to container docs http://docs.coronalabs.com/daily/guide/graphics/container.html

Answer 2

This is not a complete answer - I have given you a bit of a broad answer to a broad question but I hope it can help you in creating what you need.

I created a very similar mechanic recently -

I used enterFrame to call a function, lets call it BuildHook, this would check the position of the hook and the position of the starting point and then calculate how many pieces of images would be needed to fill out the space. The graphic I had as my "hook" was partially larger then the chain pieces allowing for it to overlap and only put a new image once enough space between the last piece and hook was created.

This ment that it was the hook moving forward and backwards and then having a static "chain" between it and the starting point. Either consuming "links" as would move backwards ontop of them or created "links" as it moved away from them.

Keep in mind this is pseudo code but should give you an idea how to make it.

local arrayOfPieces = {}

local function BuildHook()
   -- Bunch of variables you need to get
   startX,startY,
   hookX,hookY,
   lastPieceX,lastPieceY,
   singlePieceWidth

   -- The hook pseudo code
   if(hookX - lastPieceX >= singlePieceWidth) then
      local newPiece = display.newImage('singlePiece.png');
      newPiece.x = lastPieceX + singlePieceWidth/2
      newPiece.y = lastPieceY
      table.insert(arrayOfPieces,newPiece)
   end

   if(hookX < lastPieceX) then
       lastPieceArrayPos = table.getn(arrayOfPieces)
       table.remove(arrayOfPieces,lastPieceArrayPos)
       lastPiece = arrayOfPieces[lastPieceArrayPos - 1]
   end

end