![見出し画像](https://assets.st-note.com/production/uploads/images/86835335/rectangle_large_type_2_6319cfa2a5f7115ba11f7eaa15df2a74.png?width=1200)
PICO-8で遊ぼう(3D:準備編
2D(というかドット絵)ゲームエディタで3Dをわざわざやらんでも…。
所謂、ロマンってことです。令和ロマン。
本日の教科書
本日の教科書ですが、ちょっと古い情報でそのままだと動かなかったので変更を加えました。
またやったことも多いので、まずは準備編として3Dライブラリのダウンロードから外部エディタを使った開発環境をつくるところまでを記載します。
Gryphon 3D Engine Library
PICO-8公式掲示板に投稿されている3Dエンジンを使わせてもらいます。
上記サイトから教科書に書いてあるように3Dエンジン部分のCODEをコピペしても良いのですが、PICO-8の便利機能SPLOREを使ってダウンロードしてみます。
SPLORE
![](https://assets.st-note.com/img/1663109217720-yv1rLDRt2E.png?width=1200)
![](https://assets.st-note.com/img/1663109276494-wgLzryzKI6.png?width=1200)
これはPICO–8公式掲示板にアップロードされているカートリッジをダウンロードして遊ぶことができる便利ツールで、ダウンロードしたカートリッジの中身を見ることもできます。
早速目的の3Dライブラリをダウンロードしてみます。
![](https://assets.st-note.com/img/1663109520302-k7zZhceHd3.png?width=1200)
虫眼鏡アイコンを選択して34798(3Dライブラリの投稿No)と入力してenter。
![](https://assets.st-note.com/img/1663109694819-f4PbAGuxhZ.png?width=1200)
![](https://assets.st-note.com/img/1663109883714-OZfxN5DVbb.png?width=1200)
![](https://assets.st-note.com/img/1663109920323-o4OnY1LQh5.png?width=1200)
escでウィンドウがでるのでEXIT TO SPLOREを選択してenterするとSPLOREに戻る。
![](https://assets.st-note.com/img/1663110133632-GN9tDJ5Ufe.png?width=1200)
![](https://assets.st-note.com/img/1663110235191-vfgfdOnbMs.png?width=1200)
![](https://assets.st-note.com/img/1663110341288-WFid34Njr0.png?width=1200)
外部エディタの導入
保存した3DライブラリをPICO-8のエディタ上で直接いじってもいいのですが、3Dライブラリのコードはかなり大きくて、小さなPICO-8のエディタでは見通しが悪くいじりにくいです。
そこで外部エディタを導入して快適な開発環境を作ってみます。
PICO-8は1ファイルでコード、ドット絵、サウンドの全てが入っています。
さらにそれをテキストエディタで開くだけで簡単に中身が見れて直接編集もできてしまいます。
そのファイルがどこに保存されているかは環境によって異なります。
標準設定では以下の場所にあります。
Windows: C:/Users/Yourname/AppData/Roaming/pico-8/carts
OSX: /Users/Yourname/Library/Application Support/pico-8/carts
Linux: ~/.lexaloffle/pico-8/carts
Visual Studio Code
外部エディタにはVisual Studio Code(VS code)を使用し、PICO-8の開発に便利な機能拡張を2つ導入します。
![](https://assets.st-note.com/img/1663111791617-K5m6CWbXFN.png?width=1200)
pico-8-lsはハイライトと補完、pico-8-simple-putlineはアウトライン機能の追加。
pico-8-lsにもアウトライン機能はあるが変数まで拾ってくるので見通しが悪く使いにくい。
![](https://assets.st-note.com/img/1663113086008-p8o6DaT1eI.png?width=1200)
赤い立方体を表示してみる
3Dライブラリにあるデモ(くるくる回る猫ちゃん)は、複雑なオブジェクトを読み込んでいたり複数シーンの切り替えが出来たりと大変興味深い逸品なのですが、これをいじるにはコード量が多いですし複雑なので教科書にある赤い立方体を表示するごくごくシンプルなデモになるようにデモのコードを削り込んでいきます。
頂点リストと面リスト
![](https://assets.st-note.com/img/1663195870540-yp2tRG2Yr4.png?width=1200)
この3Dライブラリでは複数の三角形の組み合わせでオブジェクトを表現します。三次元空間上の三角形たちを表現するデータが、頂点リストと面リストです。
頂点リストは三次元空間上の点のリストで、面リストは頂点リスト中の頂点の番号のリストになります。面リストは貼りたい面の頂点3点を選んでリストにしますが、視点から見て反時計回りに並んだ頂点が作る面は表面になり、時計回りの場合は裏面になります。テーブル要素の番号は1から始まっています。面リストは5つ数値がありますが前半3点は頂点の番号、後半2点は面の色情報です。2色を組み合わせて中間色を表しています。ただしload_object関数の引数にK_MULTI_COLOR_…を指定したときのみ有効となります。
![](https://assets.st-note.com/img/1663198238973-TDjyS5d4Pu.png?width=1200)
![](https://assets.st-note.com/img/1663198442160-EGyDXO12hn.png?width=1200)
続く!
この記事が気に入ったらサポートをしてみませんか?