投稿

12月, 2025の投稿を表示しています

持ち物の削除と時間変化

イメージ
 串です。今週は下記を行いました。 ・サブストーリーの持ち物の管理 ・ストーリー進行に伴う時間の変化  まず、サブストーリーでの持ち物の管理についてですが、以前pushを使ってアイテムを配列の最後に追加するという処理は組み込んでいました。今回は、アイテムがなくなった時に持ち物ページから消えるような処理を作りました。 mtmn = mtmn.filtter(function(mtmn){     return mtmn !== "・アイテム名"; })  filterを使ったループ処理で、配列内の値を検索して削除しています。returnの後の条件文で、アイテム名以外のものを配列に戻しています。  次にストーリー進行に伴う時間の変化についてですが、以前やりたいと書いていた時間帯の変化を描画できるようにしました。  メインストーリーにおける特殊なアイテムの取得などのタイミングで変数dayの値を変える処理を作りました。day1では夕方、day2では夜になるように設定しています。 今後やっていきたいこと ・メインストーリーの作成 ・サブストーリーの作成  今回はゲームシナリオを進めるというよりは、それに伴う演出的な部分の作成を主に行ったので、今後は実際のシナリオ部分の作成をしていきたいと思います。   マップ制作で使用させていただいた素材は、ぴぽや倉庫様からお借りしています。 https://pipoya.net/sozai/ <参考文献> ・MDN Web Docs「grobalCompositeOperation プロパティ -Web API | MDN」、(https://developer.mozilla.org/ja/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation 閲覧日:2025年12月15日) ・techmania.jp 「【JavaScript入門】 filterで条件に合致する値を配列から抽出する」、(https://techmania.jp/blog/javascript-filter/ 閲覧日:2025年12月13日) ・侍エンジニア 「【JavaScript入門】 配列要素を削除する方法のすべて!」、(https://www.sejuku.net/...

ページ送りと選択後の分岐

イメージ
 串です。今週は下記を行いました。 ・ページ送り ・選択肢を選択した後の分岐 ・サブストーリーの素材作成  まずページ送りについてですが、今までキャラクターとの会話イベントでは1ページ分の台詞を表示していました。会話は方向キーで主人公が移動することで閉じていましたが、エンターキーを押すことで次のページへ移動し、長い台詞などに対応できるようにしました。  コードは二重配列を使用し、ページ数をカウントしながら、一列ずつ表示するようにしています。以前作成したものと同じ方法で、会話イベントが始まったら変数を1に変え、移動を制限しています。配列の最後の要素が表示されるまではエンターキーで配列の順番を送っていき、最後の要素に来たら変数を0に戻して再び移動を出来るようにしています。  選択肢を選択した後の分岐についてですが、はいを選んだ後に別の会話イベントが発生するように設定しました。新たなフラグを設置し、配列の最後の要素でエンターキーを押した時に、フラグが立っていれば別の会話イベントへ移るという流れです。  最後にサブストーリーの素材作成についてですが、新たなマップを用意し、そこに必要なキャラクターを配置しました。  わらしべ長者的なイベントなので、数珠繋ぎでフラグが成立するように設定していきます。プログラミングの方には関係がありませんが、村人はメインキャラと違いを生むために目元をシンプルに描いています。他にも二人のキャラクターを配置すれば、サブストーリーに必要なキャラクターが出揃います。 今後やっていきたいこと ・メインストーリーの作成 ・サブストーリーの作成 ・日付の変更  上に二つはこれまで通り、引き続き行っていきたいと思います。フラグの設置をメインに行っていきます。  日付の変更は以前も書きましたが、どのように組み込めるかを考えていきたいと思います。 マップ制作で使用させていただいた素材は、ぴぽや倉庫様からお借りしています。 https://pipoya.net/sozai/ <参考文献> ・田中賢一郎『ゲームで学ぶJavaScript 入門』インプレス、2015年 ・田中賢一郎『ゲームを作りながら楽しく学べるHTML5+JavaScript 入門』インプレス、2017年 ・田中賢一郎『ゲームで学ぶJavaScript 入門 増補改訂版~ブラウザゲームづくりでH...

移動制限と選択肢の追加

イメージ
串です。先週は下記を行いました。 ・持ち物ページを開いた時に、プレイヤーの動きを制限する ・イベントでの選択肢の追加  まず、持ち物ページについてですが、今まではwキーで持ち物ページを開いた後、方向キーを押すとプレイヤーが移動し、持ち物ページが閉じていました。持ち物ページは、方向キーで各アイテムに表示を合わせると、アイテムの詳細や使用の可否を問うものにしたいと考えているため、一度ページを開いたら方向キーによるプレイヤーの移動を止めたいと考えていました。  今回はそのプレイヤーの移動を止める部分を作成しました。wキーを押すことで、変数wの値を変え、w=0の時のみ、方向キーによるプレイヤーの移動を行うように設定しました。  w=0が、方向キーで移動  w=1は、持ち物ページを開く という処理にしており、wキーを押すと  w=1-w を実行して、wの値を変えています。  次に、会話イベントでの選択肢の追加についてですが、メインストーリー終盤で、プレイヤーにはいかいいえを問うものを作りたいと考えていたため、今回は選択肢を表示させるところまで作成しました。  持ち物の時と同じく変数sを用意して、選択肢を表示したい場面でs=1にし、方向キーによるプレイヤーの移動を制限しています。  そのため、はいといいえの切り替えは方向キーの上下で行います。  今後は、エンターキーなどを使って選択肢を決定し、さらにイベントを繋げていきたいと考えています。 今後やっていきたいこと ・選択肢による分岐とメインストーリーの作成 ・サブストーリーの作成  選択肢の設置ができたことで、メインストーリーが進められそうなので、引き続き作成していきます。サブストーリーの方も進めていきたいと思います。  今週作成したものは、仕組みはシンプルですが中々上手くいかず、いくつか試行錯誤をしました。持ち物ページは、元々はwキーを押すことで、mtmnpaint(持ち物を描画する関数)を実行していましたが、プレイヤーの動きを制限するために変数wを追加しました。if文による分岐を作りましたが、持ち物ページが画面上に表示されなかったため、新たにmtmnw関数を作り、プレイヤーが何らかのキー入力をする度に、mtmnw関数を実行してwの値を確認し、mtmnpaintを実行するかを判断する仕組みにしました。  他にも、選択肢を表示す...