Sharing games on social media is very common these days. Our game will not be an exception to that. It's not only an effective marketing tool for your game, as users promote the game for you on their social media pages, but also a great way for engagement to rise, as humans love competition. Being able to share and compare their scores (and indirectly compete) makes users want to play the game even more, which makes it a win-win situation for both the developers and players.
The easiest way to integrate Facebook, Twitter, messaging, e-mail, and other sharing options is through the UIActivityView
object. It's the same sharing you'll see when you press the button in the bottom-left corner of the photos app.
Basically, all we need to do is tell the ActivityView
object what we want to display and what activity types we want to exclude, and then present the view controller over the CCDelegate
.
First, we need to create the Share button.
In GameOverScene.m
, add the following block of code to the initWithScoreData
method. This will create a Share button at the bottom center of our game over screen:
//add share buttons CCButton *btnShare = [CCButton buttonWithTitle:@"" spriteFrame:[[CCSpriteFrameCache sharedSpriteFrameCache] spriteFrameByName:@"btnShare.png"]]; [btnShare setTarget:self selector:@selector(openShareView)]; btnShare.position = ccp(winSize.width/2, winSize.height * 0.1); [self addChild:btnShare];
Then, create the method that the share button will call when it is pressed (this must be added now, or else the game will crash when you reach GameOverScene
):
-(void)openShareView { }
Run the game, and when you get to the game over screen, you'll see the share button in the bottom center. Right now, it doesn't do anything, so let's display the activity view.
We need a way to track the player's current score and the score of the most recent play. Even though we can pass that information to the game over scene, unless we store that value in an instance variable, we won't be able to use it in our sharing.
So, in GameOverScene.h
, add a variable for the current score, like this:
@interface GameOverScene : CCScene <CCTableViewDataSource> { CGSize winSize; NSArray *arrScores; NSInteger highScoreIndex; //add this: NSInteger numCurrentScore; }
Then, in the initWithScoreData
method, we add the following line so that we can grab the total score that was passed to the scene:
numCurrentScore = [dict[DictTotalScore] integerValue];
Now we're ready to actually use the score in the text that we share.
In the openShareView
method you just created, add these few lines of code (explanation afterwards):
NSString *textToShare = [NSString stringWithFormat:@"I scored %d in MathGame! See if you can beat me!",numCurrentScore]; NSString *appID = @"123456789"; //change to YOUR app's ID NSURL *appStoreURL = [NSURL URLWithString:[NSString stringWithFormat:@"https://itunes.apple.com/app/id%@", appID]]; NSArray *objectsToShare = @[textToShare, appStoreURL]; UIActivityViewController *activityVC = [[UIActivityViewController alloc] initWithActivityItems:objectsToShare applicationActivities:nil];
First comes the text that we're going to display. We need to keep it short for a few reasons. The most important reason is that Twitter allows only 140 characters, so we need to make sure we don't cross that. The second reason is that our potential future players might not read it if it's longer than a sentence or two. Finally, we want the generic message that's going to be sent to at least feel personal. It has to be like reading a conversation between two best friends.
Next is the link to the App Store, which also takes in the app's ID. Notice the appID
variable is just 1
through 9
. This isn't the exact app ID at the moment (not even for the book's project), so what we're going to do is modify this line of code when we create the app in iTunes Connect (or if you already have an app created, you can use that app ID now).
After that is the array of objects to be included in the share. Simply add them to an array.
Finally, we create the UIActivityViewController
object with the objectsToShare
array.
But it's not yet displaying anything, so let's handle that.
After you've initialized the activityVC
variable in the openShareView
method, add the following block of code. It will ensure that the activity view doesn't show certain activities, and then present the view controller over the shared CCDelegate
:
NSArray *excludeActivities = @[UIActivityTypeAirDrop, UIActivityTypePrint, UIActivityTypeAssignToContact, UIActivityTypeSaveToCameraRoll, UIActivityTypeAddToReadingList, UIActivityTypePostToFlickr, UIActivityTypePostToVimeo]; activityVC.excludedActivityTypes = excludeActivities; [[CCDirector sharedDirector] presentViewController:activityVC animated:YES completion:nil];
Since we don't want the user to print anything, assign anything to a contact, or add it to their reading list (Flickr, Vimeo, and so on), we need to exclude these activities, which basically means they won't show up on the view that appears when the user taps the share button.
This is a list of all the possible UIAcitivityTypes
:
UIActivityTypeAddToReadingList;
UIActivityTypeAirDrop;
UIActivityTypeAssignToContact;
UIActivityTypeCopyToPasteboard;
UIActivityTypeMail;
UIActivityTypeMessage;
UIActivityTypePostToFacebook;
UIActivityTypePostToFlickr;
UIActivityTypePostToTencentWeibo;
UIActivityTypePostToTwitter;
UIActivityTypePostToVimeo;
UIActivityTypePostToWeibo;
UIActivityTypePrint;
UIActivityTypeSaveToCameraRoll;
So, for your own projects, feel free to include or exclude as many or as few of these as you wish. For example, if you're sharing a video, you can very easily allow Vimeo or saving the photos.
That's it! If you run the game at this point and click on the Share button, you'll see the activity view pop up, along with the various buttons for messaging, e-mail, Facebook, and Twitter. Clicking on any of these will load the respective view, along with the message and URL that was added.
Here's what the final version looks like:
Even though we're adding some text and including a link to the game on the App Store, we should probably also include a screenshot because it's more likely someone will at least check out the game if there's a screenshot attached.
That being said, we don't really want a screenshot from the game over screen, so we'll have to grab a screenshot of the game right before we transition to GameOverScene
.
So, open up MainScene.m
and add the following method. It will take a screenshot of the game:
-(UIImage*)screenshot { [CCDirector sharedDirector].nextDeltaTimeZero = YES; CCRenderTexture* rtx = [CCRenderTexture renderTextureWithWidth:winSize.width height:winSize.height]; [rtx begin]; [[[CCDirector sharedDirector] runningScene] visit]; [rtx end]; return [rtx getUIImage]; }
Then, in the endGame
method, let's call the preceding method and store it in a local variable so that we can pass it to the GameOverScene
data:
UIImage *image = [self takeScreenshot]; NSDictionary *scoreData = @{DictTotalScore : @(numTotalScore), DictTurnsSurvived :@(numTurnSurvived), DictUnitsKilled :@(numUnitsKilled), DictHighScoreIndex :@(hsIndex), @"screenshot" : image};
Notice the addition of the @"screenshot"
key to the scoreData
dictionary. This will pass our UIImage
so that we can grab it in GameOverScene
.
Next, in GameOverScene.h
, add a variable for the screenshot, like this:
@interface GameOverScene : CCScene <CCTableViewDataSource> { CGSize winSize; NSArray *arrScores; NSInteger highScoreIndex; NSInteger numCurrentScore; //add this: UIImage *screenshot; }
Then in our initWithScoreData
method in GameOverScene.m
, we want to store the screenshot in the variable from the dictionary using the @"screenshot"
key:
screenshot = dict[@"screenshot"];
Finally, in our openShareView
method of the game over scene, all we need to do is add the screenshot variable to the objectsToShare
array, and it will be automatically included:
NSArray *objectsToShare = @[textToShare, myWebsite, screenshot];
And that's it! By running the game now and getting to the share button, you'll see the image, whether you share via Facebook, Twitter, messages, or e-mail.
Here's what your game looks like with the screenshot added (sharing via Facebook):
3.147.77.208