drawing problems when using actions?

cocos2d for iPhone » Programming » cocos2d support (graphics engine)

drawing problems when using actions?

(10 posts) (2 voices)

Started 1 year ago by slycrel
Latest reply from slycrel

Tags:

slycrel
Member

Hey all.

I am continuing work on my line drawing over time program. (reference post here: http://www.cocos2d-iphone.org/forum/topic/4497#post-28965)

I am currently having some severe issues with where sprites are drawn vs. where cocos2d thinks the sprite really is. I am using a renderTexture to capture the action. I have overridden some actions that are the same as the default, but also call renderTexture's begin/end and visit on the pen sprite to do the drawing. That appears to be working as I would expect it to, queueing up multiple actions in a sequence and drawing to the render texture.

I then added a parallel action sequence to move a sprite that looks like a pencil along the same path. This sprite is offset about a third of a screen down and a third of a screen to the right of where I would expect it to be! The actions are working properly, and other than this odd offset, the sprite moves in sync with my drawing.

After a couple of hours of hurting myself on this I finally turned off my render texture drawing of the pen sprite, and just left the pen sprite "on" all the time and let it follow it's same path it's been using to draw.

The pen path is now the same as the pencil!!!

So I'm obviously missing something -- when an actions update is getting called my coordinates are transformed different somehow than regular sprite drawing? Does anyone have an idea of what could be happening here?

If it matters this is also using the iPad simulator. I'd post a screenshot as well, but I'm not sure I can in these forums.

Thanks in advance.

Posted 1 year ago #
slycrel
Member

Oh, one more thing. I am setting scaleY to -scaleY. Changing this simply flips everything, it doesn't appear to have any other effect, but I thought I'd mention it just in case.

Posted 1 year ago #
Lam
Member
Since the render texture and the pen action are assumed to be on separate layers it probably has some issue with the location of render texture. The best thing I can think of at the moment is to do coordinate conversion.

You send out your current coordinate position in your render texture to a world point. You do this because it can now be passed into your layer that handles pen movement and in the pen movement layer you convert back to the layer node space.

The two methods to look at are:
```
-(CGPoint)convertToWorldSpace:(CGPoint);
-(CGPoint)convertToNodeSpace:(CGPoint);
```
There's also a private one (not sure why it's private) called
```
-(CGPoint)convertToWindowSpace:(CGPoint);
```
I sometimes use this as well when I need to convert to the screen coordinates of the iDevices. But since we can't use that (unless we make it public) I believe all you need is the first two.
Posted 1 year ago #
slycrel
Member

Thanks for the reply Lam. I have wondered if it were coordinate issues such as that.

I'm a bit confused though, and I'm probably missing something basic. So I think what you are saying is that in my update function, I should translate the position variable to NodeSpace, do my update, then convert it back?

my concern here is that the drawing of the render texture is right where I'd like it to be, and the actual sprite position is not. So I suppose that my actual RenderTexture is in a place where I don't expect it to be and I've positioned it in the wrong spot! I'll see what I can do to verify this and post here.

Posted 1 year ago #

slycrel
Member

OK, so now I am quite confused.

Here is what my code looks like, it's fairly simple:

- (void) onEnterTransitionDidFinish
{
	CGSize sz = [[CCDirector sharedDirector] winSize];
	double width = (sz.width * 0.75);
	CCRenderTexture* tex = [CCRenderTexture renderTextureWithWidth:width height:width];

	tex.scaleY = -tex.scaleY;
	tex.contentSize = CGSizeMake(width, width);		// 75% of 768 (which is 576), making a square drawing window.
	tex.position = ccp(sz.width/2, sz.height/2);

	// do the background for the RenderTexture.
	CCSprite* backGr = [CCSprite spriteWithFile:@"drawingBackgr.png"];
	backGr.contentSize = tex.contentSize;
	[tex addChild:backGr];
	backGr.position = ccp(width/2, width/2);

	// draw the background
	[tex begin];
	[backGr visit];
	[tex end];
	[tex removeChild:backGr cleanup:YES];			// done with this, discard the background.

	CCSprite* pencil = [CCSprite spriteWithFile:@"pencil.png"];
	pencil.rotation = 140.0;
	[tex addChild:pencil];

	CCSprite* sprite = [CCSprite spriteWithFile:@"brush2.png"];
	sprite.visible = NO;
	[tex addChild:sprite];
	[sprite runAction:[CCTintTo actionWithDuration:0 red:50 green:150 blue:255]];			// color the pen

	// hacky global texture drawing and pen pointers.  Maybe should be part of the game state or something later.
	_globTex = tex;
	_globPen = sprite;

	[self addChild:tex];

	NSArray* chunks = LoadDrawingChunksFromFile(@"justLines.sketch2", nil);

	if ([chunks count] > 0)
	{
		CCSequence* moveSequence = nil;
		CCSequence* sequence = GetPenSequenceFromChunks(chunks, &moveSequence, tex);

		// add the moveTo action to move the pencil back to it's home position.
		id bezAction = [CCMoveTo actionWithDuration: 1.0 position:ccp(0,0)];
		moveSequence = [CCSequence actionOne:moveSequence two:bezAction];

		// now run the action on our renderTexture.
		[sprite runAction:sequence];
		[pencil runAction:moveSequence];
	}
}

So I'm confused, shouldn't an action honor the scope of the object it's acting on? I would have expected to have the coordinate transforms be handled for me since I am simply creating a texture, rendering a background on it, then adding a "pen" sprite and another sprite that's simply moved around. I would expect that cocos is cool enough to handle this? Inside GetPenSequenceFromChunks(), both sequences are using the same coordinates, but one is positioned correctly and one is not? Shouldn't these be the same? Bah, this is driving me nuts.

I'll play around with the positioning, but it seems odd that I should need to do so when both actions are using the same positions. Still, thanks for the suggestion.

Posted 1 year ago #

Lam
Member
I was assuming that your pen sprite was on a separate layer and not added as a child to the renderTexture. That's probably why my explanation was confusing =/

But yeah you are very correct in assuming that if pen and sprite are children of a node, they should have the same location if they are passed the same position.

Since let's say that assumption holds, otherwise the world has gone mad, it probably is another problem.

Right now you said that the pencil and the sprite move the same but I'm confused about
```
[sprite runAction:sequence];
[pencil runAction:moveSequence];
```
Are they really moving at the same time, the sequences are a bit different?

Oh and what is 'GetPenSequenceFromChunks'? It returns a sequence but also takes in a &moveSequence ... so it's returning you two sequences?

I think it's the sequence action that may have the positioning problem but right now it's not quite clear how that code functions.
Posted 1 year ago #
slycrel
Member
after some debugging, cocos2d is applying a transform based on the parent node for the pencil sprite, in this case it is the render texture. That appears to be working properly.

I have been playing around with the anchor points, but from what I understand this is the wrong way to go about this. That's the only way I've been able to "correct" the problem, but I think I'm treating the symptom rather than the real issue.

Now, in regards to the sequences. Yes, I am creating both sequences inside of GetPenSequenceFromChunks(). I am currently doing this manually. I'll post some of the relevant code here for drawing a line. Note that all my shapes are currently stored in rectangles, so that's a little funny looking in the case of a line.
```
id GetPenSequenceFromChunks(NSArray* chunks, id* outRegularSequence)
{
	if ([chunks count] <= 0)
		return nil;

	// the sequence to build, with the initial pause
	id seq = [CCMoveTo actionWithDuration: 1.0 position:ccp(0,0)];
	id regSequence = [CCMoveTo actionWithDuration: 1.0 position:ccp(0,0)];

	NSEnumerator* enumerator = [chunks reverseObjectEnumerator];
	for (DrawObject* obj in enumerator)
	{
		CGPoint origin = obj.objBounds.origin;
		CGSize size = obj.objBounds.size;

		if (obj.objType == lineToType)
		{
			// width is x, height is y for the end point of a line.
			CGPoint endPoint = ccp(origin.x + size.width, origin.y + size.height);
			seq = [CCSequence actionOne:seq two:[LineToPenAction actionWithDuration: 1.0 position:ccp(size.width, size.height)]];
			regSequence = [CCSequence actionOne:regSequence two:[CCMoveTo actionWithDuration: 1.0 position: ccp(size.width, size.height)]];
		}

		...	// More shape cases handled here

	}
	*outRegularSequence = regSequence;

	return seq;
```
Now I should probably explain the LineToPenAction. It's code is straightforward and is as follows:
```
static void VisitPen()
{
	// cheat and use globals for testing...  for now?
	// update the renderTexture.
	[_globTex begin];
	_globPen.visible = YES;
	[_globPen visit];
	_globPen.visible = NO;
	[_globTex end];
}

@interface LineToPenAction : CCMoveTo {
}

- (void) update:(ccTime)inTime;

@end

@implementation LineToPenAction

- (void) update:(ccTime)inTime
{
	[super update:inTime];	// this calls CCMoveTo's action
	VisitPen();				// visit our sprite to draw into the CCRenderTexture
}

@end
```
I'm baffled.

Also there is another way I know that these paths are exactly the same. If I do not call visitPen() in this class (and don't hide the pen before I start) then the pen dot will show up in the center of my pencil sprite, following the same coordinates. This is a huge clue, but I've got no ideas on what this might mean other than what I already know--that the coordinates are off for regular drawing vs. drawing within the begin/end (does this matter?) of the render texture.

I'm happy to send my project to anyone if they want to have a look, drop me a PM. I better go to bed and hit this again tomorrow. =)
Posted 1 year ago #
slycrel
Member
Well, a few hours later I'm still no better at this. I have a workaround to get this going, but I still think I am treating the symptom, not the problem.

As far as I can tell, the render texture I create like this:
```
CGSize sz = [[CCDirector sharedDirector] winSize];
	double width = (sz.width * 0.75);
	CCRenderTexture* tex = [CCRenderTexture renderTextureWithWidth:width height:width];
	tex.scaleY = -tex.scaleY;
	tex.contentSize = CGSizeMake(width, width);
	tex.position = ccp(sz.width/2, sz.height/2);
```
has it's 0,0 point (as far as CCMoveTo is concerned) is in the center of the texture. Since I am setting the texture's position as above, this is in the center of the screen.

For my pencil to be positioned properly, I have added a pencil offset to the passed parameters in GetPenSequenceFromChunks(). I add the following offset to ALL CCMoveTo/CCBezierTo points for my pencil action (but not for my actual pen visits):
```
CGPoint pencilOffset = ccp(pencil.contentSize.width/2 - tex.contentSize.width/2, -pencil.contentSize.height/2 - tex.contentSize.height/2);
```
Apparently because cocos2d has position 0,0 be the center of a given node that is where my problems are coming in. I still don't fully understand why I do NOT have to do this when I call visit on my sprite (it is in the correct place already) I DO have to do this on a regular sprite that simply gets moved around. Is this actually a bug that it's rendering the pen sprite with coordinates that do not have 0,0 as the center of the renderTexture? It's awfully inconvenient to have to calculate an offset like this and have to pass that around through all of my CCMoveTo/CCBezierTo functions but not do this for my pen. :/ Any insight is appreciated.
Posted 1 year ago #
slycrel
Member

I'd like to publicly thank Lam for spending some time to figure out the proper answer for this.

In this case, the key is knowing that when drawing to CCRenderTexture your anchor point is at 0,0. Any child of CCRenderTexture needs to also have it's reference point relative to the same coordinates to be able to move about using the same coordinate system. This wasn't immediately obvious and it took quite a while to figure out this was the issue.

in my case, the position of the render texture needed to change from the middle to the top left, the render texture sprite's anchor point needed to change to 0,1 and the pencil's anchor point needed to also be changed to 0,0.

Riq, would it be appropriate to put a comment about this in the .h of CCRenderTexture when describing the functionality of this class? It makes sense now knowing about it, but it wasn't straightforward to find out.

Thanks again Lam for the help!

Posted 1 year ago #

slycrel
Member

By request, this is my updated lineto action for this. This code could probably be cleaned up some and made more general purpose, but I've got a number of things I'm working on so it will have to wait unless someone wants to do it for me.

Again, you can create a CCSequence of moves and LineToPenActions to draw and move over time. I also have the code for this to do a bezier line, but itis pretty well the same code except overriding CCBezierTo.

I hope this is helpful as an example of the power of cocos2d actions.

@interface LineToPenAction : CCMoveTo {
	ccTime lastUpdateTime;
}
@property ccTime lastUpdateTime;

- (void) update:(ccTime)inTime;

@end

and

@implementation LineToPenAction
@synthesize lastUpdateTime;

- (id) init
{
	self = [super init];
	if (self != nil)
	{
		lastUpdateTime = 0;
	}
	return self;
}

- (void) drawPen
{
	CCSprite* spr = target;		// the action's target should be a "pen" sprite.
	CCRenderTexture* tex = (CCRenderTexture*)[target parent];

	[tex begin];		// the sprite's parent should be the render texture.
	spr.visible = YES;
	[spr visit];
	spr.visible = NO;
	[tex end];
}

- (ccTime) getTimeToIncrementBy:(CGPoint) firstPoint second:(CGPoint)secondPoint prevTime:(ccTime)lastTime endTime:(ccTime)curTime
{
	ccTime timeslice = (curTime - lastTime);		// current piece of time between now and the last update.
	CGFloat distance = 0;
	do
	{
		distance = ccpDistance(firstPoint, secondPoint);
		if (distance > 1)
			timeslice = timeslice * 0.5;	// decrement the time until we are < 1 pixel apart.

		// now get the distance using the new time.
		[super update:lastTime + timeslice];
		// and update our endpoint to the smaller position.
		secondPoint = ((CCSprite*)[self target]).position;
	} while (distance > 1.0);

	return timeslice;
}

- (void) update:(ccTime)inTime
{
	if ([target isKindOfClass:[CCSprite class]] && [[target parent] isKindOfClass:[CCRenderTexture class]])
	{
		CCSprite* spr = target;		// the action's target should be a "pen" sprite.

		// get the old sprite position and we saved the last time in lastUpdateTime.
		CGPoint oldPos = spr.position;

		// run the regular update to move the sprite.
		[super update:inTime];

		// get the new sprite position.
		CGPoint newPos = spr.position;

		// now we get the smallest increment that will draw one pixel difference.
		ccTime timeslice = [self getTimeToIncrementBy:oldPos second:newPos prevTime:lastUpdateTime endTime:inTime];

		// now let's draw each increment using the parent's code to get us to the correct position over time.
		ccTime timeDiff = inTime - lastUpdateTime;
		while (timeDiff > timeslice)
		{
			[super update:lastUpdateTime + timeDiff];	// move our position
			[self drawPen];								// draw the sprite
			timeDiff = timeDiff - timeslice;			// decrement our time
		}

		// finally re-move to the original position and draw the current sprite position.
		[super update:inTime];
		[self drawPen];
	}

	// remember the current time for the next update.
	lastUpdateTime = inTime;
}

@end

Posted 1 year ago #

RSS feed for this topic

Reply

You must log in to post.