Events, delegates and functions as arguments in C#

Last year I learnt a bit of Scala and I realized that functional languages have, I have to admit, a lot of pros. I am not saying that the functional paradigm is one of my favorites; it is not, in fact I think that it is one of the most difficult to interiorize. However, some of the ideas of this paradigm are really useful and they would be very useful in other languages.

And suddenly, learning C# I discovered the delegates and how to pass functions as arguments in other functions. So simple, so easy, so clean, so beautiful that I had to share it with you.

Example of delegates in C#:

	using System;
	namespace DelegatesBlog {
	delegate void TypeOnKeyPressed(ConsoleKey key);
	class MainClass {
	public static void Main(string[] args) {
	Console.WriteLine("Start!");
	MyKeyCatcher catcher = new MyKeyCatcher();
	// Add event handlers
	catcher.OnKeyPressedCallback += OhMyPress;
	catcher.Start();
	}
	private static void OhMyPress(ConsoleKey key) {
	Console.WriteLine("\nPressed " + key.ToString());
	}
	}
	class MyKeyCatcher {
	// The "event" keyword is not mandatory but
	// it prevents from being set to null from outside
	public event TypeOnKeyPressed OnKeyPressedCallback;
	public void Start() {
	bool loop = true;
	do {
	ConsoleKeyInfo info = Console.ReadKey();
	OnKeyPressedCallback(info.Key);
	loop = info.Key != ConsoleKey.Escape;
	} while (loop);
	}
	}
	}

view raw DelegatesC#.cs hosted with ❤ by GitHub

You can also use an anonymous method or a lambda expression instead of an actual method:

	catcher.OnKeyPressedCallback += delegate(ConsoleKey key) {
	Console.WriteLine("\nPressed from anonymous: " + key.ToString());
	};
	catcher.OnKeyPressedCallback += ( key => Console.WriteLine("\nPressed from lambda expression: " + key.ToString()) );

view raw DelegatesC#AnonymousAndLambda.cs hosted with ❤ by GitHub

In this example with multiple classes subscribing to a delegate, we have a class that allows the user to make movements with the arrow keys (for example, to escape from a maze) and another class that constraints the number of movements to escape:

	using System;
	namespace DelegatesBlog {
	delegate void TypeOnKeyPressed(ConsoleKey key);
	class MainClass {
	public static void Main(string[] args) {
	Console.WriteLine("--Start catching--");
	MyKeyCatcher catcher = new MyKeyCatcher();
	// Create listeners
	new SubscriberClassArrows(catcher);
	new SubscriberClassMaxKeyPressed(catcher, 10);
	catcher.Start();
	}
	}
	class MyKeyCatcher {
	// The "event" keyword is not mandatory but
	// it prevents from being set to null from outside
	public event TypeOnKeyPressed OnKeyPressedCallback;
	private bool loop;
	public MyKeyCatcher() {
	loop = true;
	}
	public void Start() {
	while (loop) {
	ConsoleKeyInfo info = Console.ReadKey();
	if (info.Key == ConsoleKey.Escape) {
	Stop();
	return;
	}
	OnKeyPressedCallback(info.Key);
	}
	}
	public void Stop() {
	loop = false;
	Console.WriteLine("--Stop catching--");
	}
	}
	class SubscriberClassArrows {
	// Let's say we have a player and we want to move it
	// around the scene to get out of the maze
	public SubscriberClassArrows(MyKeyCatcher catcher) {
	catcher.OnKeyPressedCallback += OnKeyPressed;
	}
	private void OnKeyPressed(ConsoleKey key) {
	switch (key) {
	case ConsoleKey.UpArrow:
	Console.WriteLine("\n(SubscriberClassArrows ->) Move up");
	break;
	case ConsoleKey.DownArrow:
	Console.WriteLine("\n(SubscriberClassArrows ->) Move down");
	break;
	case ConsoleKey.LeftArrow:
	Console.WriteLine("\n(SubscriberClassArrows ->) Move left");
	break;
	case ConsoleKey.RightArrow:
	Console.WriteLine("\n(SubscriberClassArrows ->) Move right");
	break;
	default:
	break;
	}
	}
	}
	class SubscriberClassMaxKeyPressed {
	// Let's say we have max number of steps to get out of the maze
	private int leftMovements;
	private MyKeyCatcher catcher;
	public SubscriberClassMaxKeyPressed(MyKeyCatcher catcher, int maxKey) {
	leftMovements = maxKey;
	this.catcher = catcher;
	catcher.OnKeyPressedCallback += OnKeyPressed;
	}
	private void OnKeyPressed(ConsoleKey key) {
	leftMovements--;
	Console.WriteLine("\n(SubscriberClassMaxKeyPressed ->) Left movements to end " + leftMovements);
	if (leftMovements <= 0) {
	catcher.Stop();
	}
	}
	}
	}

view raw DelegatesC#MultipleClasses.cs hosted with ❤ by GitHub

Instead of defining a new delegate each time, you can take advantage of the delegates that come with the .Net library which are Action and Func. The first one is used when the delegate returns void and the other when a value is returned (thus not common with events). Both are overloaded for different number of arguments, from 0 up to 16 (I think it's enough), with the form: Action(T1 arg1, T2 arg2, ...).

	using System;
	namespace DelegatesBlog {
	// Not needed anymore!
	//delegate void TypeOnKeyPressed(ConsoleKey key);
	class MainClass {
	// Nothing changes
	...
	}
	class MyKeyCatcher {
	// Use action instead of our own delegate type
	//public event TypeOnKeyPressed OnKeyPressedCallback;
	public event Action<ConsoleKey> OnKeyPressedCallback;
	...
	}
	class SubscriberClassArrows {
	// Nothing changes
	...
	}
	class SubscriberClassMaxKeyPressed {
	// Nothing changes
	...
	}
	}

view raw DelegatesC#Action.cs hosted with ❤ by GitHub

Passing function as arguments to other functions is also very easy. Here I modify the example to prompt the user to retry the game when the max movements are reached:

	using System;
	namespace DelegatesBlog {
	class MainClass {
	// Nothing changes
	...
	}
	class MyKeyCatcher {
	...
	public void Stop() {
	loop = false;
	Console.WriteLine("--Stop catching--");
	}
	// Overload Stop, If the stop is cancelled can cancel the stop
	public void Stop(Func<bool> cancel) {
	if (!cancel()) {
	Stop();
	}
	}
	}
	class SubscriberClassArrows {
	// Nothing changes
	...
	}
	class SubscriberClassMaxKeyPressed {
	...
	// When reach the max movements prompt to retry
	// If yes, reset the max
	private void OnKeyPressed(ConsoleKey key) {
	leftMovements--;
	Console.WriteLine("\n(SubscriberClassMaxKeyPressed ->) Left movements to end " + leftMovements);
	if (leftMovements <= 0) {
	// A lambda expression for prompting
	catcher.Stop(() => {
	Console.WriteLine("Do you want to try again? (if yes press Y)");
	if (Console.ReadKey().Key == ConsoleKey.Y) {
	Console.WriteLine();
	leftMovements = 10;
	return true;
	}
	return false;
	});
	}
	}
	}
	}

view raw DelegatesC#PassFunctionArgument.cs hosted with ❤ by GitHub

Note that when you use delegates in Unity3D and you apply them to a MonoBehaviour, you must be careful with their lifetime and prevent the delegate from calling methods that are not anymore available. Be aware that changing the scene or removing the component from the game object, removes the script from memory but doesn't deallocate the callback, so you should remove it explicitly in the onDestroy method.

	using UnityEngine;
	using System.Collections;
	public class Example : MonoBehaviour {
	void Start() {
	print("Start. Init the delegate callback");
	catcher.OnKeyPressedCallback += OnKeyPressed;
	}
	void OnDestroy() {
	print("Script was destroyed. Remove Delegate");
	catcher.OnKeyPressedCallback -= OnKeyPressed;
	}
	private void OnKeyPressed(ConsoleKey key) {
	print("Callback");
	...
	}
	}

view raw DelegatesC#Unity.cs hosted with ❤ by GitHub

Enjoy!

New challenges

New job, new developing tools, new projects, new versions of frameworks, ... What does it mean? More fun... well, sometimes ;-)

Since November I am working in a game company where we work with Unity3D, C# and all the surrounding tools and languages around such big project. It was completely new for me to change to a three dimensional world, but it's really worth it and I discovered that C# is a great language. I will definitely write about it.

In addition, I decided to start my own project with my sister, a 2d casual game. However, the new 2d Unity implementation does not suit all my needs and it only gives me headaches. Thus, I decided to start the project using Cocos2d v3.

I haven't progressed too much with the project but up to this point I am very happy with the improvements I've already seen in the framework. But it is quite recent, which means no documentation, no questions in stackoverflow, not many places to look at when problems arise... but this is an interesting challenge and I hope I can contribute with my findings in this blog.

This is plainly an update post, and a way to push myself into writing about these new topics.

Resources framework for "universal" apps

When I started programming for iOS, the projects I were involved in were all for iPad devices only (only a pack of image resources), but when I started coding I did it in such a way that with the same code it was valid for iPad and iPhone. It was a great idea because later on the iPad apps were turned into universal apps and the changes in the code were just a few details. The idea is the following:

1. Initialize the scale of the background with respect to the current screen size and the resources dimensions and save this ratio.
2. Scale the background and images with the previously calculated ratio. As the iPhone has not the same dimensions of the iPad, it uses scaleX and scaleY, and the images get a bit stretched.
3. Never use points for positions, but use logic of dynamic positions with respect to the screen: top-left corner of the screen is (size.width*0, size.height*1) and the center-right point is (size.width*1, size.height*0.5).

One of the problems I found in my way was the memory constraint, the iPad 1 couldn't load big files of images. I had to change the resources target from iPad retina to iPad non-retina screen. Enabling retina display but without the -hd resources makes the graphics on iPad retina not blurred nor with pixels, so it was a good solution and saved a lot of mega bytes.

Here you have the framework and an example of the usage:

	//
	// ResourcesManagerStretched.h
	//
	// Created by Elena Vielva on 31/04/12.
	// Copyright (c) 2012 Elena Vielva. All rights reserved.
	//
	#import <Foundation/Foundation.h>
	#import "cocos2d.h"
	@interface ResourcesManagerStretched : NSObject {
	float scaleX;
	float scaleY;
	CGSize size;
	CCSpriteFrameCache *frameCache;
	}
	@property (readonly) float scaleX;
	@property (readonly) float scaleY;
	@property (readonly) CGSize size;
	+ (ResourcesManagerStretched *) sharedResourcesManager;
	- (CCSprite *) addBackground:(NSString*)bg To:(CCLayer*)layer;
	- (CCSprite *) addSpriteWithName:(NSString*)name Position:(CGPoint)pos Layer:(int)z To:(CCNode*)layer Tag:(int) tag;
	- (CCAnimate*) generateAnimationWithName:(NSString*)name NumberOfImages:(int)n Delay:(float) delay Repeticion:(BOOL) rep Restore:(BOOL)restore;
	@end

view raw ResourcesManagerStretched.h hosted with ❤ by GitHub

	//
	// ResourcesManagerStretched.m
	//
	// Created by Elena Vielva on 31/04/12.
	// Copyright (c) 2012 Elena Vielva. All rights reserved.
	//
	#import "ResourcesManagerStretched.h"
	static ResourcesManagerStretched *shared;
	@implementation ResourcesManagerStretched
	@synthesize scaleX = scaleX;
	@synthesize scaleY = scaleY;
	@synthesize size = size;
	+ (ResourcesManagerStretched *) sharedResourcesManager {
	if (shared) {
	return shared;
	}
	shared = [[ResourcesManagerStretched alloc] init];
	return shared;
	}
	+ (id)alloc {
	NSAssert(shared == nil, @"Attempted to allocate a second instance of a singleton.");
	return [super alloc];
	}
	-(id) init {
	self = [super init];
	if (self) {
	size = [[CCDirector sharedDirector] winSize];
	frameCache = [CCSpriteFrameCache sharedSpriteFrameCache];
	}
	return self;
	}
	/** ADDBACKGROUND:TO
	* Adds a background image to the scene. For this:
	* - Gets the file from the name
	* - Scales it
	* - Places it in the center of the screen
	* - Adds it to the z-height -1 (to make sure its in the background)
	* Input: NSString -> name of the background image
	* CCLayer -> parent layer to add the background to
	* Output: CCSprite -> the sprite
	*/
	- (CCSprite *) addBackground:(NSString *)bg To:(CCLayer *)layer {
	CCSprite *background = [CCSprite spriteWithFile:bg];
	if ((scaleX==0) || (scaleY==0)) {
	scaleX = size.width / background.contentSize.width;
	scaleY = size.height / background.contentSize.height;
	}
	background.scaleX = scaleX;
	background.scaleY = scaleY;
	NSAssert(background!=nil,@"Error couldn't load background");
	[background setPosition:ccp(size.width/2, size.height/2)];
	[layer addChild:background z:-1];
	return background;
	}
	/** ADDSPRITEWITHFRAME:POSITION:LAYER:TO:TAG
	* Adds the sprite to the scene. For this:
	* - Gets the frame from the name
	* - Gets the sprite from the frame
	* - Scales the sprite according with the current device
	* - Places it in the given position
	* - Adds it to the parent node
	* Input: NSString -> name of the file
	* CGPoint -> position where the sprite is placed
	* int -> z-layer (height) where the sprite is placed
	* CCNode -> parent node where the sprite is added to
	* Int -> tag
	* Output: CCSprite -> the sprite
	*/
	- (CCSprite *) addSpriteWithName:(NSString*)name Position:(CGPoint)pos Layer:(int)z To:(CCNode *)layer Tag:(int) tag{
	CCSpriteFrame * frame = [frameCache spriteFrameByName:name];
	NSAssert(frame!=nil,@"Frame es nil");
	CCSprite *sprite = [CCSprite spriteWithSpriteFrame:frame];
	if ((scaleX==0) || (scaleY==0)) {
	scaleX = size.width / sprite.contentSize.width;
	scaleY = size.height / sprite.contentSize.height;
	}
	if (sprite!=nil) {
	sprite.scaleX = scaleX;
	sprite.scaleY = scaleY;
	[sprite setPosition:pos];
	[layer addChild:sprite z:z tag:tag];
	}
	return sprite;
	}
	/** GENERATEANIMATIONWITHNAME:NUMBEROFIMAGES:DELAY:REPETITION:TO {:RESTORE}
	* The name of the sprites range from name0001.png to name0023.png for example
	* Generates a cartoon-style animation. For this:
	* - For each image of the animation: "calculates its name" and adds it to an array
	* - When all the images are added to the array, creates the animation
	* - It the animation should be a loop, makes the animation repeat forever
	* Input: NSString -> Base name of the animations (before 0001.png)
	* int -> Number of images of the animation
	* float -> Delay between the animation frames
	* BOOL -> Whether the animation is a loop or not
	* BOOL -> Whether the animation should restore to the first frame when finished or not
	* Output: CCAnimate -> The animation
	*/
	- (CCAnimate*) generateAnimationWithName:(NSString*)name NumberOfImages:(int)n Delay:(float) delay Repeticion:(BOOL) rep Restore:(BOOL)restore {
	NSMutableArray *animFrames = [NSMutableArray array];
	for (int i=1; i<=n; i++) {
	NSString * spriteName;
	if (i<10) {
	spriteName = [NSString stringWithFormat:@"%@000%d.png",name, i];
	} else if (i<100) {
	spriteName = [NSString stringWithFormat:@"%@00%d.png",name, i];
	} else if (i<1000) {
	spriteName = [NSString stringWithFormat:@"%@0%d.png",name, i];
	} else if (i<10000) {
	spriteName = [NSString stringWithFormat:@"%@%d.png",name, i];
	}
	CCSpriteFrame * frame = [frameCache spriteFrameByName: spriteName];
	[animFrames addObject: frame];
	}
	CCAnimation *animation = [CCAnimation animationWithFrames:animFrames delay:delay];
	CCAnimate *action = [CCAnimate actionWithAnimation:animation restoreOriginalFrame:restore];
	if (rep) {
	action = [CCRepeatForever actionWithAction:action];
	}
	return action;
	}
	@end

view raw ResourcesManagerStretched.mm hosted with ❤ by GitHub

	+(CCScene *) scene {
	CCScene *scene = [CCScene node];
	TestLayer *layer = [TestLayer node];
	[scene addChild: layer];
	return scene;
	}
	- (id) init {
	self = [super init];
	if (self) {
	ResourcesManagerStretched *helper = [ResourcesManagerStretched sharedResourcesManager];
	[helper addBackground:@"background.jpg" To:self];
	size = helper.size;
	[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"resources.plist"
	textureFile:@"resources.pvr.ccz"];
	sp1 = [helper addSpriteWithName:@"spName.png" Position:ccp(size.width*0.5,size.height*0.18) Layer:5 To:self];
	sp2 = [helper addSpriteWithName:@"otherSprite.png" Position:ccp(size.width*0.1,size.height*0.1) Layer:5 To:self];
	}
	return self;
	}

view raw TestLayer.mm hosted with ❤ by GitHub

When the iPhone 5 ready apps were mandatory for new submissions (and updates), it was also possible to keep stretching the backgrounds and sprites, but now our characters have got too much fat. I had to think a new way of using only a pack of images and taking advance of all screen sizes. Pen and paper and a calculator for operations, I draw something like this:

The small rectangle should have all the important information for the app (buttons, information, ...) but the background have to fill all the space, in order to take advance of the iPhone screens. The reference size is the dimension of this rectangle in the different devices: in the iPad is the same as its size, while in the iphone will fulfill that 4*iphoneHeight = 3*iphoneWidth. Thus, the left reference point is the (screen size - reference size) / 2 and the point most on the right would be refLeft+refWidht*1.0.

Here there is the new framework and an example of how to use it:

	//
	// ResourcesManager.h
	//
	// Created by Elena Vielva on 15/04/13.
	// Copyright (c) 2012 Elena Vielva. All rights reserved.
	//
	#import <Foundation/Foundation.h>
	#import "cocos2d.h"
	#import "Constants.h"
	@interface ResourcesManager : NSObject {
	float _scale;
	CGSize _size;
	CGSize _refSize;
	CCSpriteFrameCache *frameCache;
	}
	@property (readonly) float scale;
	@property (readonly) CGSize size;
	@property (readonly) CGSize refSize;
	+ (ResourcesManager *) sharedResourcesManager;
	- (CCSprite *) addBackground:(NSString*)bg To:(CCLayer*)layer;
	- (CCSprite *) addSpriteWithName:(NSString*)name Position:(CGPoint)pos Layer:(int)z To:(CCNode*)layer Tag:(int) tag;
	- (CCAnimate*) generateAnimationWithName:(NSString*)name NumberOfImages:(int)n Delay:(float) delay Repeticion:(BOOL) rep Restore:(BOOL)restore;
	@end

view raw ResourcesManager.h hosted with ❤ by GitHub

	//
	// ResourcesManager.m
	//
	// Created by Elena Vielva on 15/04/13.
	// Copyright (c) 2012 Elena Vielva. All rights reserved.
	//
	#import "ResourcesManager.h"
	static ResourcesManager *shared;
	@implementation ResourcesManager
	@synthesize scale = _scale;
	@synthesize size = _size;
	@synthesize refSize = _refSize;
	+ (ResourcesManager *) sharedResourcesManager {
	if (shared) {
	return shared;
	}
	shared = [[ResourcesManager alloc] init];
	return shared;
	}
	+ (id)alloc {
	NSAssert(shared == nil, @"Attempted to allocate a second instance of a singleton.");
	return [super alloc];
	}
	-(id) init {
	self = [super init];
	if (self) {
	_size = [[CCDirector sharedDirector] winSize];
	frameCache = [CCSpriteFrameCache sharedSpriteFrameCache];
	[self initRefSizes];
	}
	return self;
	}
	/** INITREFSIZES
	* Initializes the reference sizes (dimensions) for the current device
	* Reference size is the dimensions of the screen in which will be the information and important elements of the scene
	* - iPads have as reference size the iPad non-retina dimension
	* - iPhone reference size: keep the height; the width is calculated from its height with the ratio of iPad screen dimensions
	*/
	- (void) initRefSizes {
	CGSize pixelSize = [[CCDirector sharedDirector] winSizeInPixels];
	if (pixelSize.width == 1024) {
	// iPad non-retina
	_refSize = CGSizeMake(1024, 768);
	}else if (pixelSize.width == 2048) {
	// iPad retina
	_refSize = CGSizeMake(1024, 768);
	}else if (pixelSize.width == 1136) {
	// iPhone 5
	_refSize = CGSizeMake(427, 320);
	}else if (pixelSize.width == 960) {
	// iPhone retina
	_refSize = CGSizeMake(427, 320);
	}else if (pixelSize.width == 480) {
	// iPhone non-retina
	_refSize = CGSizeMake(427, 320);
	}
	_scale = pixelSize.height/768;
	}
	/** ADDBACKGROUND:TO
	* Adds a background image to the scene. For this:
	* - Gets the file from the name
	* - Scales it
	* - Places it in the center of the screen
	* - Adds it to the z-height -1 (to make sure its in the background)
	* Input: NSString -> name of the background image
	* CCLayer -> parent layer to add the background to
	* Output: CCSprite -> the sprite
	*/
	- (CCSprite *) addBackground:(NSString *)bg To:(CCLayer *)layer {
	CCSprite *background = [CCSprite spriteWithFile:bg];
	background.scale = _scale;
	NSAssert(background!=nil,@"Error al cargar el fondo");
	[background setPosition:ccp(_size.width/2, _size.height/2)];
	[layer addChild:background z:-1];
	return background;
	}
	/** ADDSPRITEWITHFRAME:POSITION:LAYER:TO:TAG
	* Adds the sprite to the scene. For this:
	* - Gets the frame from the name
	* - Gets the sprite from the frame
	* - Scales the sprite according with the current device
	* - Places it in the given position
	* - Adds it to the parent node
	* Input: NSString -> name of the file
	* CGPoint -> position where the sprite is placed
	* int -> z-layer (height) where the sprite is placed
	* CCNode -> parent node where the sprite is added to
	* Int -> tag
	* Output: CCSprite -> the sprite
	*/
	- (CCSprite *) addSpriteWithName:(NSString*)name Position:(CGPoint)pos Layer:(int)z To:(CCNode *)layer Tag:(int) tag{
	CCSpriteFrame * frame = [frameCache spriteFrameByName:name];
	NSAssert(frame!=nil,@"Frame es nil");
	CCSprite *sprite = [CCSprite spriteWithSpriteFrame:frame];
	if (sprite!=nil) {
	sprite.scale = _scale;
	[sprite setPosition:pos];
	[layer addChild:sprite z:z tag:tag];
	}
	return sprite;
	}
	/** GENERATEANIMATIONWITHNAME:NUMBEROFIMAGES:DELAY:REPETITION:TO {:RESTORE}
	* The name of the sprites range from name0001.png to name0023.png for example
	* Generates a cartoon-style animation. For this:
	* - For each image of the animation: "calculates its name" and adds it to an array
	* - When all the images are added to the array, creates the animation
	* - It the animation should be a loop, makes the animation repeat forever
	* Recibe: NSString -> Base name of the animations (before 0001.png)
	* int -> Number of images of the animation
	* float -> Delay between the animation frames
	* BOOL -> Whether the animation is a loop or not
	* BOOL -> Whether the animation should restore to the first frame when finished or not
	* Devuelve: CCAnimate -> The animation
	*/
	- (CCAnimate*) generateAnimationWithName:(NSString*)name NumberOfImages:(int)n Delay:(float) delay Repeticion:(BOOL) rep Restore:(BOOL)restore {
	NSMutableArray *animFrames = [NSMutableArray array];
	for (int i=1; i<=n; i++) {
	NSString * spriteName;
	if (i<10) {
	spriteName = [NSString stringWithFormat:@"%@000%d.png",name, i];
	} else if (i<100) {
	spriteName = [NSString stringWithFormat:@"%@00%d.png",name, i];
	} else if (i<1000) {
	spriteName = [NSString stringWithFormat:@"%@0%d.png",name, i];
	} else if (i<10000) {
	spriteName = [NSString stringWithFormat:@"%@%d.png",name, i];
	}
	CCSpriteFrame * frame = [frameCache spriteFrameByName: spriteName];
	[animFrames addObject: frame];
	}
	CCAnimation *animation = [CCAnimation animationWithSpriteFrames:animFrames delay:delay];
	CCAnimate *action = [CCAnimate actionWithAnimation:animation restoreOriginalFrame:restore];
	if (rep) {
	action = [CCRepeatForever actionWithAction:action];
	}
	return action;
	}
	- (void) dealloc {
	NSLog(@"Deallocating %@",self);
	[super dealloc];
	}
	@end

view raw ResourcesManager.mm hosted with ❤ by GitHub

	+ (CCScene *) scene{
	CCScene *scene = [CCScene node];
	SomeLayer *layer = [SomeLayer node];
	[scene addChild:layer];
	return scene;
	}
	- (id) init{
	self = [super init];
	if (self) {
	// ask director for the window size
	CGSize size = [[CCDirector sharedDirector] winSize];
	[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"sceneResources.plist"];
	ResourcesManager *helper = [ResourcesManager sharedResourcesManager];
	float refWidth = helper.refSize.width;
	float refLeft = size.width/2-refWidth/2;
	[helper addBackground:@"sceneBackground.jpg" To:self];
	sp1 = [helper addSpriteWithName:@"spriteName.png" Position:ccp(refLeft+refWidth*0.5, size.height*0.18) Layer:2 To:self];
	sp2 = [helper addSpriteWithName:@"otherSprite.png" Position:ccp(refLeft+refWidth*0.1, size.height*0.1) Layer:2 To:self];
	}
	return self;
	}

view raw SomeLayer.mm hosted with ❤ by GitHub

Some useful links:

• iPhone/iPad dimensions:
• http://www.idev101.com/code/User_Interface/sizes.html
• http://upstageapp.com/resources
• Texture packer:
• http://www.codeandweb.com/texturepacker
• http://www.codeandweb.com/texturepacker/tutorials#cocos2d

Adding sound to your game with Cocos2D

If you are developing a game probably you need to add sound to your app.

As many other things, although Apple offers you a library to manage the audio, Cocos2D has it's own class: SimpleAudioEngine. It makes you really easy to insert background music and sound effects. It also allows you to modify basic properties such as pitch, pan and gain, and the possibility of looping a sound.

You can preload the sound (if you have a lot and heavy sounds). For loopings you need a CDSoundsource class:

	soundEngine = [SimpleAudioEngine sharedEngine];
	[soundEngine preloadEffect:@"sound1.mp3"];
	[soundEngine preloadEffect:@"sound2.mp3"];
	[soundEngine preloadBackgroundMusic:@"backgroundMusic.mp3"];
	loopingSound = [[soundEngine soundSourceForFile:@"loopingSound.mp3"] retain];
	loopingSound.looping = YES;

view raw gistfile1.m hosted with ❤ by GitHub

Playing effects and background is very easy:

	[soundEngine playBackgroundMusic:@"backgroundMusic.mp3" loop:YES];
	[soundEngine playEffect:@"sound1.mp3"];

view raw gistfile1.m hosted with ❤ by GitHub

Setting other properties is also easy:

	[soundEngine setBackgroundMusicVolume:0.4];
	[soundEngine playEffect:@"sound1.mp3" pitch:1 pan:0 gain:0.4];
	[loopingSound setMute:YES];

view raw gistfile1.txt hosted with ❤ by GitHub

Playing around with looping sounds:

	[loopingSound play];
	[loopingSound pause];
	[loopingSound rewind];
	[loopingSound stop];

view raw gistfile1.m hosted with ❤ by GitHub

	// Never forget to release the looping sound in the dealloc method
	[loopingSound release];

view raw gistfile2.txt hosted with ❤ by GitHub

I thought I removed the file...

Sometimes, when you are sure that everything is alright because the app runs perfectly on all your devices, one of your testers report a bug saying that the app shuts down while loading in some scene (well, they just say something like "yeah.. I select all the items and then, it closes and I cannot continue"). You have very few information, so you start summarizing:

1. It cannot be memory warning (always first guess, but you test with an iPad 1, the iPad 3 cannot raise this problem)
2. It cannot be a weird behavior of the inner logic because it is just a background and some sprites...
3. This scene had previously worked, and then I changed the background...
4. If the background is not found?
5. (After look in the project) But the background is not in the project... Why is it working in my devices if there is no image?!

It has happened to me to many times so I decided to write this post.

The first time I saw this issue was when refactoring my code and stop using retina resources, so it turned from having background-hd.jpg and background.jpg to just background.jpg. I removed the file from the project, clean the cache and made sure it wasn't the old file there anymore. But, somehow, XCode seemed to remember it, so when I asked for this file in my devices was ok but my testers iPad hadn't that resource and crashed.

I was very crossed, because I didn't want to rename all files to solved the problem. So, I asked the Almighty and found some solutions on Stackoverflow. The problem relied on XCode's derived cache, and there were offered some solutions:

1. Clean via XCode (source)
• The problem remained
2. Going to the folder in your laptop and cleaning the data manually: ~/Library/Developer/Xcode/DerivedData/ (source)
• It didn't worked for me, my corresponding folder was empty
3. Delete app, clean everything, empty caches (source)
• Still there

How did I solved the problem? I did not solve it :( I solved my concrete bug manually, by renaming the files and the path names in the code.

Why did I write this post? To show you potential problems you may have with XCode and the resources, and a non-perfect solution for it. Also, if you find a good way to get rid of this ridiculous issue that makes stupid names of our resources, feel free to share it with a comment.

'Kamcording' your app

When you are a programmer, you get used to searching for new tools, fighting with poorly documented frameworks, and searching for solutions of problems that come with new staff. You also end up learning when to discard a tool. Tools may be bad, may not adjust to your problem, may give you more problems than solutions... or may be exactly what you are looking for... But what makes a tool great is the people behind it, a technical support that turns problems into solutions. And that's exactly how I would describe Kamcord.

The moment I saw this tool I knew it could be perfect for the new game we are designing, so I decided to make a project to test it. I had two problems: one with the rotation and the other was causing a crash with certain iOS version. Thus, I wrote to the supporting team. The answer was really fast and solved the orientation issue. They needed more information about my devices and project in order to solve the crashing problem so we exchanged several mails, projects, framework's updates... In just 5 days I had the whole project perfectly working. I didn't have to insist, but they were working on my problem till they got to the solution. And every mail was really polite. I'm very happy with the support I've received :)

Kamcord, this amazing tool, is a framework that allows your app's users to record the flow of the app and share it with friends. Easy and well documented.

Available for Cocos2d and Unity. Download from the web and follow the tutorial, it's well explained.

1. Copy the Kamcord folder into your project.
2. Add the framework and other supporting frameworks (twitter, mediaplayer, ... ).
3. Adjust the settings for iOS < 4 (turn to optional some of the just added frameworks).
4. Add to 'other linker flags': -ObjC -all_load -lxml2

At this point, it should compile, if not, check all the steps. At my first attempt it failed but I realized I  had skipped the third step.

On the other hand, Kamcord uses their own glview, therefore you have to do some changes in your AppDelegate.

5. Make the root view controller extend from KCViewController
6. Instantiate the glview as a KCGLView instead of an eaglview
7. Set the root view controller to the window
8. Configure Kamcord and set your developer key, secret and app name.

	#import <Kamcord/Kamcord.h>
	@implementation AppDelegate
	@synthesize window;
	//** Other functions **//
	- (void) applicationDidFinishLaunching:(UIApplication*)application {
	// Init the window
	window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
	// Try to use CADisplayLink director
	// if it fails (SDK < 3.1) use the default director
	if( ! [CCDirector setDirectorType:kCCDirectorTypeDisplayLink] )
	[CCDirector setDirectorType:kCCDirectorTypeDefault];
	CCDirector *director = [CCDirector sharedDirector];
	//** NEW **//
	// Init the View Controller
	// viewController = [[RootViewController alloc] initWithNibName:nil bundle:nil];
	// viewController.wantsFullScreenLayout = YES;
	// Create the EAGLView manually
	// 1. Create a RGB565 format. Alternative: RGBA8
	// 2. depth format of 0 bit. Use 16 or 24 bit for 3d effects, like CCPageTurnTransition
	//
	//
	// EAGLView *glView = [EAGLView viewWithFrame:[window bounds] pixelFormat:kEAGLColorFormatRGB565 // kEAGLColorFormatRGBA8
	// depthFormat:0]; // GL_DEPTH_COMPONENT16_OES
	// attach the openglView to the director
	// [director setOpenGLView:glView];
	// Enables High Res mode (Retina Display) on iPhone 4 and maintains low res on all other devices
	// if( ! [director enableRetinaDisplay:YES] )
	// CCLOG(@"Retina Display Not supported");
	// VERY IMPORTANT:
	// If the rotation is going to be controlled by a UIViewController
	// then the device orientation should be "Portrait".
	// IMPORTANT:
	// By default, this template only supports Landscape orientations.
	// Edit the RootViewController.m file to edit the supported orientations.
	//#if GAME_AUTOROTATION == kGameAutorotationUIViewController
	// [director setDeviceOrientation:kCCDeviceOrientationPortrait];
	//#else
	// [director setDeviceOrientation:kCCDeviceOrientationLandscapeLeft];
	//#endif
	[director setAnimationInterval:1.0/60];
	[director setDisplayFPS:YES];
	// make the OpenGLView a child of the view controller
	// [viewController setView:glView];
	//** Kamcord **//
	//** Instantiate a KCGLView, which is a subclass of EAGLView with special recording functionality.
	KCGLView * glView = [KCGLView viewWithFrame:[window bounds]
	pixelFormat:kEAGLColorFormatRGB565
	depthFormat:0];
	//** Kamcord uses UIKit for autorotation, which requires special logic to handle rotations.
	window.rootViewController = [ [KCViewController alloc] initWithNibName:nil bundle:nil];
	window.rootViewController.view = glView;
	//** Tell Kamcord about the root view controller and the KCGLView
	[Kamcord setParentViewController:window.rootViewController];
	[Kamcord setOpenGLView:glView];
	//** Set the device orientation. Must use Kamcord, not CCDirector!
	[Kamcord setDeviceOrientation:CCDeviceOrientationLandscapeLeft];
	[Kamcord setDeveloperKey:@"--your key--"
	developerSecret:@"--your secret--"
	appName:@"testingKamcord"];
	//** End of Kamcord code **//
	// make the View Controller a child of the main window
	[window addSubview: viewController.view];
	[window makeKeyAndVisible];
	// Default texture format for PNG/BMP/TIFF/JPEG/GIF images
	// It can be RGBA8888, RGBA4444, RGB5_A1, RGB565
	// You can change anytime.
	[CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGBA8888];
	// Removes the startup flicker
	[self removeStartupFlicker];
	// Run the intro Scene
	[[CCDirector sharedDirector] runWithScene: [HelloWorldLayer scene]];
	}

view raw gistfile1.m hosted with ❤ by GitHub

	#import <Kamcord/Kamcord.h>
	//** RootViewController now extends from this new view controller
	@interface RootViewController : KCViewController {
	}

view raw gistfile2.m hosted with ❤ by GitHub

Notation for the comments:

Indented // comments: cocos2d autogenerated;

Non-indented // comments: code not anymore needed;

Indented //* comments: Kamcord explanations;

Non-indented //* comments: mine

Now, adding the functionality is really easy:

9. Import the Kamcord framework on each scene you want.
10. Call startRecording when you want to start the video
11. Call stopRecording when you want to stop the recording
12. Call showView (normally after you have record) to show the replay and share options of Kamcord

	//
	// HelloWorldLayer.m
	// testingkamcord
	//
	// Created by Elena Vielva on 27/03/13.
	// Copyright __MyCompanyName__ 2013. All rights reserved.
	//
	// Import the interfaces
	#import "HelloWorldLayer.h"
	#import <Kamcord/Kamcord.h>
	#import "AppDelegate.h"
	// HelloWorldLayer implementation
	@implementation HelloWorldLayer
	+(CCScene *) scene {
	// 'scene' is an autorelease object.
	CCScene *scene = [CCScene node];
	// 'layer' is an autorelease object.
	HelloWorldLayer *layer = [HelloWorldLayer node];
	// add layer as a child to scene
	[scene addChild: layer];
	// return the scene
	return scene;
	}
	// on "init" you need to initialize your instance
	-(id) init {
	if( (self=[super init])) {
	// create and initialize a Label
	label = [CCLabelTTF labelWithString:@"¡¡Hola mundo!!" fontName:@"Marker Felt" fontSize:64];
	// ask director the the window size
	CGSize size = [[CCDirector sharedDirector] winSize];
	// position the label on the center of the screen
	label.position = ccp( size.width /2 , size.height/2 );
	// add the label as a child to this Layer
	[self addChild: label z:10];
	// Button
	button = [CCSprite spriteWithFile:@"PanicButton.png"];
	button.position = ccp(size.width*0.9, size.height*0.1);
	[self addChild:button z:5];
	// Grabar con Kamcord
	startRec = [CCLabelTTF labelWithString:@"Start recording" fontName:@"Marker Felt" fontSize:56];
	startRec.position = ccp(size.width/2, size.height*0.3);
	startRec.color = ccGREEN;
	startRec.opacity=0;
	[self addChild:startRec z:5];
	stopRec = [CCLabelTTF labelWithString:@"Stop recording" fontName:@"Marker Felt" fontSize:56];
	stopRec.position = ccp(size.width/2, size.height*0.3);
	stopRec.color = ccRED;
	stopRec.opacity=0;
	[self addChild:stopRec z:5];
	share = [CCLabelTTF labelWithString:@"Share the video" fontName:@"Marker Felt" fontSize:26];
	share.position = ccp(size.width*0.85, size.height*0.2);
	share.color = ccORANGE;
	share.opacity=0;
	[self addChild:share z:5];
	[Kamcord setDefaultEmailBody:@"¡Ey! Mira el baile que he hecho con la etiqueta de texto...\r\n"];
	[Kamcord setDefaultTitle:@"Baile"];
	touched = NO;
	self.isTouchEnabled = YES;
	}
	return self;
	}
	- (void) ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint location = [touch locationInView:touch.view];
	location = [[CCDirector sharedDirector] convertToGL:location];
	if (CGRectContainsPoint(label.boundingBox, location)) {
	label.position = location;
	touched = YES;
	return;
	}
	if (CGRectContainsPoint(button.boundingBox, location)) {
	if (recording) {
	recording = NO;
	[Kamcord stopRecording];
	[share runAction:[CCFadeIn actionWithDuration:0.2]];
	[stopRec runAction:[CCSequence actions:[CCFadeIn actionWithDuration:0.1],[CCDelayTime actionWithDuration:0.2],[CCFadeOut actionWithDuration:0.3], nil]];
	}else {
	recording = YES;
	share.opacity = 0;
	[Kamcord startRecording];
	[startRec runAction:[CCSequence actions:[CCFadeIn actionWithDuration:0.1],[CCDelayTime actionWithDuration:0.2],[CCFadeOut actionWithDuration:0.3], nil]];
	}
	return;
	}
	if (share.opacity>0&&CGRectContainsPoint(share.boundingBox, location)) {
	[Kamcord showView];
	return;
	}
	}
	- (void) ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint location = [touch locationInView:touch.view];
	if (touched) {
	location = [[CCDirector sharedDirector] convertToGL:location];
	label.position = location;
	}
	}
	- (void) ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
	CGSize size = [[CCDirector sharedDirector] winSize];
	if (touched) {
	label.position = ccp(size.width/2, size.height/2);
	touched = NO;
	}
	}
	// on "dealloc" you need to release all your retained objects
	- (void) dealloc {
	// in case you have something to dealloc, do it in this method
	// in this particular example nothing needs to be released.
	// cocos2d will automatically release all the children (Label)
	// don't forget to call "super dealloc"
	[super dealloc];
	}
	@end

view raw gistfile1.m hosted with ❤ by GitHub

	//
	// HelloWorldLayer.h
	// testingkamcord
	//
	// Created by Elena Vielva on 27/03/13.
	// Copyright __MyCompanyName__ 2013. All rights reserved.
	//
	// When you import this file, you import all the cocos2d classes
	#import "cocos2d.h"
	#import <AVFoundation/AVFoundation.h>
	// HelloWorldLayer
	@interface HelloWorldLayer : CCLayer <UIImagePickerControllerDelegate, UINavigationControllerDelegate> {
	CCLabelTTF *label;
	BOOL touched;
	BOOL recording;
	CCSprite *button;
	CCLabelTTF *startRec;
	CCLabelTTF *stopRec;
	CCLabelTTF *share;
	UIWindow *window;
	UIImage *newImage;
	}
	// returns a CCScene that contains the HelloWorldLayer as the only child
	+(CCScene *) scene;
	@end

view raw gistfile2.m hosted with ❤ by GitHub

It will look like this

And you can see the video here :)

Arabic, a language written from right to left

Lately I had to face inserting text in my app in different languages: English, Spanish, German, Chinese, Arabic, ...

What I first thought was how wonderful it would be to have all the texts in a string and change the label content depending on the selected language. Now, how intelligent labels are? Can they "understand odd symbols"? Actually, I was surprised of how simple was with the chinese: copy and paste the symbols. Tip: if you just want to insert Chinese symbols (for example, if you don't have yet the text and just want to try), don't search for "chinese symbols", instead use the google translator ;)
It doesn't depend on the font, it works with all I have tried (in this site)

So, if it's so simple, why did I write a post? Because after that I realized that the Arabic was a bit more complicated than Chinese or Japanese. It's written from right to left!

As the Arabic is written in this different direction, the label must be aligned on the right. In addition, it's not possible to change the property once the label is initialized. For this reason, I had to change the structure of the labels because before I had one label and I changed the text (which, actually, wasn't performing better than creating a new label).

But it wasn't working yet, the text was written backwards, so there was still something I was missing. There was no possibility of changing it in the label. I was surprised I couldn't find in internet any solution for this, what, in my opinion, should be a common problem. Maybe I'm loosing my ability of search in google and find an answer in Stackoverflow.

The solution was given to me by my good fairy, Alejandro, with a Wikipedia article about RLM and the wonderful unicode codes. It was like magic, just inserting \u200f at the beginning of the Arabic text and the problem was fixed. Checking whether a text is correct or not is king of fun when you don't even know the language.

For short, what did I do to insert text in Arabic in Cocos2D?

1. Write in a string the text starting with the rlm unicode mark at the beginning.
2. Create a label with the correct align.
3. Add the label to the corresponding layer

	NSString *text=@"\u200fمرحبا! هذا هو اختبار لمادة من بلدي بلوق";
	CCLabelTTF *myLabel = [CCLabelTTF labelWithString:text dimensions:sizeTextBox alignment:UITextAlignmentRight lineBreakMode:UILineBreakModeWordWrap fontName:@"Arial" fontSize:10];
	[self addChild:text];

view raw gistfile1.m hosted with ❤ by GitHub

Only three steps and very easy, isn't it? I hope this helps anyone with the same problem