Show Finger Touches with Reflector or iPhone Demos with TouchPose

Touchpose-iPhone-Screen.png

If you've used Reflector on Mac to create screen recordings or demo videos of your iPhone apps, you're going to want to use this code. I use a lot of gestures and touch input in my apps. To make it easy to see what the user is doing during a video or presentation in my development versions I now use Todd Reed's Touchposé to display the fingers. You can access my fork of Touchposé on github

Note: You can only show touches for code that you have access to. There isn't an option to do this in public iPhone or iPad apps.

Warning: Don't submit the Touchposé code to the App Store, keep it only in your development builds. I'll show you how to prevent accidentally submissions with a pre-processor variable. 

1. In your prefix header file (i.e. .pch file under Supporting Files in Xcode). Add code for a preprocessor variable called "APP_STORE_RELEASE". You'll want to change this value when you need to make an official release.

// Note: Set to 1 when ready to submit app to App Store
// Set to 0 for development and testing
#define APP_STORE_RELEASE 0

 

 Find your .pch file in your Supporting Files folder on the left panel.

Find your .pch file in your Supporting Files folder on the left panel.

2. Drag QTouchposeApplication.h and QTouchposeApplication.m to your project navigator to add it to your project and target.

a. Make sure you copy the files into your destination group's folder.

b. Make sure you add it to any targets that will need to show touch input.

 Check the boxes for "copy items into destination group's folder" and add to your app target.

Check the boxes for "copy items into destination group's folder" and add to your app target.

3. Open main.m under Supporting Files and add code to create the QTouchposeApplication when not building the app for the App Store. (i.e. we don't want to submit private APIs , or Apple will reject the app)

a. At the top add a header #include statement, but only include when not building for the App Store

#if !(APP_STORE_RELEASE)
#import "QTouchposeApplication.h"
#endif

b. In the main method brackets, update the code to be as follows.

#if !(APP_STORE_RELEASE)
return UIApplicationMain(argc, argv, NSStringFromClass([QTouchposeApplication class]), NSStringFromClass([AppDelegate class]));

#else
return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
#endif
 Update the code in main.m to only use the special QTouchposeApplication when not building for App Store

Update the code in main.m to only use the special QTouchposeApplication when not building for App Store

4. Open your AppDelegate and start Touchpose. You can play with the settings so that it's always visible, or only when your mirroring the display for Reflector or projectors.

a. Import the header file for QTouchposeApplication.h

#if !(APP_STORE_RELEASE)
#import "QTouchposeApplication.h"
#endif

b. In application:didFinishLaunchingWithOptions: update the code to show the touches. Typically I keep alwaysShowTouches to NO, unless I'm testing something or recording a video with ScreenFlow.

#if !(APP_STORE_RELEASE)
// For demo purposes, show the touches even when not mirroring to an external display.
QTouchposeApplication *touchposeApplication = (QTouchposeApplication *)application;
touchposeApplication.alwaysShowTouches = YES;
#endif

5. Enjoy!

Checkout my iPhone Game Showing Touches

We're working on a new game for iPhone called Bomb Dodge. We did a limited release that you can download called Protect the Bomb Checkout the video and let me know if the touches help you understand how the game plays.

Wrap-up

  1. Download my sample project or grab the source code from github.
  2. Subscribe to my iPhone newsletter.
  3. Grab Reflector if you don't have it, it's essential for recording demo videos of iPhone or iPad apps.
  4. Checkout my beginner iPhone development course on Skillshare.