【Cocos Creator】ローカルストレージへの保存と読込
Cocos Creatorに関するブログなのに、Cocos Creatorの記事が1つも無い!
ということで、たった今実装したこと、データの保存と読込について。
■どの関数を使えばいいの?
/*-------------------------------------------------------------------- セーブ / ロード / 全削除 --------------------------------------------------------------------*/ saveData: function(key, value) { cc.sys.localStorage.setItem(key, value); }, loadData: function(key) { return cc.sys.localStorage.getItem(key); }, removeAllData: function() { cc.sys.localStorage.clear(); }, foo: function() { // 保存 this.saveData("player_level", 3); // 読込 var a = this.loadData("player_level"); if (a !== null) this.a = a; // 全削除 this.removeAllData(); },
cc.sys.localStorage.setItem(key, value) で保存
cc.sys.localStorage.getItem(key) で読込
cc.sys.localStorage.clear() で全削除です。
ただし、getItem(key)で指定したkeyの値が無かった場合、nullが返されますので、null判定の必要があります。
2016/05/09時点では、APIリファレンスには、cc.sysにlocalStorageの記述はありますが、setItemやgetItemの記述は確認できませんでした。。。
cocos2d-jsではこの方法で保存&読込している人が多いようですし、パッとみた感じ他に方法も無いので、これで良いと思います。
■私がハマったところ
ある数値の変数を0として保存して、すぐに読み込んで、その変数に30加算すると、「030」となりました。
上記の方法で保存&読込は可能ですが、
setItemで保存した値をgetItemで読み込んだ時
数値型だったものが、文字列型になっているようです。
私はプログラミングレベルも低く、javascriptに触り始めて1ヶ月経っていないのであまりわかりませんが、
文字列としてシリアライズしていて、かつ変数がvar型というjavascriptの仕様上、しかたないことなのでしょうか??
とにかく、読み込んだ時に、元の型に変換してやる必要があります。
●文字列 to 数値
Number(str) で変換できます。
// 読込 var a = this.loadData("player_level"); if (a !== null) this.a = Number(a); // 数値に変換
■まとめ
これで問題なく元の変数と変わりない変数(Number)が取得できました。
ちなみに私は、上記のsaveData()とloadData()を、CanvasノードのプロパティのGameControllerスクリプトに記述しておいて
他のノードから呼出して使っています。
loadPlayerData: function() { /* nullだった場合、何もしない(=プロパティのデフォルト値になる) */ /* セーブ時に文字列化されてしまっているので、値化する必要がある*/ // レベル var level = this.gameController.loadData("player_level"); if (level !== null) this.level = Number(level); // 経験値 var exp = this.gameController.loadData("player_exp"); if (exp !== null) this.exp = Number(exp); // HP var maxHP = this.gameController.loadData("player_maxHP"); if (maxHP !== null) this.maxHP = Number(maxHP); // 攻撃力 var atacckPower = this.gameController.loadData("player_attack"); if (atacckPower !== null) this.atacckPower = Number(atacckPower); // 防御力 var defensePower = this.gameController.loadData("player_defense"); if (defensePower !== null) this.defensePower = Number(defensePower); },
そのうち、TiledMapについて書きたいのですが、ちょっと長くなりそうですねー