40代塾講師の「ほぼ独学プログラミング日誌。」20

『プログラミングで切り開く、新しい未来♪』

こんにちは塾講師のdainarです！
昨日は休憩時間中にPCがバグってしまいドキドキバクバクワナワナ→
声が上ずったままでの授業（反省）で生徒も気づいていたに違いない💧
なのでブログ更新が本日になっておりますm(_ _)m

目次
1. クリックされたところに描く
2. クリックされたところに移動する

クリックされたところに描く

今回はクリックという操作が入ります。
クリックされたときの処理の記述を「イベント(event)」と言い、キャンバスに対して行う場合はbindメソッドをつかって

canvas.bind ( イベント名, 関数名 )

のように記述します。
イベントと意味は以下の通りです。

例えば、マウスの左ボタンでクリックされたときに「click」という名前の関数を実行したいのなら

canvas.bind( “<Button-1>”, click )

というように記述し、クリックされたときにclick関数が実行されるようになります。
click関数の中身は・・・

def click ( event )
　・・・クリックされたときの処理をここに書く・・・

※ def は『自作関数』の意味でしたね！

上記のように「event」という引数として受け取る形にすることでeventにはクリックされたときの情報が入ります。

クリックされた場所のX座標 →「event.x」として
クリックされた場所のY座標 →「event.y」として知ることができる！

そこでcreate_ovalメソッドを使い、この座標を中心に円を描画すれば、クリックされた場所に円を描くことができます。

canvas.create_oval ( event.x – 20, event.y – 20, event.x + 20, event.y + 20, fill=”red”, width=0 )

ちなみにここまで説明してきた内容をまとめたプログラムがこちら↓↓↓
（インデントに注意してくださいね）

これを実行し、出てきたキャンバス上のいろいろな場所をクリックすると、次々に赤い円が描画されていきます♪

たのし〜♪( ´▽｀)／

クリックされたところに移動する

次に、クリックされたところに円が増えていくのではなく、”クリックしたところに移動する”ように動作を変えてみましょう。

そのためには、「もともと描かれていた円を消す」というようにします。
「消す」というよりは「消えたように見せる」プログラムを作るということです。キャンバスの背景が”白”なので「fill=”white”, width=0」として線のない白い円を赤い円に重ねれば、消えたように見えますね！
円を消すためには「前回、どの位置に円を描画したのか」という情報を保存しておく必要があります。そこで、変数xと変数yに「前回、描画した位置」を保存しておくことにします。
初期値（# 円の座標）はどのような値でもよいのですが、ここでは仮にキャンバスの中心となる(300, 200)としています。

実際のプログラムがこちら↓↓↓

実行してみると

まるで円が移動しているように見えますね。

「！」

なるほど！そういうことか！！！
手品的というか・・・コロンブスの卵というか・・・
”発想の転換”という意味でもプログラミングって役に立つんですね！
今回もお付き合いいただきありがとうございました。

次回はもっと動かしていきますよ〜お楽しみに♪＼＼\\٩( ‘ω’ )و //／／

※参考図書＝『いちばんやさしいPython入門教室』大澤文孝(著) ソーテック社