見出し画像

高校数学をプログラミングで解く（準備編）「3-3 pdeファイルの再利用」

MK's papa

マガジンリスト　＞　準備編 3.テキスト・関数　＞　3-3 pdeファイルの再利用


はじめに

記事『高校数学をプログラミングで解く（準備編）「3-2 関数の作成」』で関数の作成方法を説明しました。今回は、この作成した関数を別のpdeファイルに保存して、再利用する方法について説明します。

関数をpdeファイルに保存する

今回は、記事『高校数学をプログラミングで解く（準備編）「3-2 関数の作成」』で作成したスケッチ「drawDoubleCircle」をベースに説明します。具体的には、スケッチ「drawDoubleCircle」内で作成した関数doublecircleを別のファイル（pdeファイル）として保存します。

スケッチ「drawDoubleCircle」の準備

エクスプローラーを立ち上げ、記事『高校数学をプログラミングで解く（準備編）「3-2 関数の作成」』で作成したスケッチ「drawDoubleCircle」のフォルダに移動します（図1）。

図1　スケッチ「drawDoubleCircle」のフォルダ

スケッチ「drawDoubleCircle」内のdrawDoubleCircle.pdeをダブルクリックして、開発環境ウィンドウを立ち上げます（図2）。

図2　スケッチ「drawDoubleCircle」の開発環境ウィンドウ

また、このスケッチのソースコードは以下のようになっています。

// ２重円を描く
void setup(){
  size(300, 300);

  // ２重円の中心座標と大きい円の半径
  float x = width/2.0;
  float y = height/2.0;
  float r = 100.0;

  // ２重円を描画
  doublecircle(x, y, r);
  
}

// ２重円を描くための関数
void doublecircle(
  float x, // 円の中心のx座標
  float y, // 円の中心のy座標
  float r  // 大きい円の半径
){
  circle(x, y, 2.0 * r);
  circle(x, y, 1.0 * r);
  return;
}

ソースコード1　2重円を描くためのプログラム

関数を別ファイル（pdeファイル）として保存する

では、ソースコード1の下部に作成したdoublecircle関数をpdeファイルとして保存していきます。
具体的には、次の手順で行います。

① スケッチ「drawDoubleCircle」の開発環境ウィンドウのタブ欄にある▼のボタンを押すと、メニューが表示されるので、「新規タブ」を選択します。

図3　メニューから「新規タブ」を選択

② 「新規名」ダイアログが表示されますので、「ファイルの新しい名前:」の入力欄に「makeDoubleCircle」と入力して、「OK」ボタンを押します。

図4　新規名ダイアログ

③ タブ欄に新たに「makeDoubleCircle」タブが追加されます。

図5　「makeDoubleCircle」タブが追加される

④「drawDoubleCircle」タブを選択し、そのテキストエディタ部分に書いてあるコード（ソースコード1）のdoublecircle関数の部分

// ２重円を描くための関数
void doublecircle(
  float x, // 円の中心のx座標
  float y, // 円の中心のy座標
  float r  // 大きい円の半径
){
  circle(x, y, 2.0 * r);
  circle(x, y, 1.0 * r);
  return;
}

を切り取り、その部分を「makeDoubleCircle」タブのテキストエディタに貼り付けます（図6）。

図6　「makeDoubleCircle」タブの記述

なお、このとき「drawDoubleCircle」タブのテキストエディタはsetup関数のみとなっています（図7）。

図7　「drawDoubleCircle」タブの記述

以上で、doublecircle関数をpdeファイル「makeDoubleCircle.pde」として保存することができました。実際、スケッチ「drawDoubleCircle」のフォルダを見てみると、「makeDoubleCircle.pde」ファイルが新たに作成されていることがわかります（図8）。

図8　「mokeDoubleCircle.pde」ファイルの生成

また、スケッチ「drawDoubleCircle」を実行してみると、期待通りに実行ウィンドウのキャンバスに二重円が描かれます。

図9　二重円が描かれる

つまり、「drawDoubleCircle.pde」ファイルに記述したsetup関数内で、別ファイル「makeDoubleCircle.pde」に記述したdoublecircle関数を正しく呼び出すことができていることがわかります。

以上のことから、ソースコードの記述を複数のpdeファイルに分けても、これらのpdeファイルを同じスケッチのフォルダに配置することで、1つのファイルに記述した関数から別のファイルに記述した関数を呼び出すことができることがわかりました。

pdeファイルを再利用する

関数doublecircleを「makeDoubleCircle.pde」ファイルにコピーして保存しましたので、今度はこのpdeファイルを再利用していきます。

pdeファイルをコピーする方法

例として、二重円の大きい円の半径を少し大きく（100pixelsから125pixelsに変更）して描くプログラムを新たに作成します。その際に上記で作成した「makeDoubleCircle.pde」ファイルを再利用することを考えます。

① 開発環境ウィンドウを立ち上げて、スケッチ名を「drawDoubleCircle2」として保存します。

図10　スケッチ「drawDoubleCircle2」の開発環境ウィンドウ

このとき、スケッチ「drawDoubleCircle2」のフォルダ内には「drawDoubleCircle2.pde」ファイルのみが入っています（図11）。

図11　スケッチ「drawDoubleCircle2」のフォルダ

② スケッチ「drawDoubleCircle」のpdeファイル「makeDoubleCircle.pde」を、スケッチ「drawDoubleCircle」のフォルダからスケッチ「drawDoubleCircle2」のフォルダにコピーします（図12）。

図12　ファイル「makeDoubleCircle.pde」をコピー

このとき、スケッチ「drawDoubleCircle2」の開発環境ウィンドウのタブ欄に「makeDoubleCircle」タブが追加されます（図13）。

図13　開発環境ウィンドウにmakeDoubleCircleタブが追加

③ タブ欄の「drawDoubleCircle2」タブを選択し、そのテキストエディタにsetup関数（ソースコード2）を記述していきます（図14）。

// ２重円を描く2
void setup(){
  size(300, 300);

  // ２重円の中心座標と大きい円の半径
  float x = width/2.0;
  float y = height/2.0;
  float r = 125.0;

  // ２重円を描画
  doublecircle(x, y, r);
  
}

ソースコード2　setup関数

図14　開発環境ウィンドウ（setup関数の記述後）

④ スケッチ「drawDoubleCircle2」を実行してみると、期待通りに実行ウィンドウのキャンバスに図9より少し大きい二重円が描かれます（図15）。

図15　図9より少し大きい二重円が描かれる

以上のことから、pdeファイルをスケッチのフォルダにコピーすることで、そのpdeファイルに記述した関数などを再利用することができることがわかりました。

スケッチごとコピーする方法

上記ではpdeファイルをスケッチのフォルダにコピーしました。ただ、今回例としている、二重円の大きい円の半径を少し大きく（100pixelsから125pixelsに変更）して描くプログラムは、スケッチ「drawDoubleCircle」の「makeDoubleCircle.pde」ファイルに記述したdoublecircle関数を再利用するだけでなく、「drawDoubleCircle.pde」ファイルに記述したsetup関数も再利用することができそうです。実際、setup関数は

  float r = 100.0;

の部分を

  float r = 125.0;

に変更するだけです。
そこで、再利用の方法としてスケッチごとコピーして再利用する方法についても説明しておきます。

① エクスプローラーを立ち上げて、スケッチ「drawDoubleCircle」のフォルダが入っているフォルダに移動します。

図16　スケッチ「drawDoubleCircle」のフォルダが格納されているフォルダを開く

② スケッチ「drawDoubleCircle」のフォルダをクリックして選択された状態にしてから、上部のコピーボタンを押します（図17）。

図17　スケッチ「drawDoubleCircle」を選択してコピー

③ その後、貼り付けボタンを押すと、スケッチ「drawDoubleCircle」のコピーが同じフォルダ内に作成されます（図18）。

図18　スケッチ「「drawDoubleCircle」のコピーを生成

④ スケッチ「drawDoubleCircle-コピー」のフォルダをクリックして選択した状態で、上部の「名前の変更」ボタンを押すと、名前を変更できる状態になるので（図19）、スケッチ名を「drawDoubleCircle3」に変更します（図20）。

図19　フォルダの名前を変更する
図20　「drawDoubleCircle3」にフォルダ名を変更

⑤ スケッチ「drawDoubleCircle3」のフォルダをダブルクリックして、「drawDoubleCircle3」のフォルダ内部に移動します。そして、「drawDoubleCircle.pde」ファイルをクリックして選択した状態で「名前の変更」ボタンを押すと、「drawDoubleCircle.pde」ファイルの名前を変更できる状態になるので、「drawDoubleCircle3.pde」に変更します（図21）。
これは、スケッチ「drawDoubleCircle3」のフォルダ内に、同じ名前のpdeファイル「drawDoubleCircle3.pde」がないと、スケッチ「drawDoubleCircle3」の開発環境ウィンドウを立ち上げることができなくなるためです。

図21　ファイル名をスケッチ名に合わせる

⑥ 「drawDoubleCircle3.pde」ファイルをダブルクリックすると、スケッチ「drawDoubleCircle3」の開発環境ウィンドウが立ち上がります。このとき、タブ欄には、「drawDoubleCircle3」タブと「makeDoubleCircle」タブとの2つが表示されており、pdeファイルを正しく読み込んでいることがわかります。また、「drawDoubleCircle3」タブのテキストエディタには、スケッチ「drawDoubleCircle」の「drawDoubleCircle.pde」ファイルに記載されているsetup関数と同じものが記載されています（図22）。

図22　スケッチ「drawDoubleCircle3」の開発環境ウィンドウ

⑦ 最後に、setup関数内の

  float r = 100.0;

の部分を

  float r = 125.0;

に変更すると、二重円の大きい円の半径を少し大きく（100pixelsから125pixelsに変更）して描くプログラムに修正することができ、実際、実行ボタンを押すと、図15と同じ二重円が描かれます（図23）。

図23　図15と同じ二重円

まとめ

今回は、作成した関数を別のpdeファイルに保存して、再利用する方法について説明しました。
再利用する方法については「pdeファイルをコピーする方法」と「スケッチごとコピーする方法」の2つの方法を示しました。どちらの方法を利用するにしても、ポイントはpdeファイルをスケッチのフォルダ内に置くことで、そのpdeファイルに記述した関数などをそのスケッチで再利用することができるということです。これはプログラミング言語「Processing」の特徴の一つです。
今後のプログラム作成においてこのpdeファイルの再利用はよく使われます。何度も行うことで、少しずつ慣れていってください。

参考文献

Processingをはじめよう 第２版（オライリー・ジャパン、オーム社、ISBN9784873117737）

いいなと思ったら応援しよう！