> ## Content Index
> Fetch the complete content index at: https://www.geekjp.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# pycharm（IDE)＋python3（言語）＋pygame（ライブラリ）で画像表示　第２回
- URL: https://www.geekjp.com/2019-10-07-195352/
- Published: 2019-10-07T10:53:52.000Z
- Updated: 2026-08-01T12:33:49.000Z
- Description: Python 3・PyCharm・Pygameを使い、PNG画像を読み込んで画面に表示する手順を解説。プロジェクトと画像の準備から、画像の読み込み、描画、透過PNGの表示までを試します。
- Author: 工学じじい
- Tags: ゲームプログラミング, 技術, アルゴリズム, プログラミング, Python, Pygame, #Import 2026-07-19 20:21, #Import 2026-07-19 20:24

## 

## pycharm（IDE)＋python3（言語）＋pygame（ライブラリ）で画像表示 第２回

- [pycharm（IDE)＋python3（言語）＋pygame（ライブラリ）で画像表示 第２回](#pycharmIDEpython3%E8%A8%80%E8%AA%9Epygame%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA%E3%81%A7%E7%94%BB%E5%83%8F%E8%A1%A8%E7%A4%BA%E7%AC%AC%EF%BC%92%E5%9B%9E)  
  - [プロジェクトを作成](#%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%82%92%E4%BD%9C%E6%88%90)  
    - [画像表示の練習用のプロジェクトを作成](#%E7%94%BB%E5%83%8F%E8%A1%A8%E7%A4%BA%E3%81%AE%E7%B7%B4%E7%BF%92%E7%94%A8%E3%81%AE%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%82%92%E4%BD%9C%E6%88%90)
    - [画像を用意](#%E7%94%BB%E5%83%8F%E3%82%92%E7%94%A8%E6%84%8F)
  - [画像の読み込み表示するスクリプトの記述](#%E7%94%BB%E5%83%8F%E3%81%AE%E8%AA%AD%E3%81%BF%E8%BE%BC%E3%81%BF%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%97%E3%83%88%E3%81%AE%E8%A8%98%E8%BF%B0)
  - [いよいよ実行](#%E3%81%84%E3%82%88%E3%81%84%E3%82%88%E5%AE%9F%E8%A1%8C)
  - [所感](#%E6%89%80%E6%84%9F)

### プロジェクトを作成

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

とは言いながら、ぶっちゃけ前回の使いまわし or 前回のプロジェクトにスクリプト[\*1](#f-3513e849)を追加でいい思います。  
少なくとも、スクリプトは前回のものに追加していきます。  
(ここでは、プロジェクト名：mygame02、スクリプト名：mygame02.pyとしました[\*2](#f-23bb677b)）

#### 画像を用意

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

> pygame.image.loadコマンドで読み込み可能な画像形式は、基本的に非圧縮BMP形式のみ。  
> ほかの画像形式をサポートしているバージョン（なんだそれ？）のみ、以下の形式が読み込み可能JPGPNGGIF (アニメーションはダメ）BMPPCXTGA (非圧縮形式のみ)TIFLBM （PBM）PBM(PPM, PGM)XPM
> 
> 画像の保存は、以下の形式のみに対応しています。BMPTGAPNGJPEG

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

\*今回使った画像情報\*

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

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

![f:id:gomta777:20191007173410p:plain](https://www.geekjp.com/content/files/images/import/hatena/2019/10/20191007173410.png "f:id:gomta777:20191007173410p:plain")

図：画像の配置

これでやっとこ準備完了かなぁ。

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

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

[Gistのソースコードを直接開く](https://gist.github.com/gomta777/165a6c4b496a36aeaad6cf12b209e037?ref=geekjp.com)

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

### いよいよ実行

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

![f:id:gomta777:20191007192055p:image:w300](https://www.geekjp.com/content/files/images/import/hatena/2019/10/20191007192055.png "f:id:gomta777:20191007192055p:image:w300")

図：実行画面

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

### 所感

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

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

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

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

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

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

[\*1](#fn-3513e849):なんか、いろいろWeb回った結果スクリプトって呼んでる人が多いからこっちで呼ぼうかの

[\*2](#fn-23bb677b):前回と微妙に整合性合わなぐなったじゃ

[\*3](#fn-1569a608):読み込みはBMP規定なのになんでじゃい！

[\*4](#fn-f2d79ed3):画像も、スクリーンも原点は左上