Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

iOS

How to make Scrolling background. Objective-C

How would I make my background move right to left on a loop. Like the parallax scrolling but not in spriteKit. I want it to be like this background in the game" http://www.youtube.com/watch?v=RkGUk40LkrQ ". I need it to look like the flappy bird background.I am not using spriteKit or swift.

Thank you so much!!

6 Answers

There are probably a few ways you can achieve this.

The first way that comes to mind is using the animateWithDuration:animation:completion method of UIView. I'd imagine it would look something like this: (simply look up the equivalent code for Swift if you using Swift instead of Objective-C)

//Preparation
-(void)prepareToAnimate{


CGRect startingPosition = CGRectMake(0,0,2xSreenWidth,ScreenHeight); 
//You will need to define a variable for your screenWidth and screenHeight

UIImage *image = [UIImage imageNamed:@""]; 
//Add your image name here. It should be a double image (i.e. the whole image that fits on an iphone screen next to a duplicate of itself so that it is twice the width)

UIImageView *imageView = [[UIView alloc] initWithImage:image];

[self addSubView:imageView];
[self beginTheAnimation];

}




//Animation
-(void)beginTheAnimationWithImageView:(UIImageView *)imageView andStartingLocation:(CGRect)startingLocation{


imageView.frame = startingLocation; //Always resets the image to original location 

[UIView animateWithDuration:1.0 animations:^{
      //Alter the 1.0s duration to what you want it
      imageView.frame = CGRectMake(0,screenWidth,2xscreenWidth,ScreenHeight);
}completion:^(BOOL finished) {
        if (finished){
             [self beginTheAnimationWithImageView:imageView andStartingLocation:startingLocation];
        }
}];

}

Create a counter if you want the looping to stop at some point or create some sort of break to stop it.

Do I define the variable as an int in the .h file? int SreenWidth; int ScreenHeight;

You can define it either in the .h or .m file depending on whether you are going to use it again. I usually follow the rule of if the variable is private, keep it private and declare it in the .m file.

For example, you could just create a property as thus:

@property (nonatomic) int screenHeight

and right below you create

-(int)screenHeight{ return self.view.frame.size.height; }

Do the same with width.

I just want to thank you so much for helping me. Ive been trying to google search this and nothing shows up. Im pretty new to ios. I have this so far but there are erros. some erros say "No visible @interface for UIView" and "invalid Suffix xScreenWidth"

There are erros for the int, am I putting it in the wrong place?

import "Game.h"

import <AVFoundation/AVFoundation.h>

@interface Game ()

{

AVAudioPlayer *_soundEffect;

}

@property (nonatomic) int screenHeight;

-(int)screenHeight{ return self.view.frame.size.height; }

@property (nonatomic) int screenWidth;

-(int)screenWidth{ return self.view.frame.size.width; }

@end

@implementation Game

-(void)prepareToAnimate{

CGRect startingPosition = CGRectMake(0,0,2xSreenWidth,ScreenHeight);
//You will need to define a variable for your screenWidth and screenHeight

UIImage *image = [UIImage imageNamed:@"bgtest2.png"];
//Add your image name here. It should be a double image (i.e. the whole image that fits on an iphone screen next to a duplicate of itself so that it is twice the width)

UIImageView *imageView = [[UIView alloc] initWithImage:image];

[self addSubView:imageView];
[self beginTheAnimation];

}

//Animation -(void)beginTheAnimationWithImageView:(UIImageView *)imageView andStartingLocation:(CGRect)startingLocation{

imageView.frame = startingLocation; //Always resets the image to original location

[UIView animateWithDuration:1.0 animations:^{
    //Alter the 1.0s duration to what you want it
    imageView.frame = CGRectMake(0,screenWidth,2xscreenWidth,ScreenHeight);
}completion:^(BOOL finished) {
    if (finished){
        [self beginTheAnimationWithImageView:imageView andStartingLocation:startingLocation];
    }
}];

}

would I put

@property (nonatomic) int screenHeight;

-(int)screenHeight{ return self.view.frame.size.height; }

@property (nonatomic) int screenWidth;

-(int)screenWidth{ return self.view.frame.size.width; }

under the @interface??

You would want it as such:

@interface Game ()

@property (nonatomic) int screenHeight;

@property (nonatomic) int screenHeight;
@end



@implementation Game
-(int)screenHeight{ 
return self.view.frame.size.height;
 }

-(int)screenWidth{ 
return self.view.frame.size.width;
}




.
.
.
.





@end