Tom Clarkson

I am a software developer based in Sydney, Australia.

I spent many years as a SharePoint consultant, but now focus on building HTML5 and iOS apps.
Issue Unity
An app for working with issues across multiple projects on GitHub and Bitbucket.
Chondric JS
A lightweight JavaScript MVC framework for use with jQuery Mobile
A library for building SharePoint sites using clean, strongly typed code rather than complex and fragile configuration files
See more on github
Automating app icon and splash screen creation
Using PhantomJS to turn html or svg into a full set of iOS app icons and loading images
Developing with an iPad - One week in
General impressions after developing on an iPad for a week
Developing with an iPad - CodeMirror
Setting up CodeMirror and adapting it for iPad use
Developing with an iPad - beyond the code
The text editor isn't everything
Developing with an iPad - using the on-screen keyboard
Initial impressions from writing code with the iPad's on-screen keyboard.
Full Archive

Fixing the PhoneGap / Cordova Splash Screen

20 April 2012

I have a couple of PhoneGap / Cordova apps which have developed to the point where the little details matter. One of those little details is the annoying 20px jump when the standard iOS loading image is replaced with the Cordova splash screen which covers the web view while HTML is loaded.

I have written a patch that repositions the standard splash screen, but for more immediate use, the below code fixes the issue without requiring a custom build of the library.

Gist - PhoneGap / Cordova Splash Screen Fix

Most of the code is copied from CDVViewController - showSplashScreen to override the base class version and a bunch of private methods that are called from showSplashScreen.

This is kept as close as possible to the base class version. A new view splashView takes the place of the imageView from the base class, which is read only. The real change is the adjustments to - the image needs to be moved out from under the status bar, and it moves in a different direction for each orientation.

Note the use of if (self.splashView != nil) return; at the start of the method. This is necessary because the base class checks for the presence of imageView, which is no longer used, and calls the method twice - without it you get two splash screens, only one of which can be hidden.

The standard splash screen with automatic hiding will not be used, so hiding the splash screen requires an extra step in AppDelegate:

hideSplashScreen is an optional custom method - splashview.hidden=YES; would also work, but a fade looks nicer.