« プレイルートの矢印 | トップページ | LongDriver のバグ取り »

2016年10月30日 (日)

タブレット用のルーチンを実装した、、、けれど

LongDriver にタブレット用のルーチンを実装しました。ただし、バグが有り不完全です。 LongDriver の作成は最初にPCで動くものを作り、その後でタブレットに対応することにしていました。PC限定の時点では、扱うイベントはマウス関連のものでしたが、タブレットに対応するために、タッチイベントを扱うルーチンを追加しました。

機器がPCなのかタブレットなのかを判定して、それに応じてイベントを設定します。 navigator.userAgentAndroidiPad などが有ればタブレットです(下記コード参照)。機器に応じたイベントの文字列を変数に代入しています。後で、その文字列を使ってイベントを処理します。


    var agent = navigator.userAgent;
    if ((0 <= agent.indexOf("Android"))||
        (0 <= agent.indexOf("iPhone"))||
        (0 <= agent.indexOf("iPad"))
    ){
        this.isTouchPnl = true;
        this.mouseDown = "ontouchstart";
        this.mouseMove = "ontouchmove";
        this.mouseUp = "ontouchend";
    } else {
        this.isTouchPnl = false;
        this.mouseDown = "onmousedown";
        this.mouseMove = "onmousemove";
        this.mouseUp = "onmouseup";
    }

タブレットでの最初の動作確認で、フィールドのスクロールの時、画面全体もスクロールするという不具合が有りました。これは、イベント・ハンドラーでイベントのメソッド preventDefault() を実行していなかったのが原因でした。PCでは、マウスでドラッグしても画面がスクロールすることはないので、この不具合は発生していなかったのです。

次の問題(今も解決できていません)は、画像の左右および下側に有る茶色のバーをタップしても、それに反応しないことです。使用しているイベントは click で、これはPCと共通です。画像の上下に有る選手のダミーマークはタップ出来るので、 click には問題は無いと思います。ダミーマークには click しかイベントを割り当てていないのに対して、茶色バーには click 以外にも touchstart, touchmove, touchend を割り当てています。これが不具合に関係しているのかも知れません。

それから、バグではないのですが、選手のマークをドラッグする時、反応が鈍いのも問題です。PCではスムーズに動いているのですが、PCとタブレットの能力は、こんなにも差が有るのでしょうか。

« プレイルートの矢印 | トップページ | LongDriver のバグ取り »

フットボールのプレイ図ソフト」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/584699/64417203

この記事へのトラックバック一覧です: タブレット用のルーチンを実装した、、、けれど:

« プレイルートの矢印 | トップページ | LongDriver のバグ取り »