Scratchで、フリック・スワイプ操作を実現してみた。

2019-5-07

タブレットでも遊べるゲームをScratchで作るため、ゲームに使えるタッチ操作を作っています。今回は、ディスプレイを指ではらう「フリック」と「スワイプ」を実現します。

スマホやタブレットで、Scratchで作ったゲームができるようになれば、まわりの友達にも遊んでもらえますよね！
プログラムは、前回作ったパチンコ操作とよく似ています。

フリック操作を考える

まずは、フリックを作ってみましょう。

フリックは、ディスプレイを指で"すばやくはらう"動作ですね。文字を入力するときに、フリック入力なんて操作を使います。

flick

この操作は、3つの段階に分けることができます。

ready：何もさわらない
flick：画面にタッチ。そのまま、指で位置を変える
go：指をはなすと、はっしゃ！

この3つの状態は、特定のアクションで変化します。図にすると、こんな感じです。

state_1

マルが状態、矢印がアクション。「go」から「ready」には、強制的に進みます。この図だけ見ると、実は前回のストリングアクションとほとんど同じです。「flick」から「ready」へ、キャンセルで戻れるところが違っています。

プログラミング - フリック

この3つの状態に合わせて、プログラムを作っていきましょう。ここでは、状態ごとにブロックのかたまりを用意します。また、状態をあらわす「state」変数を用意します。

1. 指の動きに合わせる

まずは、指の動きに合わせて動くだけのプログラムです。

「ready」で、タッチされるのを待ちます。スプライトが押されたら「flick」に移行します。「マウスが押された」でなくなるまで、指の位置に合わせて移動して。指を離したら「ready」に戻ります。

指を離した時「0.1秒待つ」が入っているのは、「ready」と「flick」が重なるのを防ぐため。発射しないので、まだ「go」はありません。

101

01 Flick Test on Scratch
https://scratch.mit.edu/projects/303388358/

2. 指をはなすと飛んでいく

パチンコ操作と違って、指を動かした方向に発射します。

そのため、飛んでいく方向を検出できるよう「start」スプライトを追加しました。マウスが押されなくなったら、向きを「start」に向けてから「180度回す」しています。これで、「start」とは反対方向を向きます。そして、「goを受け取ったとき」ブロックに移動して移動を始めます。「speed」は、「startまでの距離」を元に計算しています。

でも、これだと、パチンコ操作と方向以外は同じで、ゆっくり指を動かしても操作できてしまいます。

102