今回つくるゲーム
難易度
今回はスクラッチでユーザ名付きランキングの作り方について解説していきます。ゲームを作った時に、みんなでスコアを競い合うことができれば、さらに楽しくなります。ここではストップウォッチを使って10秒に近づけるほど高スコアになるゲーム「10秒チャレンジ」という簡単なゲームを使って、ランキングの使い方を解説していきます。高いスコアから順番にならべかえる「バルブソート」というテクニックや、クラウド上にデータを保存する「クラウド変数」、さらに、ローマ字を含めてクラウドに保存していく「クラウドリスト」について学んでいきます。
まずは、以下のゲームに参加してみてください。スタートを押して、10秒経過したと思った時にストップを押してください。最高スコアは9999点になります
スコアがTOP5に入ればランキングにユーザ名が掲載されます
10秒チャレンジゲームを作る
まずは10秒チャレンジゲームを作っていきます。
新規プロジェクトを作成し、Button2のスプライトを選んでください。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-28-23.44.49.png?resize=491%2C443&ssl=1)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/11/スクリーンショット-2021-11-28-23.45.13-1024x642.png?resize=1024%2C642&ssl=1)
次に、Button2のコスチュームにスタート、ストップとテキストを書き込みます。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-28-23.48.01.png?resize=945%2C817&ssl=1)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-28-23.48.10.png?resize=945%2C817&ssl=1)
そして、コードのタブに移り、以下のようにコードを組みます
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-28-23.55.41.png?resize=853%2C355&ssl=1)
少しスコアの算出式がややこしいですが、以下のように10秒に近くなればなるほど高いスコアになるような算出式になっています。
例) 9.123秒で止めた → スコア:9123 10.123秒で止めた → スコア:9877
以下のように、スタートとストップを押してスコアが出れば成功です。
スコアランキングを作る
次に、スコアランキングを作っていきます。
ユーザ名付きスコアリストの作成
最初にはユーザ名付きスコアリストを作成していきます。まず、トップ5というリストを作成し、スコアとユーザ名を組み合わせてリストの中に入れていきます。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.04.27.png?resize=856%2C409&ssl=1)
この状態で、何回かゲームをするとトップ5のリストに以下のようにデータが溜まっていきます。
この時点ではユーザ名は自分だけですし、スコア順にも並んでいません。そして6回目以降はリストに加えられません。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.02.48.png?resize=490%2C409&ssl=1)
スコアを高い順番(降順)に並び替え
ではここからスコアを高い順番(降順)に並び替えていきます。リストの数字を大きなものから順番にならべかえるのは「バルブソート」というテクニックを使います。バルブソートに関して詳しくは以下を参考にしてください
今回はスコアとユーザ名が一緒になってしまっているので、スコアだけを取り出す作業が必要になります。バルブソートのコードをベースに改良していきます。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.06.42.png?resize=856%2C440&ssl=1)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.09.43.png?resize=662%2C699&ssl=1)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.10.14.png?resize=821%2C650&ssl=1)
これで、スコアが高い順番に並び替えられます。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.11.17.png?resize=493%2C411&ssl=1)
実はこのままではスコアが2桁や3桁の時は対応できなかったり、10000点(10秒ぴったり)のときも対応できません。複雑になるのでここでは書きませんが条件分岐を追加していくことで対応可能です。
順位を判定
最後に、順位を判定して、5位以内に入ると吹き出しで知らせてくれる機能も入れておきましょう。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-23.07.21.png?resize=692%2C755&ssl=1)
クラウドリストを作る
ここまでは、自分だけでゲームをプレイしていましたが、他の人とスコアを競い合えるようにしましょう。他の人が変数を更新していくためにはクラウド変数を使います。クラウド変数の使い方についてはこちらに簡易的なものは紹介しています。
/2021/08/01/mogura-ranking/
しかし、クラウド変数は数字しか扱えませんので今回のようにユーザ名などのローマ字や記号はクラウド上に保存できないので、一度すべて数字に変換してクラウド上に保存していくことになります。
まず、例えば 9335 : kanett という文字列をクラウドに保存することを考えてみましょう。下の図のように、ローマ字や記号を数字に変換する対応表を作成し、その対応表に準じて符号化すると、
9335 : kanett → 3529293170110114052020
のように変換できます。このことを符号化と呼び、逆に符号をスコアに戻すことを復号化と呼びます。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/11/スクリーンショット-2021-11-29-22.25.50-1024x577.png?resize=1024%2C577&ssl=1)
この考え方をさらに進化させると、以下のようにリストを符号化・復号化できるようになります。
このことをスクラッチの世界ではクラウドリストと呼びます。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/11/スクリーンショット-2021-11-29-22.31.08-1024x577.png?resize=1024%2C577&ssl=1)
このクラウドリストのコードは実に様々な人が書いてくれていますが、この記事では以下のmirukumaさんのクラウドリストのコードを参考にさせていただきました。
以下のように符号化・復号化を定義していきます。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-22.41.48.png?resize=852%2C548&ssl=1)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-22.42.13.png?resize=809%2C755&ssl=1)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/11/スクリーンショット-2021-11-29-22.46.35-1024x435.png?resize=1024%2C435&ssl=1)
実際にクラウドリストが機能しているかどうか、プロジェクトページの「クラウド変数(データを見る)」のボタンを押してください。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.52.04.png?resize=988%2C616&ssl=1)
すると、以下のようにデータが更新されているのがわかります。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/01/スクリーンショット-2021-11-29-0.53.19.png?resize=988%2C523&ssl=1)
すべてのコード
以上でユーザ名入りスコアランキングの作り方は終了です。以下がすべてのコードになります。
今回使った「バブルソート」「符号化」「復号化」などのコードはいつでも部品として使えるようにしておきましょう。このような定型のコードは様々なスクラッチャーの人たちが作ってくれているのでより良いものを探して活用させてもらうと良いでしょう。自由に他の人のコードが見れて活用することができるのがスクラッチのとても良いところです。もちろん今回のコードも自由に活用してください。
コメント
大文字小文字の判定は…?
返信遅れてすみません!
スクラッチに大文字と小文字の違いはないと思います。おそらくですが
初心者で,複雑なものの仕方はわからないので
「実はこのままではスコアが2桁や3桁の時は対応できなかったり、10000点(10秒ぴったり)のときも対応できません。複雑になるのでここでは書きませんが条件分岐を追加していくことで対応可能です。」
という部分のコードを別の記事などに書いていただけないでしょうか?
野球ゲームのリミックスを作っていて1~3桁まで対応させたいんです。
以下リンクにそのゲームを追加しておきます。
ちなみにクラウド変数で挫折しましたw
難しいということであればお伝えいただけるとありがたいです。
宜しくお願い致します。
すみません、とても返信が遅くなってしました。そうですね時間のある時に考えてみますね!