I am in the process of learning Cocos2d and this is a great thread. I have one question. If you do a repeat forever for the background, how can you stop if from moving when the character stop walking and then start it up again when he starts walking again?

@Lam
Thanks very much for the response and the help.

I played around with your suggestion and think it is working. In your sample code, I altered the init/actions area to be:

// run an action for TTexture @see TTexture.h for info
CCAction *action_1 = [CCRepeat actionWithAction:[CCTextureMoveBy actionWithDuration:2.0f position:ccp(ttexture_.contentSize.height-1,0)] times:1];

CCAction *action_2 = [CCTextureMoveTo actionWithDuration:0.f position:CGPointZero];

CCAction *action = [CCRepeatForever actionWithAction:[CCSequence actions:action_1,action_2,nil]];

action.tag = kTextureAction;

[ttexture_ runAction:action];

I am not sure if it is there is a more efficient solution, but it looks good to me. I let the sucker run for about 5 minutes and don't see any pixelating like before. :)

Thanks!!

@finklebottom
I've checked the issue and yeah that does seem to happen for larger values when we repeat.

Since we're using a moveby we can see that the position of the texture will probably be extremely large and those large operations tend to pixelate the texture.

How you can combat this is to reset the actual texture position to the origin position after some number of repeats. For every cycle of the texture (0.f.. 1.f) we'll really repeat the same texture from the beginning so we can use TextureMoveTo to reset the position or just manually reset to a CGPointZero.

@Lam
First off thank you very much for the help. To your code I added the CCRepeatForever:
CCAction *action = [CCRepeatForever actionWithAction:[CCTextureMoveBy actionWithDuration:20.f position:ccp(10,0)]];

And I commented out the ccTouchesBegan.

When I run the code on my iPod and leave it for 2 or 3 minutes the image gets distorted/pixelated and it gets worst and worst over time.

Does this happen for you?

Thanks again for the help!

First this is my apologies to all whom my last question caused any inconvenience!

Now @jd
If I stuck at some point... I'll try to do things in other ways... and once got the expected result I'll move for next. If result is unexpected after few trials even then I'll prefer to move towards rest of the things need to be done to maintain the process. But all time I'll be keen to know how those things can be done in smarter ways... not just for getting the result by hook or by crook. Any way this my way of occupation concern. And I'm sure every programmer has his/her own way of occupations concern. Also I never heard such definitions for a programmer and developer!

Thus far I've been part of this blog, for 3 times for asking any help. First 4 months ago, 2 days back and last on yesterday. My first time asked questions was not been answered and so I moved to other blogs where several times I asked almost same questions. A few people have tried to helped me out in the ways I've already tried and not been satisfied by the result. So I moved back to this blog and once agin asked the question. So the ANNOYED was not for you people or others (from other blogs) but for SITUATION I was facing. Thats it.

@abitofcode
Thanks for help. I'm sure this will work fro me in some way.... thanks

@Lam
I'm really sorry for all from my side that cause any inconvenience to you people. You and riq are the lives of this blog. I really don't meant that for you people. I'm just sharing my experience for other blogs and the situation I was struggling with.

And lastly I withdraw with my questions asked 1 day back.

@Shafijami
I'm sorry that I've annoyed you. I did not intend any harm, it was probably me misunderstanding your question =/

I feel as though I still don't quite understand what you are still asking, so I'm not too comfortable in responding again.

If you are having so many problems it may be that you can't actually easily use actions but may have to implement your own routine in a scheduled method. With some math, you can specify scale and position directly.

Scrolling's a bit of an open ended question, there are numerous ways of achieving the result you want. I find planning the effect I want on paper in some detail and then setting out to achieve that effect is far more productive than picking up various code snippets.

Some questions I'd be asking before I got near any code;
1. Are you simply scrolling top to bottom or are you trying to simulate a vanishing point
2. Can everything appear in one atlasSpriteManager or are you going to want particle effects to appear underneath your objects? (better planned out at the beginning than having to incorporate mid way through)
3. Will the Z of the sprite change over time i.e if you are in some sort of perspective mode you may have some sprites going faster than others in whhich case you will need to manage the depth of each sprite.
4. If using a perspective effect, how big are the Sprites when they come on the screen at the bottom, how big will they be when the go off the top, is the initial size going to limit the number of sprites you can move slowly.
5. Are you repeating the background or will you be changing it at intervals

This post may help with the scaling part http://www.cocos2d-iphone.org/forum/topic/1813#post-11343

Sorry for the vague reply but the question is a bit generic.

Are you a programmer like your occupation mentions? Maybe there is a difference between programmer and a developer. A developer would not be stuck for 2 weeks waiting for the code solution to be given to them. A developer would write code to address the issue and then maybe if they had trouble with one part they would post that code for help.

It's very rude to tell people that are attempting to help you that you are ANNOYED just because they aren't giving you the exact answer you are looking for.

For me its really not expecting for Cocos2D that it doesn't have any example on continuous scrolling a few sprites (say: from top to bottom). There are examples on sprites, sprite managers, textures, tile maps etc. which demonstrate scaling and scrolling of stuffs. But I'm unable to find any example which can show continuous scrolling few sprites one by one and scaling them accordingly.

For help I would request here to provide me with some code snippet which can demonstrate: how to scroll two sprites one behind another and scale them properly. Spawn helps us combining several action, moveby, moveto, scaleby etc. but if there are more than one sprites coming from top to bottom (like the moving road in the above question), then how to update their speeds, scale factor etc.

For example: we have
A:-
sprite1 and sprite2 each of height 40
sprite1 pos is (240, 80)
sprite2 pos is (240, 60) --(is just behind sprite1)
sprite1 y scale is set to 0.30 (size changed)
sprite2 y scale is set to 0.20 (size changed)

both sprites start moving from top to bottom
a scheduler function "update" (provided in spawn method) is invoked. (my own way, if there is a better way help me out plz)

B:-
in update function we got the changes like:
sprite1 pos is (240, 100)
sprite2 pos is (240, 80)

Now i changed the y scale of sprite1 to 0.35 (sprite1 size changed, it stretched a few pixel bottom as well top)
NOW HERE I'M UNABLE TO DETERMINE THE REQUIRED SCALE FACTOR for sprite2 so that it can be positioned just behind the sprite1 and also can have some change in y towards bottom.

Well, sprite was moving with certain speed say: 10 pixels in 1 sec
I want to change it to 15 pixels in 1 sec.
-------------------------------

I'm sorry for asking like this... a layman style. I've asked few times the same questions... people here suggested to use GL_REPEAT or repeatForEver, sclaeBy etc. like that with Spawn. So I just get annoyed. There are a few posts about continuous scrolling of sprites but nothing for scale and speed controls and of course sprite moving behind another.
So I'm not going to scroll clouds (right to left or vice versa) where we may not have to maintain scale factors. I need to move few sprites from top to bottom where changes in the positions of each sprite directly associated with changes in scales.

Please reply with a few code snippet. I've stuck at this point for last few weeks.

Thanks

@Shafijami

Can we use scaleBy and MoveTo to work simultaneously instead of the fashion like: finishing one action then starting next?

A CCSpawn will allow you to run simultaneous actions together so yeah you can run scaleBy and MoveTo.

If you're talking about the actions for the Transform Texture then they should work as well so TextureScaleBy and TextureMoveBy is very similar to ScaleBy and MoveBy but read the header comments which explains all that.

Also is there any callback function where I can watch and control current position & speed for each moving sprite?

I'm not sure what that means but you can have finer control over the Transformable Texture by accessing the transform texture struct directly. This does mean that you won't be using the actions I created.

Actually I've to clone the moving road (background) of this game

Oh I see. Well that game brings up an idea. Since the road is stretched to simulate a 3D perspective, you can get the same effect, I believe, by taking advantage of texture mapping. Rather than map onto a quad why not try a trapezoid?

@Lam... I've tried out your code snippet (POSTED 7 MONTHS AGO #) and it works fine for me. This is what I've asked here (few months back) plus how to scale moving sprite simultaneously. So that sprites sizes become bigger & bigger while they come closer & closer.

Can we use scaleBy and MoveTo to work simultaneously instead of the fashion like: finishing one action then starting next?
Also is there any callback function where I can watch and control current position & speed for each moving sprite?

Actually I've to clone the moving road (background) of this game: http://www.mindjolt.com/games/crazy-cabbie

Any code snippet please! I'm avidly waiting of your reply.
_Thanks

Yeah but remember that there is an upper limit depending on the device. It's either 1024 or 2048.

Other than that, all you need to remember is to keep the texture a power of 2 (2,4,8,16,32,...,256,512,1024).

@Lam,

Is it possible to use texture which is more than 512 pixels ? For example I have repetitive texture which is 1024 pixels.w

@Lam

Thank you for your answer, it pointed me to CCRepeatForever and use it with CCTextureMoveBy. I guess i need to study a little more about coco2d. :)

This did the trick, and provides an endless vertical scrolling sprite/background:

CCAction *action = [CCRepeatForever actionWithAction:[CCTextureMoveBy actionWithDuration:20.f position:ccp(0,-10)]];

@hugocosta
Yeah you can add a forever action to scroll forever. They're set up so that all actions in cocos2d work so you can repeat them, sequence them, spawn them and ease them. They work like standard MoveBy, RotateBy, etc, actions.

Sometimes you don't want to just scroll forever and have more detailed control by accessing the textureTransform property. For example the background may scroll depending on the movement of the player.

Hmm... I guess the demo doesn't explain all the things I can do with texture transformations. Maybe i'll make a post about it sometime this week to give a little more insight into the CCTransformTexture class.

By your question i probably misunderstood how your code works .
In your demo the scrolling, rotate and scale do not repeat forever. Is this as it is supposed to work?
I need to scroll a background "forever", can i do that?

I've tried it both on the simulator and iphone.

@hugocosta
That is really strange. Do you mean it actually stops at a certain amount even though you specify more? What can I do to replicate the problem?

@Lam Excelente job!

After testing it the background only loops for x amount of times. Even on your last code. Is this normal?

I'm using coco2d 0.99.0 Final and Xcode 3.1.2

LAM!!!

Thank you so much for that!!

Just wondering, though. Is there a way to get two images in there and scroll one after the other?

I'm going to poke around to see what I can figure out, but I thought I would ask to see if you have a good way of doing this.

Thank you so much for sharing that! It's exactly what I needed and it works really well!

@Lam
Thank you!!! Works fine!

@riq
Such an easy way for endless background scrolling should be included in the next cocos version ;-)
i know in the texture2d demo is an approach for repetitive textures, but i like Lam's code...it's so simple to use

I'm on it!

I've now fixed up the class for cocos 0.99.0-rc and made some changes to it's name. The demo will sort out all your issues I hope.

Transform Texture Demo

@Lam
An update would be necessary for cocos 0.99.0-rc ;-)

@Lam & riq
Thanks for the support! both of you helped me a lot!

@blablablu: also check the tests/Texture2dTest.m that comes with cocos2d.
It shows how to use repetitive textures.

@blablablu
Ok I've recreated it for 0.9 but I also improved it a bit. Some things are changed but the example shows its usage.

http://www.mediafire.com/?xjnnwznxw21

@blablablu
Oh hmm... i guess yeah I could do that. Didn't know if anyone was really using it

@Lam
Will you customize your code for cocos 0.9.x?

There are some warnings and the scrolling doesn't work any more.

Thanks

Thanks for this valuable support. I need help regarding few things.
How could we scroll images repeatedly in such a way that it looks like being closer when an image comes to the bottom of the screen while another one which is at the top of the screen looks farther. For example if we need a road looks moving towards us continuously. The big problem is I'm facing problem in scaling and positioning the images of road.

Also how could we trap the position of each image added to the SpriteManager. I want to control the scrolling object with its position and its speed (scale factor and position).

The thing is that I want to run a car on the road ( with its separator sign). So I want to move the road while the car will remain in the same position (in the middle of the screen).

Thanks

That's what I've been doing. The last column of pixels on an image is the same as the first column of the next image. An image is placed every 479 pixels.

Another way to implement this would be rewriting the TextureNode class a bit with of calls to transform the Texture itself.

I wrote a class that will scroll backgrounds using cocos2d actions so it may be more easier to setup quickly. It actually rotates and scales images inside the sprite as well!. You can use it without needing to credit me but I hope it makes scrolling backgrounds and other funky texture transforms easier.

What you do is set the texture you want to GL_REPEAT in the tex params. Then you call some actions like:

// Create a TTextureNode which is an extension of TextureNode (pretty much like a sprite)
TTextureNode *node = [TTextureNode node];

// add a texture image it's nicer if it's a square sized image that's a power of 2.
node.texture = [[TextureMgr sharedTextureMgr]addImage:@"RepeatingClouds.png"];

// Smooth texturing with GL_LINEAR if you scroll, and GL_REPEAT continously repeats image
ccTexParams texParams = { GL_LINEAR, GL_LINEAR, GL_REPEAT, GL_REPEAT };
[node.texture setTexParameters:&texParams];

// run a scroll action, if you notice that the position moved by is (1.f,0.0f). That is because a texture positioning is always normalized to [0.0..1.0] so moving 1.f is moving through an entire texture image.

// This moves the texture inside the node leftwards to the end in 1 minute but then repeats forever
[node runAction:[RepeatForever actionWithAction:[TextureMoveBy actionWithDuration:60.f position:ccp(1.f,0.f)]]];

// OR

// This moves the texture inside the node leftwards 'looping 5 times' in a minute
[node runAction:[TextureMoveBy actionWithDuration:60.f position:ccp(5.f,0.f)];

I placed the code @ this section if anyone is interested in checking it out.

http://code.google.com/p/cocos2d-iphone/issues/detail?id=543&colspec=ID%20Type%20Status%20Priority%20Milestone%20Component%20Owner%20Summary

The TTextureNodeTest hopefully will explain and make everything clear. The main class is called TTextureNode.