工学じじいの縁側日記

工学じじいの縁側日記

引退間際の工学じじいがきままに、プログラミングやデバイス、工学について呟きます。

初心者がpython3とpygameでソートアルゴリズムを可視化してみる【バブルソート】【インサーションソート】

バブルソート

前回に引き続いて調子に乗って別のソートアルゴリズムも試してみました。
まぁありがちですが。。。

バブルソートは隣り合う要素の値を比較して条件に応じた交換をしてゆき。
最大値(または最小値)を逐次右端(または左端)に寄せていくことによりソートを実現します。
大きい順(または小さい順に)順次値が泡のように浮いていくのでバブルソートと呼ばれます。
詳しいことは、ググるとたくさん載ってるのでこの辺でw

効率については、悪いほうのアルゴリズムです。

とりあえず、pythonだと実装めっちゃ簡単でびっくりしました。
(まぁ、速度はC/C++の方が早いんだろうけど)
何がって、値の交換が

a, b = b, a

で書けるってのがでかいですね。
バブルソートやインサーションソートのようにインデックスベースで入れ替えが起こる処理では、楽できるね。

結果

www.youtube.com


前回同様、入れ替えの操作をリストに記録して、後で再生してます。

インサーションソート

注目要素の値を、順次適切な位置に挿入することによって、整列を行うアルゴリズムです。
処理が簡単なので、バブルソートのように隣接する要素と比べて値を交換していきますが、適切な挿入位置に値が収まると次のループに移行します。


結果

www.youtube.com

動画を見ると、バブルソートとインサーションソートの違いが判ると思います。

所感

交換していく系のソート2つを実装してみました。
リストの操作や、繰り返しでミスったりいろいろありましたが、pythonの練習にはちょうど良かったかな?
そして、pygameが使いづらい。。。
enchant.jsで遊んでた時はとても楽だったのに笑
くじけずもうちょい遊んでみようかなって思います。

へだば、また!

初心者がpython3とpygameでソートアルゴリズムを可視化してみる【単純選択ソート】

python3とpygameでソートアルゴリズムを可視化してみる

準備

ひな形として、

ko-gaku-jiji.hatenablog.jp

この辺を参考にプロジェクトを作り、スクリプトを書いていきます。

スクリプトの記述

初心者が書いたスクリプトなので、冗長で稚拙かもしれないですが、一応動きましたので、載せておきます。


結果

youtu.be

所感

んー。while True内でイベントを処理しているので、イベントリブンのコールバック的な書き方ができない。
やり方あるのかもしれないですが、ユーザー定義イベントと、必要なもの(交換の作業ログ)を保存して、アニメーションとして再生する方法をとりました。(インチキ臭い)
よくわからんで書いているので、アドバイスいただければ幸いです。
へだば、まだ!

python3とpycharmとpygameで画像表示してみた 第3回

画像を拡大縮小してみる

図:今回の目標

使うもの

前回までで、画像を表示できたのですが、画像を張り付けるときに拡大縮小をしてみます。
画像自体のサイズを変えてもいいのですが、今回は読み込んだ画像をプログラムの中で拡大縮小してみました。

使うモジュール

pygame.transformモジュール

を使います。
pygame.taransformモジュールには、いくつか拡大縮小ができるメソッドがあります。

モジュール 機能 備考
pygame.taransform.scale 指定Surfaceの拡大縮小を行う 速さ重視で拡大縮小
pygame.transform.smoothscale 指定Surfaceの拡大縮小を行う 見た目重視で拡大縮小*1

それぞれ引数は、(surface, (width, height)) で、変換後のsurfaceを返すメソッドになっています。

スクリプトを変更

今回は、pygame.transform.smoothscaleメソッドを使って拡大縮小してみます。
こっちのメソッドにした意味は。。。特にないです。なんとなく。

mainの中をこう変更します。
やっていることは、

  1. imagerectに元画像の幅と高さを記録
  2. ratioに拡大縮小率を決定
  3. ratioとimagerect.widthを使って変換後の画像幅を計算
  4. ratioとimagerect.heightを使って変換後の画像高を計算
  5. 元画像(image)を(imagerect.width, imagerect.height)の大きさに変換

となっています。

実行例(ratio=0.2)

図:ratio=0.2の時の実行例

ちゃんと縮んでますね!

実行例(ratio=2.0)

図:ratio=2.0の時の実行例

こちらもちゃんと拡大されています!

所感

拡大縮小も簡単にできました。
実は、紹介したメソッドのほかにも、拡大縮小できるメソッドが幾つかあります。

メソッド 戻り値 機能
pygame.transform.rotozoom(Surface, angle, scale) surface 拡大縮小回転を同時に行う
pygame.transform.scale2x(Surface) surface 画像を2倍に拡大

pygame.transform.smoothscaleのところを変更するだけなので試してみると面白いと思います。

図:pygame.transform.rotozoom(image, -45.0, 0.5)の例

こんけできれば、いろんたごだやれそんたなっす!*2
へだば、まだ。*3

12歳からはじめる ゼロからの Pythonゲームプログラミング教室

*1:拡大縮小に適用されるフィルタも指定できますが、ここでは割愛します

*2:このぐらいできれば、いろんなことができそうですね

*3:それじゃ、また!

python3とpycharmとpygameで画像表示してみた 第2回

pycharm(IDE)+python3(言語)+pygame(ライブラリ)で画像表示 第2回

プロジェクトを作成

画像表示の練習用のプロジェクトを作成

とは言いながら、ぶっちゃけ前回の使いまわし or  前回のプロジェクトにスクリプト*1を追加でいい思います。
少なくとも、スクリプトは前回のものに追加していきます。
(ここでは、プロジェクト名:mygame02、スクリプト名:mygame02.pyとしました*2

画像を用意

自分で用意、またはWebから、利用可能な画像を用意します。
pygameの公式ガイドによると、利用可能な画像形式は(日本語訳はちょい適当です)。。。


pygame.image.loadコマンドで読み込み可能な画像形式は、基本的に非圧縮BMP形式のみ。
ほかの画像形式をサポートしているバージョン(なんだそれ?)のみ、以下の形式が読み込み可能

  • JPG
  • PNG
  • GIF (アニメーションはダメ)
  • BMP
  • PCX
  • TGA (非圧縮形式のみ)
  • TIF
  • LBM (PBM)
  • PBM(PPM, PGM)
  • XPM

画像の保存は、以下の形式のみに対応しています。

んーと、先日インストールしたばかりなので、きっとBMP以外の画像形式でも読めるでしょうという見切り発車の元、PNG形式の画像を用意してみました。

図:今回使った画像(ファイル名:char1.png

*今回使った画像情報*

画像名 char1.png
画像形式 PNG
サイズ 369x480

これをスクリプトがあるフォルダに移動します。

f:id:gomta777:20191007173410p:plain
図:画像の配置
これでやっとこ準備完了かなぁ。

画像の読み込み表示するスクリプトの記述

やっとこスクリプトを記述していきます。

前回からの変更点はコメントで書いておきました。

いよいよ実行

メニュー → RUN → RUN で実行します。

図:実行画面

こんな感じになりました。PNGの透過部分もちゃんと透過されて描画してくれてますね。
スプライトの処理を自分で書かなくてもよさそう。

所感

前回のところまで、できていれば割と簡単に画像の表示はできるみたいな気がした。
折角なんで、今回使ったクラス?モジュール?のちょっとした開設を付け加えておこうかと思います。

モジュール名 機能 備考
pygame.image.load 指定したファイル名の画像を読み込む 読み込んだ画像から新しいSurfaceを生成
pygame.image.save 指定したSurfaceを画像として保存します 指定なしはTGA形式の画像に保存*3
pygame.image.get_extend 規定以外のファイルが使えるか確認 結果はbooleanで返ってくる
pygame.image.tostring 画像を文字形式に変換する 今は省略
pygame.image.fromstring 画像を表す文字形式のデータからSurfaceを生成 今は省略
pygame.image.frombuffer 文字列形式の画像情報から直接Surfaceを生成 今は省略

読み込まれた画像はSurfaceに変換されます。Surfacepygameで画像の情報をメモリ内で保存する形式だと思えばいいのかと。
様々なフォーマットを読み込んでも、pygame内ではSurfaceって共通形式で扱える!かな。
詳しいことは後でやる気あったら書こうかのぉ。

また、画面に画像を張り付けるコマンド

screen.blit(image, (0, 0))

imageは画像から生成したSurfaceです。後ろの引数は、表示位置*4で、画像の原点をスクリーンのどこへ張り付けるか、っていう指定。
つぎは、画像を動かしてみようかな。
へば、また!

*1:なんか、いろいろWeb回った結果スクリプトって呼んでる人が多いからこっちで呼ぼうかの

*2:前回と微妙に整合性合わなぐなったじゃ

*3:読み込みはBMP規定なのになんでじゃい!

*4:画像も、スクリーンも原点は左上

python3とpycharmとpygameで画像表示してみた 第1回

pycharm(IDE)+python3(言語)+pygame(ライブラリ)で画像表示

環境を整える

pycharmとpython3

 pycharmは普通にダウンロードしてインストールしたものを使います。特に何も設定していません。
 www.jetbrains.com

 python3はAnacondaのものを使いました。こちらも特に何も設定していません。
(じじいなのでAnacondaのupdateでちょい嵌りました。原因は、普通のwindows power shellで実行してたこと(;'∀')、スタートメニューからAnaconda PowerShell Promptから実行するとすんなりいきました)
 www.python.jp

pygameのインストール

 これも、じじいなのでちょい嵌りました。じじいの環境では、pycharmdでプロジェクトを作成し、そのプロジェクトにProject Interpreterから、ライブラリを追加する方法ではうまくいきませんでした。(じじいの環境では。。。)

そこで、Anaconda PowerShell Promptからインストールする方法(きっとが*1でこいづが普通なんだべな?)で試してうまくいきました。

python -m pip install pygame

f:id:gomta777:20191006130802p:plain
図:pygameのインストール

プロジェクトの作成 in Pycharm

上部のメニューから FILE→ New Project でプロジェクトを作成します。(ここでもちょい嵌りやんした)
①プロジェクト名を決めます。(ここは通常通りで問題ないよね)
②virtual envの設定(Project Interpreter: New Virtualenv environment)の"Inherit global site-packages"にチェック(これやらないと、仮想環境にさっきインストールしたpygameが反映されない?)
③右下Createボタンをクリック

f:id:gomta777:20191006134307p:plain
図:pygameプロジェクトの作成

これで、問題なくプロジェクトができるはず!

ソースコードの追加 in Pycharm

ここまで来たら、あとは通常のプロジェクトみたいにSourceファイルを追加します。
Pycharm左側のProjectの画面の自分のプロジェクト名が表示されている部分を右クリック → New → Python File を選択します。

f:id:gomta777:20191006135549p:plain
図:ソースファイルの追加

次に、ファイル名を入力します(プロジェクト名もソースファイル名も任意です)

f:id:gomta777:20191006135901p:plain
図:ファイル名の入力

ここまでくれば後は、やっとこソースコードの入力にたどり着けます。

サンプルプログラムを動かしてみる

ソースコードの入力

画面右側のソースコード入力画面に、一番シンプルそうなサンプルを入力してみます。

import pygame
from pygame.locals import *
import sys


def main():
    pygame.init()  # ライブラリの初期化
    screen = pygame.display.set_mode((600, 400))  # 画面サイズを指定
    pygame.display.set_caption("Game Test")  # ウィンドウタイトルを設定

    while True:
        screen.fill((203, 255, 135))  # 画面を指定色(R,G,B)で塗りつぶし
        pygame.display.update()  # 画面の更新

        for event in pygame.event.get():  # 終了イベントの処理
            if event.type == QUIT:
                pygame.quit()
                sys.exit()


if __name__ == "__main__":  # このスクリプトがトップで実行されたときのみmainを呼ぶ
    main()

んー。結構長い。。。

いよいよ実行

まず、作成したソースコードを確実に保存してください。エラーがあれば、エディット画面に電球マークが出ていると思うので、適切に修正してください。
作成したソースコードPythonの場合はやっぱスクリプトっていうんだべか?)を実行してみます。
メニューからRUN → RUN を選び押します。

f:id:gomta777:20191006142414p:plain
図:実行画面

さっき指定した色とタイトルのウィンドウが出現すれば大成功!

所感

Pycharmを使ってPython3でpygameの一番簡単なサンプルを書いて実際に動かしてみました。
画像を表示するところまではたどり着かなかったので、次は画像の読み込みと表示をやってみます。
また、Pygameはゲームライブラリということなので、図形などの描画、当たり判定、アニメーションなどが簡易的に記述できるはずです。
次回以降その辺をちょっとずつ試していこうと思います。

へば、また。

*1:きっとがで→南部弁(岩手県北部)で、たぶん、おそらく、を表す言葉