Googleスプレッドシートに、単語や熟語を入力してEnterキーを押すと、
辞書のリンクが出て、
辞書が引けるようにします。
作り方を説明します。
プログラムの部分はコピペで出来ます。
HTMLとCSSをEmmetで書いてみる!:Visual Studio Code
Emmetとは、HTMLとCSS を省略記法で、効率よく書くためのプラグインです。
Visual Studio Code(以下、VSCode)では、標準で使えます。
例えば、
html:5
と入力して、Tabキー(*VSCodeの場合)を押すと
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html>
↑のようにコードが展開されます。
もう一例、
table>tr>th+td
と入力して、Tabキーを押すと
<table> <tr> <th></th> <td></td> </tr> </table>
となります。
という風に、少ない文字数で書くことが出来ます。
VSCodeの他にも、Atom等、プラグインを導入することでEmmetが使用できるコードエディタは多数あります。
『/(スラッシュ)』1つで切り替え可能なコメントの書き方
『/(スラッシュ)』を1つ書いたり消したりするだけで、コメントアウト部分を切り替え可能なコメントの書き方です。
書き方
早速ですが、これ↓です。
//* a = 1; /*/ a = 2; // こっちがコメントアウト //*/
↑の1行目の先頭の『/(スラッシュ)』を1つ消すと
/* a = 1; // こっちがコメントアウト /*/ a = 2; //*/
コメントアウトの部分が切り替わります。
単行コメント『//』と複数行コメント『/* */』を上手く組み合わせています。
あとがき
普通のコメントの書き方で事足りるのですが、ふと使いたくなる時があります。
そんな時はいつもうろ覚えなので、メモとして記事にしました。
JavaScripの他にも、コメントの書き方が同じ言語なら使えますね。
尚、CSSは、複数行コメント『/* */』しかないという罠。
Tiledのマップデータから物理空間を作成する!:Cocos Creator
Cocos Creatorは、物理エンジンのChipmunkを使用できます。
物理エンジンとは、物体が落下したり衝突したりした時の動きを計算してくれるものです。
アクションゲーム等を作る際に利用出来ます。
Tiledのマップデータから、アクションゲームのステージを作成するには、壁・床・ブロック等がそれぞれ物理的に認識される必要があります。
今回は、Tiledで壁・床・ブロックとしてオブジェクトを配置し、Chipmunkを利用して、これらがプログラム上で物理的に認識されるようにします。
下図はプロジェクトの実行画面です。
タッチした位置に丸い物体が生成されるようにしています。
壁・床・ブロックに対して、跳ねたり、転がったり、留まったりします。
下記に動くデモがあります。
Tiledのオブジェクトのデータの中身を見る!:Cocos Creator
Tiledについては、こちらの記事で基本的なマップの作り方やオブジェクトデータの取得方法について説明しています。
mmorley.hatenablog.com
Tiledでは、下記のオブジェクトを配置出来ます。
四角形 | |
楕円形 | |
ポリゴン | |
ポリライン |
replace()の機能のまとめ!『正規表現、function()、arguments、RegExp()』:JavaScript
『replace()』は、文字列の置換を行う関数です。
基本的な使い方は、下記の通りです。
var text = "abcabc"; var result = text.replace(/a/g, "1"); // "abcabc"内の"a"を最後まで検索して"1"に置換する // 結果:resultは"1bc1bc"になる
『replace()』の第1引数の『/a/g』は、検索する文字列を正規表現で表したものです。
- 正規表現では、検索する文字列を『/(スラッシュ)』で囲みます。
- 末尾の『g』は、最後まで探すというフラグです。
フラグには下表のようなものがあります。フラグ 意味 g 1個目だけでなく最後まで検索します。 i 検索の際に大文字と小文字を区別しません。 m 複数行に渡って検索します。
*また『text.replace("a", "1");』のように通常の文字列で検索すると1個目しか置換されません。var text = "abcabc"; var result = text.replace(/a/, "1"); // resultは"1bcabc"になる(1個目だけ置換) var result = text.replace("a", "1"); // resultは"1bcabc"になる(1個目だけ置換)
正規表現を使う利点は、"文字のパターン"で検索出来ることです。
例えば、『"'abc','de',f"』で'abc'と'de'を1に変えたい場合、『'(シングルコーテーション)で囲まれている文字列』というパターンで検索することで、文字の種類、長さが異なる'abc'と'de'を一度に置換することが出来ます。実際にどうやるかは後述しています。
また、『replace()』の第2引数にコールバック関数を指定すると、見つかった文字ごとに違う処理を行うことが出来ます。
上記の例を含めて『replace()』の様々な使い方をまとめました。
ジョイスティックでキャラクタを動かす!:Cocos Creator
こちらの記事で2Dのキャラクタのアニメーションを作りました。
mmorley.hatenablog.com
↑ではボタンでアニメーションを切り替えていましたが、ゲームらしくするためにジョイスティックでキャラクタを動かせるようにしてみました。