2011-12-28 4 views
7

Durante il tentativo di realizzare una partita con Canvas ho notato alcuni svantaggi sui browser tablet/telefono.HTML5 Canvas (gioco) su tablet iPad/Android

1) Come disabilitare la tela per essere selezionabile? Sembra che quando l'utente lo tocca, mette in risalto la tela e quasi tenta di selezionarlo. Questo è indesiderato.

2) Gesti di scorrimento del browser. Alcuni browser hanno gesti di scorrimento che annullano qualsiasi acquisizione di movimento eseguita nella tela o nella pagina web. Questo è estremamente fastidioso e indesiderato.

3) Controllo Canvas con elementi dell'interfaccia utente HTML. Ho notato che quando c'è un canvas presente con altri elementi dell'interfaccia utente (come il testo) a volte facendo clic o trascinando nella tela si evidenzia una parte dell'HTML e trascina invece gli elementi HTML invece di colpire il canvas.

Qualsiasi aiuto è molto apprezzato! Speravo che HTML5 sarebbe stato abbastanza maturo da consentire una buona compatibilità sia su dispositivi mobili che desktop. L'idea è quella di poter codificare una volta e giocare ovunque ... grazie!

risposta

4

Questo dovrebbe risolvere i vostri problemi in materia di # 1 e # 3:

canvas.addEventListener('selectstart', function(e) { e.preventDefault(); return false; }, false); 

# 2 sembra come una questione terribilmente a parte, ma non ho mai avuto un problema con i gesti di scorrimento ignorando qualsiasi mia roba tela . Prova a utilizzare e.preventDefault(); all'inizio dei tuoi eventi touch.

+0

Sei fantastico. Questo funziona. Ho provato a cercare su Google la risposta e anche a guardare le librerie di terze parti e non ho trovato questa singola riga di codice. Spero che aiuti alcuni altri. – Adam

+0

Ho provato questo, ma non è cambiato nulla su Android: toccando un punto qualsiasi sulla tela è ancora selezionato tutto. – Cbas