Cory Wiles Blog

If You Blog It They Will Come 
Tags


Filed under

iphone

 
June 23, 2010

JandB Photo App Officially Launched

The past three months I have been working on an iPhone app for a local photographer John Childress.  Like most great iPhone apps, the idea that John had dealt with a concept that would:

  1. Get him iPhone app market for his business
  2. Provide a new value-added service to his customers
  3. Providing a new form of media to promote his business to potential new customers
In doing research for the app he and looked at a lot of other photo gallery viewing apps in the App Store to see what features dominated and most importantly what could he offer that others didn't.  Currently, after you have a photo shoot John will send you a gallery code and you can then view the flash slideshow on his site.  There are few issues  with the "mobile" market that we all live in now.  The first is you can't view flash on the iPhone so trying to view your photos on the phone and show them off to friends and family is not possible.  Rewriting his gallery website to be non-flash would be a good idea, but the system is currently in place and is integrated with his core business aspects.  The other roadblock that he runs into is that most people want to view slides shows with a soundtrack. 

*I think I just heard the RIAA scramble to call their lawyers for a lawsuit just for a business thinking of doing that*

With the JandB Photo app, which is a free download, users can add a gallery to their phone and enjoy the slideshow of images with an optional custom soundtrack from tracks on your phone.  Want to share a picture on Facebook?  Not a problem that feature in there as well.  Want to view current specials that John is offering, there is a place for that.

What I really love about the app from a consumer point-of-view is that it is simple and straightforward.  There is not guessing about what to do.  A specific task is performed in the least amount of steps.  You don't have to think.  From a developer's point of view this app was one of the more challenging apps I have done and learned a lot.  The app uses two complex frameworks.  Three20 and Google's objective-c framework.  Though integrating these components took sometime and I went through a few glasses of wine for support, both saved me COUNTLESS hours of custom development.

Three20 Modifications
Apple should really be THANKING @joehewitt for this work his creation of the Three20 framework.  Especially the photo gallery/viewer components.  If it wasn't for Three20 then I am sure that developers would be rioting outside of 1 Infinite Looper Cupertino, CA for the lack of such important piece of built-in functionality.  With all it's glory though I did have to make some modifications which include integration of posting an image to Facebook and adding in the ability to play an playlist that is associated with the gallery.  Unfortunately, and I plan on working on this soon, I had to modify the core source which to be frank felt dirty.  I just didn't have time to write classes extensions and categories for the gallery controller and viewer controller.

Google Objective-C Library
Man there really is a lot going with this library.  Everything and the kitchen sink.  When scouring through the wiki page for this I didn't see a lot of really good iPhone examples, but I was able to piece together what I couldn't figure out from their Mac example to modify a document and worked without a problem.  My only real disappointment with this library is that there, IMHO, waaaaaay too many delegate methods and callbacks.  With that being said I do understand why. Google gives you granular control of the content, metadata, revisions, ALC, etc. and objective-c is verbose so the end result is a lot of code to accomplish what I need which was: lookup a document by a given name, grab the latest revision, insert text at the end, close/save the document.

All in all I am very happy with the app.  The first few future releases will mainly deal with performance.  I still feel that I could squeeze some more performance on parsing through the images on the server side and optimize the network calls on the phone.  After that some UI tweaks. To me the gallery listing could be a little prettier.  Most importantly any enhancements that users want to see.  Feedback is always welcome.

Head over to the App Store and check it out.  If you want a check another gallery besides the default, then use "McKinna", without quotes.  Shameless plug for my daughter.

Loading mentions Retweet
Filed under  //   app   google   iphone   jandb photo   photos   three20  

Comments [1]

June 19, 2010

How to Create SMS Ballon iPhone Table View

I was working on incorporating an "sms ballon" type view for a client and while doing some research on the best, and different, ways to implement the functionality I came across a great tutorial, but thought it could be cleaned up just a little bit which should make your FPS increase and I fixed some memory leaks.  I wasn't able to run any performance tests on it so I would welcome ANY feedback how to improve the code.

The key to making the "ballon" background grow and shrink based upon the amount of text is using:

UIImage *balloon = [[UIImage imageNamed:self.imgName] stretchableImageWithLeftCapWidth:24 topCapHeight:15];

If someone has any advice on how to make the font look better please let me know.

Loading mentions Retweet
Filed under  //   example   iphone   sms ballon   tutorial   uitableview  

Comments [0]

June 16, 2010

UILocalNotification Example Project Using iOS4

One of the greatest new features that is included in iOS4 is the power that developers have to deliver local notifications.  At the time that the first beta was released in April I was writing specs/requirements and project timeline for a potential app which would have ended up taking me about 5 months to develop.  A large part of the project schedule dealt with having to setup/maintain user reminder preferences...the number of reminders, frequency of each one, time zones, etc.  I tried to think of ever solution that I could that didn't involve the server component, but there really wasn't any other way.

UILocationNotification to the rescue.  After looking over the API docs, Apple had provided exactly what I needed and I was able to cut out 2.5 months from the project schedule because of it.

I was able to create an POC app using UILocationNotifications in literally 5 minutes.  It involved two easy steps:

 

  1. In the app delegate class I added the following method to verify that the event was fired off if the app was running. -(void)application:(UIApplication *)application didReceiveLocationNotification:(UILocationNotification *)notification;
  2. In the -(void) viewDidLoad method of my controller you alloc/init a new UILocationNotification object, set the fireDate which is an NSDate object, what time zone you want, what the notification message(body) should be and then add the UILocationNotification object to the UIApplication scheduleLocalNotification method

 

There are two possible end results.  The first being that the event is fired off while the app is running in which case you will not see anything. Hence, why I added the NSLog to the didReceiveLocationNotification method.  The second is if you close the app before the notification has fired and in that case you will receive the alert box with your message.

Download XCode Project

Note: This was compiled with iOS4 GM and tested on iPhone 3G/3GS

Loading mentions Retweet
Filed under  //   example   iphone   projects   tutorials   UILocationNotification  

Comments [1]

May 4, 2010

Facebook Graph API with a Native iPhone Application

One of the biggest gripes that I have with working with the FBConnect iPhone SDK, and really the Facebook API, in general was having to deal with a very inefficient REST implementation.  Callback after callback, protocol after protocol, major bugs (that have yet to be fixed as far as I know), and my biggest issue is the nasty user experience having to login a user.  I was very excited to hear when last month Facebook announced they had came out with a new API that would allow great security, ease and flexibility.  The pains of having to go through currently working functionality and refactor the code to accommodate the new features wasn't too much of a problem for me because it would mean a reduced code set on my part and I would be able to get rid of the Facebook Connect SDK.  I set out to test my theories and functionality via a quick web app.  No problems.  Then I proceeded over to my native iPhone app.  EraseUrX v2.0.  The new authentication mechanism utilized in Open Graph is OAuth2.0.  While many of the headaches and complexities of using OAuth are addressed and the documentation for using it in a mobile web app are well documented with Facebook they TOTALLY dropped the ball on providing any direction on using it with a native iPhone app and they don't provide an updated SDK.

I could one of three things: 1. Use the old Facebook Connect which should still work for the forseeable future, but as stated above has too many issues that I don't want to deal with and they could drop support at any moment. 2. Wait for Facebook to publish a new SDK, but how long would it take them 3. Just figure it out myself and have a flexible solution that didn't relay any third party framework.  I went with option 3.

The first thing you need to do is setup your app with Facebook.  Second, you will need to create a "callback" page that Facebook will send the request back to once the appropriate code and token has been given to your original request.  Third, once you have gotten the access_token from Facebook then you need to put it in a DOM object. This is important so that you can retrieve it via the UIWebview's javascript string evaluation and then finally save the access_token in NSUserDefaults for any subsequent requests.  In my case I wanted to get a list of the currently logged in friends.  Instead of having to go through the callbacks and delegate methods associated with the FBConnect SDK I now have user's login via OAuth and I make a call to, https://graph.facebook.com/me/friends, and get a JSON response of what I need.  Simple. Beautiful.

Callback Example (PHP):
$token = '';

if ($_GET['code'] !== '') {
} else {
  print "no code";
}

?>
<html>
<title>OAuth Test</title>
<body>
<div id="token"><?=$token?></div>
</body>
</html>

Custom ViewController (I am not including setting up the uiwebview. I assume you already know how to do that):
- (void)webViewDidFinishLoad:(UIWebView *)webView {
  
  /**
   * Since there are a lot redirects then UIWebview delegate methods are called ALOT.
   * Therefore I just want to check and make sure that I am only getting the value when the url has my hostname in it
   */
  NSRange rangeRound = [[[webView.request URL] absoluteString] rangeOfString:@"corywiles"];

  if (rangeRound.length) {

  NSString *authToken = [[webView stringByEvaluatingJavaScriptFromString: @"document.getElementById('token').innerHTML"]
                         stringByTrimmingCharactersInSet: [NSCharacterSet whitespaceAndNewlineCharacterSet]];
    NSLog(@"authToken: %@", authToken);

  } else {
    NSLog(@"no auth token");
  }
}

Loading mentions Retweet
Filed under  //   example   facebook   iphone   oauth2.0   open graph   tutorials   uiwebview  

Comments [18]

April 22, 2010

I Will Not Ride the Dell Lightning

Being that my passion for development and design are usually centered around mobile apps I am always interested in any new platforms and handsets that poised to make any impact on the current market.  As such I was really interested in the article posted over at Engadget yesterday: Dell Lightning: the ultimate Windows Phone 7 device leaks out. However, my enthusiasm faded after the first sentence and twindled down to zero by the end of the first paragraph.

"Hot damn, people. The mother of all Dell leaks just dropped into our laps, and the absolute highlight has to be the Lightning, a Windows Phone 7 portrait slider."

I can overlook the fact that the device is running Windows and some of the on screen usability issues because I haven't used one, but what bothers me the most is that handset manufactures can't seem to understand handset design.  This phone is presented as having a "revolutionary" device design, but once again you have the same tired, inefficient slide-the-handset to show the qwerty keyboard.  Really?! That is the best you have. That is NO different from all the other handset designs that are offered by ever manufacturer in the world for the past 5 - 10 years.  Dell and Microsoft combined have more money than most European countries.  Why they don't or can't find/recruit/steal the BEST designers and developers to come out with a real competitor to the iPhone is beyond me?  However, what this does mean that within 6 months of this device launching you will see it sitting next to the Dell MP3 player that was supposed to be so great.

Looking over some of the other features that the device offers, once again there is nothing that I can't get, and probably better, with an iPhone or Nexus One.

::NOTE::

When I was attempting to find a link to the dell jukebox from their website it didn't come up.

Loading mentions Retweet
Filed under  //   apple   dell   design   gadgets   iphone   microsoft   mobile   nexus one   phones  

Comments [0]

April 15, 2010

To Kill A Mocking Bird Called "Your Twitter App"

Over the past week there has been quite a bit of news coming out of the Twitter HQ. First it was announced that Twitter has acquired Tweetie and subsequently hired it's author Loren Brichter.  They also have launched the promoted tweet service and for you real bird watchers out there the ability to add meta data to tweets using the API.  Finally, it was confirmed that Twitter is going to launch their own URL shortener and stop using bit.ly.  A recently published article on Mashable summaries one tech startup's frustration with the announcement of Twitter now coming out with it's own "official" Twitter client. Why is there so much frustration? Because developers, at times, feel they have been sabotaged by the very companies they are using.  Just to be clear, they are upset because a service that Twitter owns, that they allow developers to use for free, is now being used by the very company that created it in the first place to promote their own brand!

I'm just saying...

I am developer and know what it is like to have that great idea or great app and to have some MUCH bigger/better company come along and launch their own version which inevitably kills mine before it got off the ground.  However, those are the ropes.  Don't put all your "1"'s and "0"'s into one app or service.  That goes for everything in life.  This animosity towards Twitter, and any other information service, is quite misdirected.  As mentioned earlier, Twitter didn't go out and build their own app, they chose, quite possible the best Twitter client in the AppStore today.  Did developers really expect Twitter to NOT have an official app.  I am surprised it has taken them this long.  That is like Apple releasing the iPod, but not iTunes.

What does that really mean? If you create something that is TRULY great then there is a good possibility that it will get picked up.  Just look at all the startups and other mashups that have been acquired by big companies lately. Twitter has just released a site for developers that will aid the creation of new mashups and services to use with the information they provide not hinder innovation.

It is an unfortunate price that one has to pay when the service you rely on for your mashup comes out with their own official app that does the same thing and my sympathies are definitely with you, but if all you do is rely on that ONE great idea then you weren't going to last that long anyway.

Loading mentions Retweet
Filed under  //   iphone   mashups   twitter  

Comments [0]

April 12, 2010

Creating Custom Glossy Gradient Buttons Programmatically

As my experience, and hopefully skill, in iPhone development has matured over the past year and half I am in the constant search for the best techniques for my apps to run better, faster, and consequently more efficient.  Of the top developers that I follow they all make references to the importance of utilizing subclasses of UIViews and the underlying subsets of views in general.

I love the UI elements that are used on the phone. I didn't realize the awesome power of CoreAnimation and the flexibility that it gives you to manipulate and create graphics as such a granular level.  I set out to see if I could recreate a common iPhone UI element completely programmatically: a glossy gradient button that still responds to touch events.

The end result was a success and a great learning experience.  I still need to add in more testing to make sure that interacting with all these views is more efficient than interacting with standard pngs.

This biggest issue that I ran into was "re-enable" the button actions.

Simply subclassing UIButton did create a problem when dealing with the UIControlEventTouchUpInside/UIControlEventTouchUpOutside methods that you associate with buttons.

I was able to overcome this issue by implementing the touchesBegan and touchesEnded methods.  Remember...UIButton inherits from UIControl, which in-turn inherits from UIView.

Problem solved.

Download Project

Loading mentions Retweet
Filed under  //   coreanimation   example   iphone   tutorials   uibutton   uiview  

Comments [0]

March 30, 2010

Turn by Turn Directions with MapKit and Google Maps

Update - 03.31.2010

I decided that I didn't like the accuracy of the location from the browser.  It is isn't as good as the MapKit or default Google Maps app on the phone.  I added a button the directions page to open default maps application.

One of the best features used in Google Maps is the turn-by-turn directions.  Unfortunately, I haven't seen, and don't even know if it exists without proprietary code, an effective way to show turn-by-turn directions using the MapKit API in the iPhone SDK.  Though Google announced that they have included it in their Android platform they were vague about if/when it might come to the iPhone SDK.  No matter, where there is CoreLocation there is a way.

Goal
Most smaller companies only have one "brick and mortar" location.  So I wanted to show that location on the map and then present the user with ability to get turn by turn directions to their location.  In my example app the marker will show the location of my favorite sushi place in Memphis, Sekisui's Pacific Rim.

Obstacles
No clear way to implement turn-by-turn directions with MapKit using the iPhone SDK.  Though Safari for the iPhone has the ability to get your current location via the browser, i wasn't very impressed with it's accuracy.

Solution
Use CoreLocation to get the user's lat/long and then pass that to a UIWebView that will display a Google Map with directions.  Though in this example I am using a local html that is stored on the phone a better implementation would be to have the file stored remotely and then cached on the user's phone for faster load time.  However, it is important to note that you should "decache" the file if the user's previous coordinates are different then their new current location.

Note
For the best results and accuracy it is better to run this on your device since CoreLocation the simulate will show Apple's headquarters as the user's location.

Loading mentions Retweet
Filed under  //   corelocation   googlemaps   mapkit   example   google   iphone  

Comments [0]

March 29, 2010

UIViews with Rounded Corners and Animations

One of the best iPhone reference books on the market today is iPhone SDK Development by Bill Dudney and Chris Adamson, published by Pragmatic Programmers.  The examples are real-world, easy to follow and cover just about any area of development that one needs.  In my earlier projects and example code I tended to use a lot of graphics for buttons and backgrounds because I need something with rounded corners and/or a gradient.  However, in my latest project I have wanted to get away from that and utilize CoreAnimation and more UIView drawing techniques and the results have been outstanding.  Load time on my views are much faster because all the drawing and rendering are done on the compiled view level and not from the rendering of an image.

 I created a sample project that loads a three different views onto the controller and animates them.  There is nothing overly complex about the code at all and can be customized to be more configurable, but is written to show the power and flexibility of creating custom views and animations.

::NOTE::
The rounded corner drawing in the project was sample code from the iPhone SDK Development Book.  Credit where  credit is due to Bill and Chris.

As always I encourage anyone who downloads the project to make any modifications and/or enhancements.  For example, you could add in the functionality of firing of the animation based upon text field values or randomizing the speed of the animation.

Loading mentions Retweet
Filed under  //   books   coreanimation   example   iphone   uiview  

Comments [1]

February 26, 2010

Displaying Data on the iPhone with Index UITableView

It is forgone conclusion that if you need to present a large amount of data with a UITableView then you should do so using an index and index sections.  As with most tutorials that I have read on this topic, the scenarios used got me 80% of the way.  In my humble opinion, the solutions where either over engineered or they didn't apply to my use case.  Hopefully this tutorial/sample project will bridge the gap.

The tutorial that I got the most from is: iPhone Development: Creating Native Contacts like screen.

One of the biggest hurdles that I had to over come, that was different from the contacts tutorial, was that I wasn't using a database and therefore didn't have a predefined sub-result set for each character.  I was having to do the opposite.  I had to iterate over my result set, array of states, grab the first letter from each item, check to see if there was already a dictionary key that existed for that letter and proceed accordingly.

Logic Flow
Iterate over states
Get the first letter of that particular state
Check to see if there is a key in the objectsForCharacter dictionary
   - YES: add the state string to the arrayOfNames array and then set the arrayOfNames to the objectsForCharacter dictionary for the appropriate key
  -  NO: remove all objects from the arrayOfNames array and add the firstLetter to the arrayOfCharacters.  Then proceed on to the above "YES" steps
Once all the states have been "proceed" then reload the table data

Final Model
Though it sounds some what complicated with all the arrays, dictionarys, etc. once you break it down to a visual model then the code is easier to comprehend.

[[objectsForCharacters objectForKey:@"A"] objectAtIndex:0]; // Alabama
[[objectsForCharacters objectForKey:@"A"] objectAtIndex:1]; // Alaska
[[objectsForCharacters objectForKey:@"A"] objectAtIndex:2]; // Arizona
[[objectsForCharacters objectForKey:@"A"] objectAtIndex:3]; // Arkansas

Download Example Project (comments/enhancements are welcomed)
IndexedTable.zip

Loading mentions Retweet
Filed under  //   example   iphone   tutorial   uitableview  

Comments [0]