シャオヘンゲームが最終的に完成されて会ったプロジェクトの初期段階では、それは私が少し完全なリラックスできると思ってしばらく厳しいですが、企画、運用要件、彼らは非常に「シンプル」との重要な機能を追加することを考える:初心者ガイド。
、年間受信このタスクは、手と足を発汗された感覚を思い出してかすかな、鈍い月の暗い日、ゲームのコードはすでに千傷に直面して、複雑なロジック、起動する方法を知りませんでしたか?さらに難しいゲーム自体で、機能の需要が安定していない、上司がちょうど、変更する考えで変更、変更される可能性があります...、私はどのように行うことができますか?
このような状況が困難な状況でなければならないで、冷静さを保つ必要があり、苦い経験をした後、私は、ガイダンス機能を開発することの過程で蓄積し続けるようになった、プロファイルのセット、プログラマブルガイドフレームを用意し、それから支払います特定のガイドコンテンツを作るために他の開発者やプランナーに、実際にそれがある:「何を殺さないことは、あなたがより強くなります」。
初心者ガイドを達成することの難しさ
初心者ガイドを達成することは通常困難な機能、それは密接に現在の要件に関連していることで、少しでも少なく、通常のプロセスが死んで終わりです、それらの痛みのポイントがある最後に、次のガイド初心者を見てみましょう。
の開発の痛みのポイント
- ブート・コードは、通常の流れ、流れの乱れに挿入する必要があります。
- コストを維持し、向上させることは困難で、ブートコードは、元のコードのロジックに影響を与えます増やします。
- 需要の変化は、インターフェイスまたは実質的に改訂されたガイダンス機能、あるいは再生産につながります。
- トラブルを配置指先に対応する矩形領域は、単に矩形の固定位置とサイズを使用することはできません。
- コード書かれたガイドでは、非常に困難であると計画が必要です - プログラム間の協力の高いレベルを。
所望のプログラミング経験
ブート生産過程で学んだ伝統の難しさや欠点の後、私は達成するためには良い方法はありません考えている、私の心の中のプログラムガイダンス機能は、次のを持っていると思ってい:
- ブート機能コード、コードは、潜在的に悲惨な通常ゲームロジック内で混合することができない分離されなければならない;(耐え難いエレガントなコードは、断片化コードを取得乏しい耐えるために、執拗な破壊より困難です)
- UIインターフェイスは、ブート・コードを修正する必要のない単純な変位、サイズのサイズ、ノードのレベル調整を生じます。
- 位置決めガイドUI矩形領域はできるだけ簡単であるべきで、異なる画面サイズは、適応することができます。
- 企画スタッフを行うための最善のことは、ガイド以来、プロセスの一部を行うことができます。
- ステア明確な需要では、ゲームは通常の場合に備えて、ルーチンのステップガイドを作ることは非常に迅速でなければなりません。
ここで私はココスクリエーター公式デモ-UIエンジニアリングガイドケースプレゼンテーションに埋め込まれて使用するものです。
デモ体験住所:
http://game.ixuexie.com/godGuide
ここでデモビデオだ:
https://www.bilibili.com/video/av60001770/
フレームワークキー
ガイドのデモ操作は、以下の制御設定のJSONを使用します。
module.exports = {
name: '进入商店',
debug: true,
autorun: true,
steps: [
{
desc: '文本提示',
command: { cmd: 'text', args: ['欢迎体验Shawn的新手引导框架', '本案例演示:\n1.文本提示指令\n2.手指定位指令\n3.自动执行引导\n4.点击操作录像', '首先,请点击首页按钮'] },
},
{
desc: '点击主界面主页按钮',
command: { cmd: 'finger', args: 'Home > main_btns > btn_home'},
delayTime: 0.5,
},
{
desc: '文本提示',
command: { cmd: 'text', args: '点击主界面设置按钮' }
},
{
desc: '点击主界面设置按钮',
command: { cmd: 'finger', args: 'Home > main_btns > btn_setting'},
},
{
desc: '文本提示',
command: { cmd: 'text', args: '点击主界面商店按钮' }
},
}
キー配列が配列プロジェクト段階で、ブーツは主にデバッグのために使用さ説明DESCステップ、である、ブートストラップ、指がここで実現される指示コマンドコマンド:指を、後者は、CSSによる命令引数パラメータであります:セレクタの概念は、私は単にノードの取得方法を達成するためにここにいるロケータを。
ロケータ
下記に示すように、コンセプトロケータポイントは、実際には、非常に簡単です:
あなたは次のようにcc.findエンジンはコードを取得するために提供、と思うかもしれません。
cc.find('Canvas/Home/lower/main_btns/layout/btn_home')
ノードのパス文字列が正確にノードをbtn_homeするように配置されてもよいが、実際の使用に面倒に感じるであろう。
- 文字列が長すぎ、エラーが発生しやすいです。
- ノード名は、階層ノードのパス文字列は、無効傷害に容易になる変更します。
よりシンプルで信頼性の高いパスを表現するためには、2つの位置決め用シンボルを導入します。
/: 右斜杠,代表1级子节点(与cc.find相同)
>: 大于符号,表示1~n级子节点
上記btn_homeノードロケータが変更されてもよいです
godGuide.find('Canvas > btn_home');
私たちは、キャンバスのノードから取得開始をデフォルトした場合、次のようにも直接書き込むことができます。
godGuide.find('btn_home');
層を横断このノードからキャンバスは、読み取ることができる検索ノードの効率を向上させたいです。
godGuide.find('Home > main_btns > btn_home');
あなたがシーンで同じ名前のノードを持っている場合は、使用することができます'>'
(あなたがそれをチェックする必要がある場合)を解決するためのシンボルを、同じ名前のノードの同じレベルを持つことはできません。
自動搬送
テストの非効率性を導く、ガイド設定可能と同様に、それが自動的にそれを強制することができますか?以下のビデオを参照してください:
https://v.qq.com/x/page/v3017l51xep.html
シャオヘンは、ブラウザの実装における最も初期には、マウスクリックをシミュレートし、後にも使用することができますネイティブアプリケーションに拡張しました。自動ガイドは、ブートプロセスのテストと検証を容易にします。
記録処理
ガイドのコアは、我々はノードロケータ(パス簡略式ノード)取得したノードを手書き、ターゲットノードを得ることです。あなたが機能を実装した場合、我々は、ノード・パス上の次のレコードをクリックすると、自動的にブートプロセスにそれを生成することができますか?そして、それが自動的に再生できますか?
エピローグ
初心者ガイドは、オープンソースのフレームワークをされて、そしてココスクリエーター2.2.0の下での最新バージョンをサポートしており、Githubのオファー倉庫住所:
https://github.com/ShawnZhang2015/GodGuide
元はあなたが役に立つと感じた場合、賞賛をポイントしてください、簡単ではありません!