💗

【Rust Advent Calendar 2022】Rust でライフゲームをつくってみた【20日目】

2022/12/19に公開

Rust Advent Calendar 2022 カレンダー 2 の 20 日目の記事です。

Rust でなにか動くものを作ってみたいと思っていたので Rust で ライフゲームを作ってみた内容を記載します。

そもそもライフゲームってなんやねん、という方は下記 Wiki をご参照ください。

https://ja.wikipedia.org/wiki/ライフゲーム

小一時間でゲームをつくる の C++ のコードを Rust 化してみた

  • サンプルコードを Rust に置き換えていて、C++の配列を Rust のベクタに変換するところに手こずったのでメモ

指定したサイズの配列を用意する

  • C++ は変数に[指定したサイズ][指定したサイズ] でよい
#define FIELD_WIDTH (160)
#define FIELD_HEIGHT (160)

bool field[FIELD_HEIGHT][FIELD_WIDTH] = {};
  • Rust では、vec!の中身を Default::default(); 指定したサイズ にすればよさそう
const FIELD_WIDTH: usize = 100;
const FIELD_HEIGHT: usize = 50;

let mut field: Vec<Vec<bool>> = vec![vec![Default::default(); FIELD_WIDTH]; FIELD_HEIGHT];

https://users.rust-lang.org/t/attempt-to-use-a-non-constant-value-in-a-constant/32112/4

  • C++ の書きやすさを痛感...
  • いちいち cargo run で実行するのも面倒なので、Web アプリ化したいと思って色々調べたところ、次に触れる WebAssembly に行きついた

Rust + WebAssembly のチュートリアルをやってみた

  • 環境

    • Rust 1.65.0
    • wasm-pack 0.10.3
    • cargo-generate 0.17.3
    • node 16.15.1
    • npm 8.11.0
    • nvm 0.39.2
    • firebase-tools 11.17.0
  • 全てのファイルをアップロードできなかったので、変更した部分のみ GitHubにあげておく。

つまづいたポイント

wasm-pack test --chrome --headless
const playPauseButton = document.getElementById("play-pause");

の下に

playPauseButton.textContent = "⏸";

を追加した。

<link rel="stylesheet" type="text/css" href="index.css">
  • デプロイ時は、dist フォルダに index.css をコピーする

以上になります、最後までお読みいただきありがとうございました。

参考

Discussion