A response to Part 2 of the “iPhone vs Windows Phone 7 Challenge”

Readers of my previous post will recall that I’ve been following along with Shawn Burke’s posts as he explores porting Apple’s iPhone Development Tutorials to the Windows Phone 7 development environment. We previously examined his look at the “Hello World” example, showing that despite the claims, it’s just as easy on iPhone as WP7. Here, we explore the second in the series: the “Move Me” example. I doubt I’ll do this for every post, but so far, it’s been an interesting couple of hours.

As before, the example rather falls over by being a comparison of “iPhone Best Practice Tutorial” versus “Ad-hoc implementation”. As I mentioned previously, the Apple tutorial series are designed to showcase development concepts, not necessarily the fastest way to achieve the goal of the sample application. This should not be read as saying the post is bad – it’s an interesting comparison in the differing development philosophy of WP7, wherein the majority of MoveMe can be created declaratively in XAML. Cocoa doesn’t have a similar UI DSL, and one can’t deny the power of the Blend/WPF combination; it made the example trivial. It is, however, probably fair to point out that Expression Blend is not part of Visual Studio (RRP $599), and that UIKit, Interface Builder and Core Animation make this specific task pretty simple on the iPhone as well.

It’s claimed that WP7 needs 5 (6 with a correction), versus more than 100 for the iPhone. We’re not going to beat 6 (typed) lines of code, but we can do a lot better than the claimed 100. By using a custom UIButton configured in Interface Builder along with Core Animation’s implicit property animations, we can achieve the result in 20 lines – with most of the work going into building the bounce animation. If we didn’t want the bounce, 8 lines would do the job. In the following, the only typed lines were the bodies of the functions and the #import statement for QuartzCore. Interface Builder generated the event handler stubs, instance variables and hooked up all the events for us.

#import <QuartzCore /QuartzCore.h>
#import "MoveMeViewController.h"

@implementation moveMeViewController

- (IBAction)touchDown:(id)sender {
    [UIView beginAnimations:@"scale" context:nil];
    button.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.1f, 1.1f);
    [UIView commitAnimations];
}

- (IBAction)touchUp:(id)sender {
    CAKeyframeAnimation *bounceAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

    CGMutablePathRef thePath = CGPathCreateMutable();
    CGPathMoveToPoint(thePath, NULL, button.center.x, button.center.y);

    int overrun = 10;
    CGPoint pos = button.center;

    while (overrun--) {        
        pos.x = [self view].center.x + (overrun % 2  ? 1 : -1) * (pos.x - [self view].center.x) * overrun / 10.0;
        pos.y = [self view].center.y + (overrun % 2  ? 1 : -1) * (pos.y - [self view].center.y) * overrun / 10.0;

        CGPathAddLineToPoint(thePath, NULL, pos.x, pos.y);
	}
	
    bounceAnimation.path = thePath;
    bounceAnimation.duration = 1.5;
    
    CGPathRelease(thePath);
    
    [UIView beginAnimations:@"scale" context:nil];
    button.transform = CGAffineTransformIdentity;
    [[button layer] addAnimation:bounceAnimation forKey:nil];
    [UIView commitAnimations];
    
    button.center = [self view].center;
}

- (IBAction)touchDrag:(UIControl*)c withEvent:(UIEvent*)event {
    button.center = [[[event allTouches] anyObject] locationInView:nil];
}

@end

The WP7 development magic here is really in Expression Blend – creating the XAML by hand would be around 60 lines of XML. I’m not a XAML expert, but examining the provided code, there’s no specific entry for “Bounce” – the effect seems to be being created by a combination of translations and easing functions. Creating it by hand would, I’d wager, be pretty tough – as hard as it was for me to write the above simple code. Therefore, what we really lack on the iPhone side is a tool or version of Interface Builder that obviates the need for the “bounce” code above. Of course, the code hacked together for the above could be factored into a category on UIView (similar to .net Extension methods) that adds “Animate with fancy effects” method. We could then, on any UIView, call something like

  [button addAnimationFromPoint:a toPoint:b withEffect:BounceEffect];

So, again, the developmental legwork difference for this example isn’t as large as was suggested. To specifically correct the list of concepts that one needs to code by hand on the iPhone:

  1. Drawing Images: No need, Interface Builder will set this up for us.
  2. Drawing Text: Again, handled by IB.
  3. Handling touch events: Nope, both created and hooked up via IB.
  4. Creating animations: Yes, we need to indicate we want animations in the code.
  5. Scaling animations: No – comes for free with CA’s implicit animation system.
  6. Building a path and animating along that: Yes, and this is a pain in the neck.

I suppose it’s hard to argue that in some sense, the WP7 development was not “easier”, certainly for a novice or graphical designer. For an experienced developer, especially one who writes suitably reusable code, I’d argue that it’s pretty much a wash.

Edit: Dear me, I’m truly awful at missing “not” from my writing – For those who read the previous version, let me make it clear I was not saying the post was bad, nor was I saying the WP7 development was harder than the iPhone.

Comments are closed.