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!

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

Posted by Thomas Oliver Bastable
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points

Converting 'Bearded' for iOS 7?

Hi Guys,

Trying to get 'Bearded' to work on iOS 7, it doesn't work badly on a 3.5", but on a 4" display its all stretched and distorted. I don't suppose anyone has any ideas?

Bearded is the tutorial here: http://blog.teamtreehouse.com/creating-a-iphone-app-bearded-part2

5 Answers

Nathan F.
Nathan F.
30,773 Points
Nathan F.
Nathan F.
30,773 Points

Hm, I haven't mucked around with this app yet, but the obvious question is--did you add the code at the bottom for handling the iPhone 5 screen? I'm not sure exactly how iOS 7 would change things (well, I might have some idea), but even if so, I'm not sure if we can talk about it here yet. Has the iOS 7 NDA been lifted?

Thomas Oliver Bastable
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points

Hi Nathan, thanks for replying! Sure have, and it loads the 568@2x wallpaper fine - and it can even output an undistorted image, however the image that you import needs to be the exact 1136x640 resolution, anything over or under and the beard warps. I believe the code that needs tweaking is this:

- (UIImage *) blendImages {
UIImage *photoImage = self.photoView.image ;
UIImage *beardImage = self.beardView.image;

// Get the size of the photo
CGSize photoSize = CGSizeMake(photoImage.size.width, photoImage.size.height);

// Create a bitmap graphics context of the photoSize
UIGraphicsBeginImageContext( photoSize );

// Draw the photo in the specified rectangle area
[photoImage drawInRect:CGRectMake(0,0,photoSize.width,photoSize.height)];

CGPoint origin = self.beardView.frame.origin;
CGSize size = self.beardView.frame.size;

CGFloat xScale = photoImage.size.width / self.view.bounds.size.width;
CGFloat yScale = photoImage.size.height / (self.view.bounds.size.height-44);

// Draw the beard in the specified rectangle area
[beardImage drawInRect:CGRectMake((origin.x * xScale), (origin.y * yScale),
                                   size.width * xScale, size.height * yScale)
              blendMode:kCGBlendModeNormal alpha:1.0];


// Save the generated image to an image object
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return newImage;

}

Thomas Oliver Bastable
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points
Thomas Oliver Bastable
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points

I'm just going to try adding a crop method in...that might solve it?

Nathan F.
Nathan F.
30,773 Points
Nathan F.
Nathan F.
30,773 Points

I'm playing with it now as well. I'll let everyone know if I figure something out. Go ahead and report back when you can, Thomas!

Thomas Oliver Bastable
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points
Thomas Oliver Bastable
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points

No luck here unfortunately, I was able to implement a custom Crop method but it was causing far too much user input for something that worked fine in iOS6...

Thomas Oliver Bastable
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points
Thomas Oliver Bastable
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Oliver Bastable
iOS Development Techdegree Graduate 20,164 Points

Getting some slightly better results now I'm playing around with different scales - if anyone has any input that would be awesome :) 

- (UIImage *) blendImages {
UIImage *photoImage = self.photoView.image ;
UIImage *beardImage = self.beardView.image;
UIImage *hairImage = self.hairView.image;

CGSize photoSize = CGSizeMake(photoImage.size.width, photoImage.size.height);

CGRect screenBounds = [[UIScreen mainScreen] bounds];
CGFloat screenScale = [[UIScreen mainScreen] scale];

CGSize screenSize = CGSizeMake(screenBounds.size.width * screenScale, screenBounds.size.height * screenScale);

UIGraphicsBeginImageContext( photoSize );

[photoImage drawInRect:CGRectMake(0,0,photoSize.width,photoSize.height)];



CGPoint origin = self.beardView.frame.origin;
CGSize size = self.beardView.frame.size;

CGPoint originHair = self.hairView.frame.origin;
CGSize sizeHair = self.hairView.frame.size;

CGFloat xScale = screenSize.width / self.view.bounds.size.width;
CGFloat yScale = screenSize.height / (self.view.bounds.size.height);

CGFloat x1Scale = photoSize.width / self.view.bounds.size.width;
CGFloat y1Scale = photoSize.height / (self.view.bounds.size.height);

[beardImage drawInRect:CGRectMake((origin.x * x1Scale), (origin.y * y1Scale),
                                  size.width * xScale, size.height * yScale)
             blendMode:kCGBlendModeNormal alpha:1.0];

[hairImage drawInRect:CGRectMake((originHair.x * x1Scale), (originHair.y * y1Scale),
                                 sizeHair.width * xScale, sizeHair.height * yScale)
            blendMode:kCGBlendModeNormal alpha:1.0];


UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return newImage;

}