iPhone SDK In App Social Links

30/03/2010

Screenshot2010-03-29at23.33.19.XD06TIrloGSP.jpg

Whilst we consider ourselves late on the ‘social’ scene, we have decided to add twitter and Facebook links, to us, from inside our apps only. We wish to do this with a small f and a small t button, generally on the about page. See the screenshot of our favorite 1-day project, SavingsGoal.

For usability, we didn’t simply want to just link to the URLS, first closing the app and then opening safari. We wanted to provide a good in app experience. This is why we chose to use PWWebViewController by matthiasplappert. This project creates a new view with a WebView all as a control. So the resultant code is only a few lines.
The result is a in app modular popup, which opens the facebook page, from within the application.

For the twitter button we could have done this too. But we had found something better. Oliver (aka @Dr_Touch) did a pretty nice twitter follow button code piece, which infact detects if any twitter client is installed on the iPhoneOS Device and then opens the twitter page for that user. It has a safe fallover, such that if no twitter client is installed, it then opens twitter.com in a webview.
Note: We did’t want the twitter link to open up straight away, we also wanted to alert the user that they are being taken out of the application.

The post for this code is at : http://www.drobnik.com/touch/2010/02/making-a-follow-us-on-twitter-button/

But of course, this post wouldn’t be complete without a code-sample! So this is how I wrote the social integration buttons, for our apps.

Firstly, add the following projects, and the #includes too.

Inline-Web-Browser: http://github.com/matthiasplappert/iPhone-Inline-Web-Browser
Olivers Twitter Code: http://www.drobnik.com/touch/2010/02/making-a-follow-us-on-twitter-button/

#import “PWWebViewController.h”
#import “deHelpers.h” //Note: This is a method which just has the above code by Oliver.

Then in viewDidLoad, I initiate the strings. Obviously you should change these to what ever you wish.

- (void)viewDidLoad {
//…
//Internet Links
websiteURL = @“http://apps.duivesteyn.net;
supportEmail = @“apps@duivesteyn.net;
facebookURL = @“http://www.facebook.com/apps/application.php?id=107880612574963;
twitterURL = @“de_applications”;
}

Then add the IBActions for the buttons:

#pragma mark -
#pragma mark Social Buttons

-(IBAction)openLinkFacebook{
[FlurryAPI logEvent:@“Pressed Link: Facebook”];
url = [NSURL URLWithString:facebookURL];
[self openURL];
}

-(IBAction)openLinkTwitter{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@“Twitter” message:@“Do you want to be taken to our twitter feed? \n\nThis will close the app.” delegate:self cancelButtonTitle:nil otherButtonTitles:@“No”,@“Yes”,nil];
[alert show];

}

- (void)alertView: (UIAlertView *)alertView clickedButtonAtIndex: (NSInteger)buttonIndex
{
NSLog(@“in alertView action, buttonIndex: %u”,buttonIndex);

if (buttonIndex==1) {                 NSLog(@“Open Twitter”);
//This is the Dr_Touch twitter follower code. I have just put it in a separate class, and I am calling it from there.
deHelpers *dehelper = [[deHelpers alloc] init];
[dehelper openTwitterAppForFollowingUser:twitterURL];

}
}

-(void)openURL{
NSURLRequest *request = [NSURLRequest requestWithURL:url];
PWWebViewController *webController = [[PWWebViewController alloc] initWithRequest:request];

UINavigationController *navigationController = [[UINavigationController alloc] initWithRootViewController:webController];
UIBarButtonItem *cancelButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel
target:self
action:@selector(dismissModal)];
webController.navigationItem.leftBarButtonItem = cancelButton;
[cancelButton release];
[self presentModalViewController:navigationController animated:YES];         [navigationController release];

}

- (void)dismissModal
{
[self.modalViewController dismissModalViewControllerAnimated:YES]; }

And thats it for the code. Don’t forget to add the buttons to interface builder and then link the IBActions.

Hope you find it useful!

.

No comments yet.

Write a comment:

blog comments powered by Disqus