GIMPでLGTM画像をつくろう！（python-fu）

# はじめに
リモートワークが増えてきてコードレビューとかがコメントのやりとりで終わる。。。さみしい:sob: 
そんなコードレビューにも彩りを与えてくれるのが LGTM 画像！今回はフリーの画像編集ソフト [GIMP](https://www.gimp.org/downloads/) の python-fu をつかって LGTM 画像をつくってみます！

# 環境
* macOS Cattalina バージョン 10.15.3
* GIMP 2.10.14
* Python 2.7.15

# 成果物
完成形はこんな感じ

| 編集前 | 編集後 |
| --- | --- |
|![before](https://user-images.githubusercontent.com/34936885/81646126-a8092200-9465-11ea-8a53-656f5200acc4.png)|![after](https://user-images.githubusercontent.com/34936885/81646227-d555d000-9465-11ea-9a91-c9780798568d.png)|

<details><summary>ソース</summary><div>

```python
#!/usr/bin/env python
# -*- coding: utf-8 -*-

from gimpfu import *
import os

def plugin_main(image, layer, dir_path):
  if (not type(dir_path) == type("") or not len(dir_path)):
    gimp.message("フォルダを選択して下さい")
    return

  add_lgtm(image, layer, dir_path)

def draw_text(image, size, text):
  layer = pdb.gimp_text_layer_new(image, text, "Hiragino Sans", size, 0)
  image.add_layer(layer)
  # 白色にする
  pdb.gimp_text_layer_set_color(layer, (255, 255, 255, 1.0))
  return layer

def draw_shadow(image, text_layer):
  # 範囲選択
  pdb.gimp_selection_none(image)
  pdb.gimp_image_select_item(image, 0, text_layer)

  # 描画色の設定
  maskcolor = (0, 0, 0, 1.0)
  pdb.gimp_context_set_foreground(maskcolor)

  opacity = 15 # 薄くする
  shadow_layer = gimp.Layer(image, "shadow", image.width, image.height, RGB_IMAGE, opacity, NORMAL_MODE)
  image.add_layer(shadow_layer, 1) # テキストの背面に追加

  # アルファチャンネルの追加
  pdb.gimp_layer_add_alpha(shadow_layer)
  pdb.gimp_edit_clear(shadow_layer)
  shadow_layer.fill(TRANSPARENT_FILL)

  # 選択範囲拡大
  pdb.gimp_selection_grow(image, 2)
  # 塗りつぶし
  pdb.gimp_edit_fill(shadow_layer, FOREGROUND_FILL)
  
def cal_font_size(image):
  width = image.width / 4
  height = image.height
  max_font_size = 160
  return min([width, height, max_font_size])

def save_file(image, layer, dir_path, file_name): 
  file_path = dir_path + '/' + file_name
  #画像を保存
  pdb.file_png_save(image, layer, file_path, file_path, 1.0, 0, 0, 0, 0, 0, 0)

def add_lgtm(image, layer, dir_path): 
  font_size = cal_font_size(image)
  text_layer = draw_text(image, font_size, 'LGTM')

  # 上下中央寄せ
  x = image.width/2 - text_layer.width/2
  y = image.height/2 - text_layer.height/2
  text_layer.set_offsets(x, y)

  draw_shadow(image, text_layer)

  # レイヤー統合
  flatten_layer = pdb.gimp_image_flatten(image)

  # 保存
  file_name = 'lgtm.png'
  save_file(image, flatten_layer, dir_path, file_name)

register(
  "python_fu_add_lgtm",
  "Add LGTM",
  "Add LGTM text",
  "am",
  "am",
  "2020/5/11",
  "<Image>/Filters/Languages/Python-Fu/AddLGTM", 
  "RGB*, GRAY*", 
  [
  (PF_DIRNAME, "directory_path", "Save directoryPath", ""),
  ],
  [], 
  plugin_main) 

main()
```

</div></details>

上記のソースをコピーして権限を付与し下記フォルダに格納して GIMP を起動します。

```
Library/Application Support/GIMP/2.10/plug-ins
```

<img width="500" alt="python-fu" src="https://user-images.githubusercontent.com/34936885/81646239-ddae0b00-9465-11ea-8704-87f300804222.png">

画像のようにフィルター(R) → Python-Fu に AddLGTM というのが追加されます。

# 使い方
下記手順で選択したフォルダに「LGTM」を追加した画像が保存されます。

1. GIMPで画像を開く
2. フィルター(R) → Python-Fu → AddLGTM 選択
3. 保存先選択
4. OK

# つくり方
python-fu の作成方法については以前書いたこの記事を参考にどうぞ 
[GIMPのスクリプト（python-fu）のつくり方について書くで？:punch::punch:](https://qiita.com/am10/items/5c62cda827c405932064)

今回つくったものは文字の追加、文字の枠線追加など色々なプロシージャを使わなければいけなかったのでプロシージャの検索方法について記載します。

この記事がすごく参考になりました。 
[GIMPで画像を一括でレベル補正（Python-Fu）](https://qiita.com/7shi/items/3253d5766a4c65cb1a1f)

## プロシージャの検索方法
1. [GIMP (GNU 画像編集プログラム)](https://docs.gimp.org/ja/)で該当機能を探す
2. GIMPのヘルプ(H) → プロシージャーブラウザー(B) で該当ページの URL の末尾の検索を行う

例えば、LGTM 文字列を選択してこの選択範囲を拡大するためのプロシージャーの検索を行う場合は

[4.12. 選択範囲の拡大..](https://docs.gimp.org/ja/gimp-selection-grow.html)というページがあります。 
URL は下記のようになっています。 
https://docs.gimp.org/ja/gimp-selection-grow.html
GIMPのヘルプ(H) → プロシージャーブラウザー(B) で `gimp-selection-grow`  と検索すると下記がヒットします。

<img width="500" alt="procedure" src="https://user-images.githubusercontent.com/34936885/81646275-edc5ea80-9465-11ea-8a1f-ca7d5ee5dd75.png">

`pdb.gimp_selection_grow(image, 2)` とすることで選択範囲を 2px 拡大することができます:clap:

# さいごに
ひさびさに GIMP を使いたくてつくってみましたが、LGTM 追加するのにわざわざ GIMP で開くのめんどくせぇ:confused: 
LGTM 画像の作成は他にも色々サービスあると思うんで検索してみるといいと思います:rolling_eyes:  
スクリプトはわりとコメント記載してるんで気に入らない部分などあれば各自書き換えて使ってみてください！ 
みんなで LGTM 画像を量産してコードレビューに彩りを与えよう:fire: