KotlinでもProcessingがしたい！ ～実践編～

# はじめに
本記事は「[Processing Advent Calendar 2021](https://adventar.org/calendars/6163)」6日目の記事です。
趣味で作ったテンプレートを通して得た知見を共有して~~Kotlin~~Processingユーザーを増やしたいと思います。

# Processing3への不満
普段Processingを好んで書いている私ですが、書いている時にいくつか不満も生まれるものです。

- コード補完が無い(公式IDE)
- fontとかシンタックスハイライトが見ずらい(公式IDE)
- ~~正直ダサい(公式IDE)~~
- 一つのフォルダに全てのコードを入れないといけない
- ラムダ式が使えない(まあProcessing4で入るんですけど)

OSSなのでコントリビューターの人には感謝の念が絶えないですが、それでも不満はあるものです。
そのため、違うエディタや違う言語を噛ませて書きたい、具体的に言うならKotlinで書きたいと考えました。

# 実践
というわけで、実際にKotlinでProcessingをやる方法を書いていこうと思います。
やるために面倒な環境を用意するのも無駄なので、[テンプレート](https://github.com/kota-shiokara/ProcessingForKotlinTemplate)を用意しました。
使用する技術スタックは以下の通り

- IntelliJ IDEA(エディタ)
- Gradle(ビルドツール)
- Git(バージョン管理システム。今回は下記のGithubを使用するために使用します。)
- Github(開発プラットフォーム。今回はテンプレートの共有のために使用します)

ですが、テンプレートを使用する場合、Gradleに関してユーザーが考えることはあまりありません。

## エディタの用意
KotlinでProcessingを書くとしても、不満点が解消される環境でなくては、意味がありません。そのため、エディタだけ用意してください。必要なのは、IntelliJ IDEAです。

下図の[ページ](https://www.jetbrains.com/ja-jp/idea/)でエディタをインストールしましょう。
![intellijDL.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/3548dedb-fcff-8931-0efc-91c514a075bd.png)

本題ではないので割愛しますが、インストールから各種設定まで終わらせてください。
Ultimateはお金がかかるので、無料で使用できる学生以外の方はおとなしく無料版を使うといいでしょう。

## Githubでリポジトリの用意
私が用意した[テンプレート](https://github.com/kota-shiokara/ProcessingForKotlinTemplate)は、Githubというサービスの機能を使用したテンプレートとなっています。
下図のページに飛んだあと、中央右に存在する緑のボタン`Use this template`を押します。
![github_repository.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/a25b9da6-257c-b0bf-bb91-9db71ce06121.png)

(Githubのアカウントを持っていない方は、作成してください。5分程度で終わると思います。Gitを使えないという方は、画面右のReleaseという箇所に`1.0`とあるリンクがあるので、そこをクリックし、飛んだページの下部にあるzipファイルをダウンロードしてください。)

さて、緑のボタンを押すと、Repository作成画面になったと思います。Repositoryの名前を記入し、Public(公開)かPrivate(非公開)かを選択して`Create ～`とある緑のボタンを押しましょう。
下図は一例ですが、このように`generated from ～`と書かれたRepositoryが生まれると思います。生まれたRepositoryをクローンしてください。
![github_example.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/b0b13957-9f0c-9d25-2db2-0187c2690ca8.png)

## コーディング
必要な装備は整いました。実際にコーディングをしていきましょう。
IntelliJ IDEAを起動すると下図のような画面がでてくると思います。(初期画面はこれと違う！という場合はごめんなさい)
![intelliJ_top.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/671c4517-744e-46bc-0d78-327988bff99e.png)
右上の`Open`をクリックして出現したポップアップから先ほどクローン(もしくはダウンロード)してきたRepositoryを開きましょう。リポジトリ自体を選択して良いです。
![intellij_select2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/9a2a9be7-84d2-3114-b398-22b7bbfbe20c.png)
便宜上、テンプレートの方の画面を見せることになりますが、このように見たことあるsetup関数やdraw関数が存在するだけのプロジェクトを見ることができるはずです。(main.ktないだろ！って人は`src/main/kotlin`の中を見てください)
![intellij_code.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/1974a59c-9bc8-8424-f146-06c9b3ecced8.png)

後は中に好きなように書いてもいいですしフォルダを分けてコードの保守性を高めてもいいです。Kotlinはpackageというものでコードを管理していて、同package内では好きなように参照できる上に、違うpackageであってもimportするだけで好きなように参照できます。
![intellij_code_completion.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/0401d082-eb84-610a-88ac-b1ae7882c1cd.png)

コード補完もこの通り。
補完が効かないじゃないかという人は、後述のGradleでのビルドの手順を行ってください。

## Gradleでのビルド
さて、コードを書き終わったはいいが試したい場合どうしようとなると思いますが、ここでGradleを使用します。これには二通りの方法があります。
### Run
公式IDEのように処理を走らせるだけしたい場合はこちらの方法をとりましょう。
Windowsではコマンドプロンプト、macOSではTerminalを開きましょう。一番楽なのはIntelliJ IDEAの下部にあるterminalというタブをクリックすることです。開いたあと、cdコマンドを使用してRepositoryの中に入りましょう。IntelliJ IDEAから入った場合は既にいるはずなので大丈夫です。
さて、該当の場所に入ったらそこで下記のコマンドを打ってください。

```bash
# Linux もしくは macOS
./gradlew run
```

```cmd
@rem windows(コマンドプロンプト)
gradlew run
```

後は処理が走るのを待ちましょう。

![intellij_run.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/442889/86496bea-ca23-1d2f-d972-ef286ac84464.png)
いつものProcessingの画面が出てきたらあなたの勝ちです。

## Build
さて、自分の作品を公開して他に人の環境で動かしてほしいと思ったことはありませんか？
例えばProcessingでゲームを作ったり、乱数が入っている動的なグラフィカルアートだと動画出力するより相手の環境で動かして遊んでもらった方が楽しいですよね。
そんな時は下記の魔法の言葉を打ってください。

```bash
# Linux もしくは macOS
./gradlew shadowJar
```

```cmd
@rem windows(コマンドプロンプト)
gradlew shadowJar
```
するとなんということでしょう、`build/libs/`の中に、`{projectの名前}-{バージョン}-all.jar`というファイルができたではありませんか。
お使いのPCにJavaの環境が整っていれば、

```
java -jar {projectの名前}-{バージョン}-all.jar
```
というコマンドで、処理を走らせることが可能となります。

# example
ここまで実践の方法を書いてきましたが、「じゃあどういう時に使うんや！」というのはいまいち実感できないと思います。そこで、実際にコーディングしました。

[Kotlin/Processing] Kotlinで...Processing！？ https://www.youtube.com/watch?v=RSlW2kExtlI
<iframe width="560" height="315" src="https://www.youtube.com/embed/RSlW2kExtlI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

○×ゲームを実際に作っています。
ぐだぐだだったり青軸の音がちゃがちゃしてますが、まあ参考程度になるとは思います。

# 終わりに
正直スケジュールや他のタスク的に記事書くの大変でしたが、これでKotlinユーザーが増えればもうけもんと思い頑張りました。皆さんもProcessing for KotlinでぜひKotlinデビューしてみてください。