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

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

こんにちは!
塾講師のdainarです。
今週末〜日曜日にかけての雨で桜の花が散り始めるみたいです・・・
天気が良ければ日本酒片手に散歩がてら”ぼっち花見”でもやろうかと思っていたのですが(笑)

さて、今回は前回お伝えしたようにプログラムをつかって『絵』を描いてみたいと思います。

目次 
1. ウィンドウの中に円を描いてみよう♪
2. 色を変えてみよう♪

ウィンドウの中に円を描いてみよう♪


さっそくプログラムの方を見ていきましょう。

circle1.png

まず、ウィンドウや入力用のテキストボックスなどをグラフィカルな画面で操作するために「tkinter」(Python標準付属)というモジュールをインポートします。※「tkinter」少し長いので省略して「tk」で使えるようにしています。

root = tk . Tk ( ) —— ウィンドウを作る”おまじない”

最後の
root . mainloop ( )—— ウィンドウを表示する”おまじない”

と覚えてくださいね!
さらに

root . geometry ( ” 600 x 400 ” )

でウィンドウの”ヨコ(幅) x タテ(高さ)”のサイズを指定しています。
※「x」はアルファベットの小文字の「x」です。

次にこのウィンドウの上に図形や画像を描画するキャンバスを重ねます。
Canvasメソッドを実行し、ウィンドウと同じ大きさのキャンバスを作りました。
メソッド→ここでは関数の一種という理解でいいと思います。
canvas = tk . Canvas ( root, width =600, hight =400, bg = ” white ” )

最後の「bg」はbackground = 背景色の意味です。
canvas は変数なので好きな名前に変えることもできます(例 gayoshi)
キャンバスを作成したら、placeメソッドを実行して、ウィンドウのいちばん左上(座標の(0, 0))に配置させます。

canvas . place ( x軸, y軸 ) —– 今回は( 0 , 0 )に設定

では、いよいよ円を描いてみましょう♪

canvas . create_oval ( 300 – 20, 200 – 20, 300 + 20, 200 + 20 )

最初の2つのペアが左上の座標、次の2つのペアが右下の座標になります。
これにより「中心が(300, 200)」にある「半径20」の円が描かれます。

circle2.png

イメージとしては始点( 300 – 20, 200 – 20 )と( 300 + 20, 200 + 20 )から伸びる直線でつくられた正方形に内接する円のイメージです。わかりにくいかな?

色を変えてみよう♪


現在は「白い」キャンバスに「黒い」線で円が描かれていますが、もし色を付けたいときや線幅を変えたいときは、width、outline、fillの各オプションを使います。

width: 線の幅
outline: 線の色
fill: 塗りの色

circle3.png

まず、こちらの画像ですが「キャンバスの色を変え」「線の幅を太くし」「赤で塗って」います。

circle4.png

「bg = ” yellow “」 「fill = ” red “ 」「 width = 3」という変更を行いました!
こちらはどうでしょうか?

circle5.png

circle6.png

「bg = ” green “」 「fill = ” blue ” 」「 width = 0」さらに半径も20→80と大きくしました!
色や大きさを”自由に”変えることができるようになると何だかワクワクしませんか?

皆さんもどんどん手を動かし、試行錯誤し、ググりながら楽しんでみてくださいね♪
それでは、また!次回。

※参考図書=『いちばんやさしいPython入門教室』大澤文孝(著) ソーテック社
サービス数40万件のスキルマーケット、あなたにぴったりのサービスを探す