![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
今回の記事の目的はProcessingの「自作関数」を理解し、自分なりに使ってみること。
この記事を書いている時点で、初心者の僕自身が分かりやすいように、とてもシンプルな円を、簡単に自作関数でつくっていますので、参考にしてください。
この記事を書いた人
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-user-profile-illustrationi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-user-profile-illustrationi-light-blue.png)
- クリエイティブコーディングで制作した作品と、上達のためにやったこと・学習過程を発信
- コンセプトは「クリエイティブコーディング1万時間の歩き方」
- 2024年にProcessingの構文のアウトプットを終え、2025年から作品制作開始(クリエイティブコーディングで作成した作品集)
目次
【Processing】自作関数について簡単に解説
自作関数について
- 自作関数は英語で “user-defined function” と言います
- Processingで自作関数を作ると、自分で決めた一連の処理を一つの名前で呼び出せるようになります
- 例えば、同じ絵を何度も描くときに便利。1回書いておけば、その後はその名前を呼ぶだけで同じことができます
- 【注意点】自作関数の名前は、他の命令と被らないようにすること。また、関数の中で使う変数も同じ名前を使わないように気をつけること
【Processing】自作関数の書き方【構文】
自作関数の書き方【構文】
void 自分で作った関数の名前(int x, int y) {
// ここに命令を書きます
}
(int x とint y)
はxとyの位置のこと。次の項目のコードの具体例で分かると思います。
また、(int x とint y)
の部分は(int x, int y, int weight)
のように増やすことができます。このコードの例も先の項目で書いています。
【Processing】自作関数の使い方をできるだけ簡単にして紹介【画像とコード】
【1】自作関数でufoのような形を書いてみる
自分でufo関数を作ります。
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide1.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide1.png)
void setup() {
// ウィンドウのサイズを500x500ピクセルに設定
size(500, 500);
}
void draw () {
// 背景色を白に設定(毎フレームリセット)
background(255);
// ufo関数を呼び出し、中心にUFOを描画
ufo(250, 250);
}
void ufo(int x, int y) {
// 与えられた座標(x, y)を中心に楕円を描画
// xとyは10行目の250, 250で設定
ellipse(x, y, 350, 150);
}
【2】自作関数のメリットを活かし、簡単にufoの数を増やす
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide2.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide2.png)
11行目と12行目に自作関数のufo関数を使って楽にUFOを増やす。
void setup() {
// ウィンドウのサイズを500x500ピクセルに設定
size(500, 500);
}
void draw () {
// 背景色を白に設定(毎フレームリセット)
background(255);
// ufo関数を呼び出し、3つの異なる位置にUFOを描画
ufo(250, 250); // 中心にUFOを描画
ufo(150, 150); // 左上にUFOを描画
ufo(400, 400); // 右下にUFOを描画
}
void ufo(int x, int y) {
// 与えられた座標(x, y)を中心に楕円を描画
// xとyは10行目から12行目で設定
ellipse(x, y, 350, 150);
}
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
簡単に増やすことができて楽。
【3】自作関数のパラメータの部分を増やす
以下の自作関数の部分の、int x, int yの部分を変更して増やし、形も変えやすくします。
void ufo(int x, int y) {
// 与えられた座標(x, y)を中心に楕円を描画
ellipse(x, y, 350, 150);
}
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide3.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/10/processing-user-defined-functions-guide3.png)
void setup() {
// ウィンドウのサイズを500x500ピクセルに設定
size(500, 500);
}
void draw () {
// 背景色を白に設定(毎フレームリセット)
background(255);
ufo(250, 250, 350, 100);
ufo(150, 150, 150, 50);
ufo(400, 400, 450, 50);
}
void ufo(int x1, int y1, int x2, int y2) {
ellipse(x1, y1, x2, y2);
}
【Processing】自作関数はどんな表現で使えそうか
図形とかを何度も書きたいときに使える。
自作関数を使うことで、コードが整理され、何度も同じ命令を書く必要がなくなりました。
長いプログラムを書くときにも役立ちます。
【Processing】自作関数を使ってみた感想
超基本的で、シンプルな図形だったとしても自分で関数を作るって楽しいです。
勉強と練習を積み重ね、自作関数を使いこなしていきます。
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
それでは今日もレッツワクワクコーディング。