Processing.jsでスマホの入力を受ける
結果
- mouseClicked()関数を使う
詳しく
void mouseClicked(){ //ここに処理を書く }
…これだけです．
ダメな例
void draw(){ if(mousePressed){ //ここに処理を書く } }
詳しく
中に書いた処理にはそれぞれシステム変数mouseX,mouseYを使用．
当方スマホを持っておりませんで，ﾃﾞﾊﾞｯｸﾞできず詳しくはわからないが，おそらくmousePressedがスマホ相手に息をしていないのでは．
経緯
これまたギアチューンで壁となった．こんなことになってしまったのは「ささっと書いてみよう」と無計画に書いてったのが原因．普通に関数使って書いていればこんなことにはならないので，お遊びでもちゃんと書こうという教訓．
とはいえこれでギアチューンのスマホ対応の目途が立ったので頑張りたいところ．
ギアチューンがイカにｸｿコードで書かれているかみたいな記事をいつか書きたい．
Processing.jsでフォントを読み込む
結果
- 埋め込みたいフォントのTTFファイルを用意する．
- Processingのプログラム冒頭に /@pjs font="TTFファイルへのパス";/ を記述する．
- setup内で loadFont("TTFファイルへのパス",サイズ)をPFont型変数に入れる．
/*@pjs font="./hoge.ttf";*/ PFont fuga; void setup(){ fuga=loadFont("./hoge.ttf"); }
詳しく
/*@pjs font="./hoge.ttf";*/
この一文でProcessing.jsにフォントを読ませる．この場合はProcessingの.pdeファイル（あるいはHTMLファイル）と同階層にあるTTFフォント「hoge.ttf」を読み込ませている．
Processing内にはない構文なのでコメントアウトは外さないように．
複数のフォントを読ませたい場合は以下の通り．
/*@pjs font="./hoge.ttf","./piyo.ttf";*/ PFont fuga,foo; void setup(){ fuga=loadFont("./hoge.ttf"); foo =loadFont("./piyo.ttf"); }
経緯
ギアチューンをWEBツール化するにあたってまず最初につまずいた点． Processing単体で動かす場合はツールを用いてProcessing用のフォントファイルを作成し，それをloadFontで読ませるだけで済んだのだが，Processing.jsではうまく動かなかった．
色々ggったところ，
- Processing.jsではloadFontは使えない．
- 代わりにcleateFontを使う．
- ファイル名ではなくフォント名で読み込む．
…等と出てきた．素直に従ってやってみたものの成功せず．
さらに調べ進めてようやく冒頭の一文を見つけ出し，loadFontが有効なことを知りトライするも失敗．ダメ元でフォント名を指定していたのをTTFファイル名にしてみたら動いたという次第．
最初に出てきたのは何だったんだ
バージョンとかも書いてなかったし信用してはいけなかったか．
ついでに調べた結果は全部英語でした．ｶﾞﾝﾊﾞｯﾀ.
ちなみに
フォント名で指定し，なおかつそのフォントが自分のPCにインストールされている場合，自分の環境からだと正しく表示され気づけないので注意だ．
