続・小学生向けのプログラミング教育でやる内容が難しい。

著者：高木信尚

公開日：2018/07/07

最終更新日：2018/07/07

カテゴリー：技術情報

タグ：C＃／プログラミング教育／正多角形

高木です。おはようございます。

昨日投稿した内容は見事に間違ってしまいました。
出勤前に慌てて投稿したとはいえ、ちょっと情けないですね。

せっかくですので、実際に検証するためのプログラムを作ってみました。
今回はそれを見ながら、どこが間違っていたのか確認していくことにしましょう。

今回のようなプログラムは、タートル・グラフィックスと呼ばれるもので、私もオブジェクト指向を最初に勉強したときに見たことがあります。
最近では教育用のよい環境がいくつも出ているようですね。
しかし、今回は反省を込めて、あえて自前での描画に挑戦します。

まず、タートル・クラスを作る必要があります。
言語は何でもかまわないのですが、手っ取り早く作るためにC#とします。
クラス名やメソッド名などに日本語識別子を使ったベタなコードです。

class タートル
{
  private readonly Graphics graphics;
  private bool ペンが下りて描画中 = false; 
  private PointF 現在位置;
  private PointF 向き = new PointF(0, -1); // 最初は上向き

  public タートル(Graphics g, PointF startLocation)
  {
    this.graphics = g;
    this.現在位置 = startLocation;
  }

  public void ペンを下ろす()
  {
    this.ペンが下りて描画中 = true;
  }

  public void ペンを上げる()
  {
    this.ペンが下りて描画中 = false;
  }

  public void 進む(float 長さ)
  {
    var point1 = this.現在位置;
    var point2 = new PointF(point1.X + this.向き.X * 長さ, point1.Y + this.向き.Y * 長さ);

    if (this.ペンが下りて描画中)
      this.graphics.DrawLine(Pens.Black, point1, point2);
    this.現在位置 = point2;
  }

  public void 右に曲がる(double 角度)
  {
    double radian = 角度 * Math.PI / 180;
    double cos = Math.Cos(radian);
    double sin = Math.Sin(radian);

    double dx = cos * this.向き.X - sin * this.向き.Y;
    double dy = sin * this.向き.X + cos * this.向き.Y;
    this.向き = new PointF((float)dx, (float)dy);
 }
  public void 左に曲がる(double 角度)
  {
    右に曲がる(-角度);
  }
}

class タートル

{

private readonly Graphics graphics;

private bool ペンが下りて描画中 = false;

private PointF 現在位置;

private PointF 向き = new PointF(0, -1); // 最初は上向き

public タートル(Graphics g, PointF startLocation)

{

this.graphics = g;

this.現在位置 = startLocation;

}

public void ペンを下ろす()

{

this.ペンが下りて描画中 = true;

}

public void ペンを上げる()

{

this.ペンが下りて描画中 = false;

}

public void 進む(float 長さ)

{

var point1 = this.現在位置;

var point2 = new PointF(point1.X + this.向き.X * 長さ, point1.Y + this.向き.Y * 長さ);

if (this.ペンが下りて描画中)

this.graphics.DrawLine(Pens.Black, point1, point2);

this.現在位置 = point2;

}

public void 右に曲がる(double 角度)

{

double radian = 角度 * Math.PI / 180;

double cos = Math.Cos(radian);

double sin = Math.Sin(radian);

double dx = cos * this.向き.X - sin * this.向き.Y;

double dy = sin * this.向き.X + cos * this.向き.Y;

this.向き = new PointF((float)dx, (float)dy);

}

public void 左に曲がる(double 角度)

{

右に曲がる(-角度);

}

これを使って、正三角形を描画してみることにします。
全部のコードを貼ると多いので、該当部分だけにします。

private void Draw(Graphics g, SizeF size)
{
  var t = new タートル(g, new PointF(size.Width / 2, size.Height / 2));
  var 内角 = 180.0 * (n - 2) / n;

  t.ペンを下ろす();
  for (int i = 0; i < 3; i++)
  {
    t.進む(100);
    t.右に曲がる(120);
  }
}

private void Draw(Graphics g, SizeF size)

{

var t = new タートル(g, new PointF(size.Width / 2, size.Height / 2));

var 内角 = 180.0 * (n - 2) / n;

t.ペンを下ろす();

for (int i = 0; i < 3; i++)

{

t.進む(100);

t.右に曲がる(120);

}

これはまあ問題ないでしょう。
どちらかといえば、タートル・クラスの検証用みたいなものです。

次が問題です。
正ｎ角形に対応するため、引数nを最後に追加します。

private void Draw(Graphics g, SizeF size, uint n)
{
  var t = new タートル(g, new PointF(size.Width / 2, size.Height / 2));
  var 内角 = 180.0 * (n - 2) / n;

  t.ペンを下ろす();
  for (int i = 0; i < n; i++)
  {
    t.進む(100);
    t.右に曲がる(180 - 内角);
  }
}

private void Draw(Graphics g, SizeF size, uint n)

{

var t = new タートル(g, new PointF(size.Width / 2, size.Height / 2));

var 内角 = 180.0 * (n - 2) / n;

t.ペンを下ろす();

for (int i = 0; i < n; i++)

{

t.進む(100);

t.右に曲がる(180 - 内角);

}

当たり前のことですが、右に曲がるのは内角ではなく、180° – 内角でなければなりません。
検証結果として、このプログラムを使って描画した正17角形を貼っておきます。

ちなみに、正127角形を描こうとすると、大きすぎてはみ出してしまいます。
進む距離を10にすると、次のようになりました。
どう見ても単なる円ですね。

何にせよ、結構今回の問題は（いろんな意味で）難しかったということがわかりました。