Fix: Construct 3 Touch Input Not Working on Mobile

Here is how to fix Construct 3 touch input not working on mobile. You built a game in Construct 3, previewed it on desktop where clicking works fine, then deployed it to a phone — and nothing responds to touch. Buttons do not react, the player does not move, and the game sits there ignoring your taps entirely. This is one of the most frustrating Construct 3 issues because it works perfectly on desktop and gives you no error messages on mobile.

The Symptom

Your game runs on a mobile device — the visuals render, animations play, physics objects fall — but no touch input is recognized. Tapping on buttons, sprites, or anywhere on the screen produces no response. The game behaves as if no input is occurring at all.

On desktop, the same project works fine with mouse clicks. In the Construct 3 preview in a desktop browser, clicking triggers all the expected events. The disconnect between desktop and mobile behavior is the key diagnostic clue.

A variant of this issue is partial touch failure: touch works for some elements but not others, or the first touch works but subsequent touches do not register. This usually points to a coordinate mapping or multi-touch handling issue rather than a total input failure.

What Causes This

There are six common causes:

1. Touch object not added to the project. This is the most common cause and catches almost every new Construct 3 developer. Unlike mouse input which works via the Mouse object (or sometimes by default), touch input requires you to explicitly add the Touch plugin to your project. Without it, the engine has no touch event system and silently ignores all touch input.

2. Using Mouse events instead of Touch events. Mouse conditions like “On click” and “Mouse cursor is over” do not respond to touch input on mobile devices. Mobile browsers can simulate mouse events from touches in some contexts, but Construct 3’s Mouse object specifically handles mouse pointer events. For mobile, you need Touch conditions like “On tap object” and “Is touching object”.

3. Viewport scaling breaking coordinate mapping. If the game’s viewport does not match the device screen properly, touch coordinates can be offset from visual positions. A tap on a button at screen position (200, 300) might register at game position (150, 225) due to scaling mismatch. The touch technically works but hits the wrong coordinates.

4. iOS Safari audio unlock blocking interaction. On iOS Safari, the first user touch is often consumed by the browser to unlock audio playback (the WebAudio autoplay policy). If your game tries to play audio on startup, the first touch may go to the audio unlock rather than your game logic. This manifests as “the first tap does nothing but subsequent taps work.”

5. CSS touch-action interfering with events. Some export wrappers or custom HTML templates add CSS touch-action properties that prevent default touch handling. If the canvas element has touch-action: none missing, the browser may intercept touches for scrolling or zooming instead of passing them to the game.

6. Browser zoom or double-tap-to-zoom intercepting touches. Without proper viewport meta tags, mobile browsers add a 300ms delay to single taps (waiting to see if it is a double-tap for zoom). This delay can make the game feel unresponsive or cause taps to be missed entirely if the game checks for instantaneous input.

The Fix

Step 1: Add the Touch object to your project. In the Project Bar, right-click the project folder or the Object types folder. Select Add plugin (or Insert new object), find Touch in the list, and add it. The Touch object is a project-wide plugin — it does not need to be placed on any specific layout.

// Verify Touch is in your project:
// Project Bar > Object types > Touch should be listed

// If using JavaScript scripting, verify touch is available:
const touch = runtime.objects.Touch;
if (!touch) {
  console.error("Touch object not added to project!");
}

After adding Touch, its events become available in the event sheet editor. You do not need to create an instance of it on any layout — it works globally once added.

Step 2: Replace Mouse events with Touch events. Go through your event sheets and replace Mouse conditions with their Touch equivalents:

// WRONG: Mouse events (desktop only)
Mouse › On click on StartButton
  System › Go to layout "Game"

// RIGHT: Touch events (mobile compatible)
Touch › On tap object StartButton
  System › Go to layout "Game"

// BEST: Support both desktop and mobile
// Event 1:
Mouse › On click on StartButton
  System › Go to layout "Game"
// Event 2:
Touch › On tap object StartButton
  System › Go to layout "Game"

For movement controls, use Touch position expressions instead of Mouse position:

// Getting touch position in event sheets:
Touch.X          // current touch X in layout coords
Touch.Y          // current touch Y in layout coords
Touch.AbsoluteX  // touch X in viewport coords
Touch.AbsoluteY  // touch Y in viewport coords

// In JavaScript:
for (const touch of runtime.touch.touches) {
  const x = touch.x;   // layout coordinates
  const y = touch.y;
  console.log(`Touch at: ${x}, ${y}`);
}

Step 3: Configure the viewport meta tag. Construct 3 sets this automatically in most exports, but if you are using a custom HTML shell or a wrapper like Cordova, verify the viewport tag is present and correct:

<!-- Required in the HTML head for proper touch handling -->
<meta name="viewport"
  content="width=device-width, initial-scale=1.0,
  maximum-scale=1.0, user-scalable=no">

<!-- CSS on the canvas element -->
canvas {
  touch-action: none;    /* Prevent browser gestures */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

The user-scalable=no setting prevents pinch-to-zoom, which eliminates the 300ms tap delay. The touch-action: none CSS tells the browser not to interpret touches on the canvas as scrolling or panning gestures.

Step 4: Handle the iOS audio unlock. If the first touch seems to be swallowed on iOS, handle audio unlocking explicitly at the start of your game:

// Event sheet: On start of layout (first layout)
// Show a "Tap to start" screen and wait for input

Touch › On any touch start
  Audio › Play "silence" // a short silent audio file
  System › Set TapToStartVisible to 0
  System › Go to layout "MainMenu"

// This ensures the first user interaction unlocks audio
// and subsequent touches go directly to game logic.

Step 5: Test on actual devices using Remote Preview. Do not rely on desktop browser simulation for mobile input testing. Use Construct 3’s Remote Preview feature or deploy to a real device:

// Remote Preview steps:
// 1. Click the Remote Preview button in the toolbar
// 2. Scan the QR code with your mobile device
// 3. The game runs on the device with real touch input
// 4. Console output appears in Construct 3's debugger

// Debug touch events in JavaScript:
runtime.addEventListener("pointerdown", (e) => {
  console.log(`Pointer: ${e.pointerType} at ${e.clientX}, ${e.clientY}`);
});

Why This Works

Mobile touch input operates through a completely different browser API than desktop mouse input. Understanding this separation explains why each fix is necessary.

Adding the Touch object registers Construct 3 to listen for touchstart, touchmove, and touchend browser events (and their pointer event equivalents). Without this registration, the browser fires touch events but nothing in the engine listens for them.

Using Touch events instead of Mouse ensures you are checking the correct input source. The Mouse object listens for mousedown/mouseup/mousemove events, which mobile browsers do not reliably fire from touch input. Some browsers synthesize mouse events from touches, but the timing and coordinates are unreliable.

Viewport configuration ensures a 1:1 mapping between screen coordinates and game coordinates. Without user-scalable=no, the browser reserves touch gestures for zooming and adds a 300ms delay to distinguish taps from double-tap-to-zoom. The touch-action: none CSS prevents the canvas from being scrollable.

Audio unlocking addresses Apple’s autoplay policy, which requires a user gesture before any audio can play. The browser consumes the first touch event for this purpose. By handling it explicitly with a “tap to start” screen, you ensure the audio unlock happens intentionally rather than stealing a gameplay tap.

"The number one mobile input bug I see: developers test with mouse clicks in desktop preview and never realize they forgot to add the Touch object. Remote Preview on a real phone is the only honest test."

Related Issues

If touch input works but your sprites are flickering on mobile, see sprite flickering on mobile devices for rendering fixes. When touch events fire but your event logic runs too many times per tap, check events firing multiple times per tick. For touch-based games where players interact with tilemaps and collisions are not registering, tilemap collision not working covers collision polygon setup. And if your physics-based game has objects falling through surfaces on mobile, physics objects falling through floor addresses frame-rate-dependent tunneling.

Add the Touch object. Seriously, that is it 90% of the time.