Alex Argo
Alex Argo

Reputation: 9020

How do I display all touches on screen in order to demo an iPhone app?

Now that we have display mirroring on the iPad 2 (wired now... wireless coming in iOS 5), is there an easy way to display all touches on screen? This would be useful when demoing an app?

What I am looking for is the ability to just include some SDK, and maybe change a line of code after which all of my touches will be displayed on screen.

I have seen many other ways to demo apps: 1)Using the simulator along with a screen capture tool that will turn your mouse cursor into a big white circle 2)Jailbreak hacks that can record the screen/display all touches

However, my goal is to just have touches displayed on a regular app running on an actual device.

Upvotes: 15

Views: 26414

Answers (6)

Kevin Bradley
Kevin Bradley

Reputation: 127

An alternative solution I cobbled together recently enables you to target any app (including SpringBoard and other iOS system applications ie Settings) and requires zero modifications or libraries for your own application, the only drawback is it requires a jailbreak. I figured i'd share regardless just in case anyone else finds it useful.

https://github.com/lechium/touchy

I based it around https://github.com/mapbox/Fingertips but inject into UIWindow instead of replacing it to add everything necessary to make showing the touches possible.

If you are jailbroken but don't feel like building and installing touchy on your own its on my Cydia repo: https://nitosoft.com/beta2

Upvotes: 0

Kane Cheshire
Kane Cheshire

Reputation: 1712

I realise this question is old now, but none of the existing solutions were good enough for me. I needed something that worked out of the box with multiple windows, without having to subclass windows or do any fiddling about.

So I created ShowTime, which (up until Swift 4) literally just requires you to either add the pod to your podfile or add ShowTime.swift to your target. The rest is totally automatic unless you want to configure the defaults.

https://github.com/KaneCheshire/ShowTime

Starting from Swift 4 there's one extra step, in your AppDelegate, just set ShowTime.enabled = .always or ShowTime.enabled = .debugOnly

Edit: Swift 4 now has auto-enabling again so no need to manually enable.

Upvotes: 12

Steven W. Disbrow
Steven W. Disbrow

Reputation: 316

After looking at all of the various libraries for this, I realized that, at least in my case, they were massive overkill. I just wanted to make an App Preview video, and I just needed it for two places in my app.

So, I spent a little time and came up with the following code that you can use with a SpriteKit-based scene to enable touch display on a scene-by-scene basis. (And, if you are starting from scratch, you could subclass SKScene and bake this right in for use by all your scenes.)

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    UITouch *touch = [touches anyObject];
    CGPoint location = [touch locationInNode:self];
    SKNode *node = [self nodeAtPoint:location];

#ifdef weBeRecording
    // ^^ Only do this if we're building a special version for making App Previews
    // Could also be switched on and off by a runtime control, I suppose

    // Create a new SKSprite at the touch location
    SKSpriteNode *touchesNode = [SKSpriteNode spriteNodeWithImageNamed:@"touchMarker.png"];
    touchesNode.position = location;

    // Initially see-through
    touchesNode.alpha = 0.0;

    // Position it above all your other nodes
    touchesNode.zPosition = 199;

    // And size it appropriately for your needs
    touchesNode.size = CGSizeMake(80, 80);

    // Add it to the scene
    [self addChild:touchesNode];

    // And then make it fade in and out. (Adjust in and out times as needed.)
    SKAction *showTouch =
    [SKAction sequence:@[
                         [SKAction fadeInWithDuration:0.25],
                         [SKAction fadeOutWithDuration:0.25],
                         [SKAction removeFromParent]
                         ]];
    [touchesNode runAction:showTouch];
#endif

    /* process original touch on node here */
}

Of course, you'll have to make the touchMarker.png file yourself. I created mine in Photoshop and it's just a simple 100x100 white circle with a 50% transparency. Honestly, it took longer to get that image just right than it did to get the code working. (If there's a way to attach images here, I'll do that. But, um, it's my first day. Yeah.)

One caveat, you have find and save off the originally touched node (saved here in the "node" variable) before you do this. If you don't, that original value gets lost and none of your node testing will work after you display the touch marker.

Hope this helps someone else!

Diz

Upvotes: 4

hypercrypt
hypercrypt

Reputation: 15376

You can use Touchposé: https://github.com/toddreed/Touchpose

Upvotes: 8

huesforalice
huesforalice

Reputation: 2458

I would probably try to capture all touches on the KeyWindow with touchesBegan, touchesMoved and touchesEnded. You could then have a transparent view lying over the application which would then show the touches at the appropriate location.

Upvotes: 0

Benjamin Mayo
Benjamin Mayo

Reputation: 6679

You'd have to code in custom touches on the container view and move the center of a circular view to the touch's locationInView.

Upvotes: 0

Related Questions