New splashscreenYesterday was a bad day. Nothing worked, even the backup didn’t work anymore. When I pressed the pause button, the current scene was stopped, but suddenly all visited regions started to play… When I “unpaused” the current scene went on and all other audio was stopped. The second thing was a repeating (2x) error in the playback logic.
The solution…
…came today. It seems as a behaviour of the AVAudioPlayer that it starts already played audiofiles again when unpaused, nevertheless they were stopped with the stop command (which should reset the player’s settings, except the playback position). So, my pause method searched the whole NSDictionary for currently playing files and paused them (no prob), but when I wanted to unpause them, it started all already played files again. So I made the workaround to index paused files into a dictionary (NSIndexSet only works with arrays), to easily access them when I want to unpause them.
The second “bug” was evoked by jumping gps positions. I tried the app at various weather situations and it never happened till yesterday, and then, 2 times in a row…. I’m thinking about a false coordinate handling….

For the layout it tried various things on the splashscreen. With the “old paper” background look through every app view, it has a much nicer look & feel.

MainScreenI made it! Regarding the annoying thing, that when you animate an UIButton, it won’t scale its image without jumps. After some research in the net, lots of people have the same problem, even in apple’s developer forum was no direct solution for that. So I left the UIButton but not the idea and created a custom button inherited from an UIImageview. This custom button implements now 4 UIImages for each state (normal on, pressed on, normal off…), a touch handler to switch images and to trigger an action message to the first responder in an external class. And here we go!

Now, when you press the start button it changes to “running..”. As soon as the phone gets gps fix, the button scales and moves to the position where the pause button was. The pause button meanwhile moves to replace the start button. So you have always the most likely used button for your next playback interaction at one place, and through its appearance “highlighted”.

For the layout I rearranged buttons and symbols and put the header into a frame.

Bild 1Today I updated the layout with texture through the whole application. So I want to give it a more traditional, dusty look. Little fine tuning on controls, fonts, text was done and now… animation. I try to animate the Start button, so it gets smaller and changes place with the pause button. These buttons should exchange places and style each time they get highlighted, depending on application status. Should be easy BUT… As soon as the button scales and moves to its target place, its click region stays at the old place. This means, only the content of a button was transformed but not the whole structure. After a while I found a code to animate properties, which made it possible to move the click region, but guess what, it won’t animate the buttons image…..

Still trying to find an easy solution for that..



This are first layouts for the screens of the “Scratch” application. (1-5 starting from top left to bottom right)

1) Startup screen with title and version number. The title “Scratch” scales and transforms to the place on screen 2. Meanwhile the version number and info fades out and screen 2 fades in.

2) Main screen before starting the play. In its upper left corner (satellite dish) you can switch to gps settings (screen 5). For instructions and additional info there’s a button in the upper right corner to switch to the “about” screen (4).

3) Main screen when the play starts. A smiley indicates gps signal quality, and on its left side you see the name of the currently played scene. This is for debugging at the moment, but after some trials it seems quite handy. In the lower section of the screen, 2 buttons appeared for playback control. I’ll change these buttons because, in my opinion, only one button will do the job of starting gps, pausing and stopping audio. Have to think about it…

4) Is the “about” view with additional info. It appears as an animated sheet over the mainscreen.

5) GPS settings, to set the distance filter value. This screen lacks of design, but maybe it will be removed anyways.

Save settings


I implemented a SettingsImporter class to read and write user settings from/in a file. There are not much data to save, just the value of the distance filter, its on/off switch, and a boolean to show if the program launches the first time to show a disclaimer view.
To store this data into a simple .dat file I used the NSKeyedArchiver (or NSKeyedUnarchiver to read), which makes it very easy to store variables and objects in an architecture-independent format. (Apple reference)
Here some screenshots of code for reading and saving variables:
read data

save data

Today I implemented a zoom transition of the title, starting at startup from the middle of the screen until its on top of the screen, resized to fit as smaller header of the application. First I had to do some research in the documentation, because there are lots of different ways to do an animation. For my purposes a CABasicAnimation was good enough to do the job.
Following a short code snippet (click to enlarge):


(sry it’s a png because I can’t change the font of the code tag which looks TERRIBLE)

The most interesting part for me was to make a translation and a scale in the same animation. I took a while until I got the solution to do a transformation matrix with CGAffineTransformMakeTranslation. In the following line I put a scale matrix on the transform matrix and use it with an easeIn – easeOut on my subview (which can be e.g. UIImageView). And here we go….



StartScreenAfter a modification, now the application loads the xml automatically in the background. So the view with the table list isn’t available anymore. I left it in the background for debug purposes, but won’t be visible in the final version.
Also the standarized navigation bar on the top is not anymore there. It’s replaced now by the title of the play, which I want to be animated at startup (maybe zoom transition from the splash screen).