iOS 8 Popover Presentations

Popovers are finally(!) possible on iPhone on iOS 8. The catch is that by default, they get presented modally over the full screen — not exactly what I’d call a ‘popover’.

Native popover presentation on an iPhone

Thankfully it’s easy to force the presentation to be an actual popover. UIPopoverController is pretty much a thing of the past. With iOS 8 you just present a view controller with a popover presentation style which is a new Adaptive Segue available in Xcode 6.

How to do it

Firstly, your view controller that’s presenting the popover should implement the “ protocol.

Next, you’ll need to set the popoverPresentationController’s delegate.

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // Assuming you've hooked this all up in a Storyboard with a popover presentation style
    if ([segue.identifier isEqualToString:@"showPopover"]) {
        UINavigationController *destNav = segue.destinationViewController;
        PopoverContentsViewController *vc = destNav.viewControllers.firstObject;

        // This is the important part
        UIPopoverPresentationController *popPC = destNav.popoverPresentationController;
        popPC.delegate = self;
    }
}

And finally, implement this one little delegate method.

- (UIModalPresentationStyle)adaptivePresentationStyleForPresentationController:(UIPresentationController *)controller {
    return UIModalPresentationNone;
}

Quick tip for developers who use OS X

Quick tip for developers who use OS X

On 25 July, 2010, I saw a Daring Fireball link to a Superuser page with a growing collection of Terminal Tips and Tricks for Mac OS X.

I followed the link and figured I’d contribute a little tip I’d discovered at some point:

You can hold option and click a position in the current line to move your cursor to that position.

Years went by and a couple of days ago I saw a familarly-phrased tweet retweeted in my timeline:

Today when I woke up and skimmed through the front page of Hacker News – a “Quick tip for developers who use OS X” caught my eye:

OSX Terminal: hold option and click a position in the current line to move your cursor to that position. #yearslost

It’s truly amazing how small the Internet can be sometimes.

Improving Scrolling Performance of Circles on iOS

Hint: Don’t use view.layer.cornerRadius.

Circular avatars are all the rage lately, with even Apple adopting them for contacts in iOS 7.

There’s a very easy way to make a circle from a UIImageView (and in fact, any UIView).

// ...
    [self.imageView setImage:user.avatarImage];
    [self.imageView.layer setCornerRadius:view.frame.size.width/2];
// ...

However, this is very slow if you’re planning to use it for something like a list of avatars in a UITableView. You’ll notice jittering/stuttering even on an iPhone 5.

A much faster way is by masking the image.

// ...
    [imageView setImage:[self maskedAvatarFromImage:user.avatarImage]];
// ...

- (UIImage *)maskedAvatarFromImage:(UIImage *)image {

    // set up the drawing context
    CGRect imageRect = CGRectMake(0, 0, image.size.width, image.size.height);
    UIGraphicsBeginImageContextWithOptions(imageRect.size, NO, 0);

    // set up a path to mask/clip to, and draw it.
    UIBezierPath *circlePath = [UIBezierPath bezierPathWithOvalInRect:imageRect];
    [circlePath addClip];
    [image drawInRect:imageRect];

    // get a UIImage from the image context
    UIImage *maskedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return maskedImage;
}

You could also use an image asset as a mask, but I haven’t found that there’s a significant performance difference between the two.

SmoothAnchors jQuery plugin

Most web browsers now use smooth scrolling when you hit spacebar or use the page up/down shortcuts. I like this behaviour because it helps you keep your bearings as you navigate through a page — but for some reason modern web browsers don’t animate to internal anchor locations and insist on skipping straight to them.

To extend this to anchor links, I’ve written a jQuery plugin to easily add smooth scrolling to all anchored locations on a page with no need to make any changes to your markup.

The plugin is really easy to use. You just include the .js file and initialise the plugin like this:

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="SmoothAnchors.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $().SmoothAnchors();
    });
</script>

If you’re using jQuery 1.7+, the plugin will use the jQuery .on() function to work with links that have been added after the plugin has been initialised (i.e. if you’re dynamically adding content to your page).