Mapture愛用者が「Fuwari」に機能追加して公開しました 🎉

普段、スクリーンショット拡張アプリの「**Mapture**」を愛用していた自分が、今回Swiftの勉強を兼ねて、オープンソースとして公開されている「**Fuwari**」に機能追加をして公開しました。
開発の経緯や今回追加した機能、初めてSwiftを書いた感想などを書いていきたいと思います。

https://sskmy1024y.github.io/Fuwari/

## 2021年5月追記

本記事公開後、Fuwari本家の開発者である @kentya6 様から連絡をいただき、5月初頭に本家のアップデートが行われました🎉
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">今回のアップデートは、<a href="https://twitter.com/sskmy1024r?ref_src=twsrc%5Etfw">@sskmy1024r</a>さんが機能追加の記事やコードを書いてくださったことがきっかけになりました。<a href="https://t.co/WHfK9PiODG">https://t.co/WHfK9PiODG</a><br>改めてありがとうございました！</p>&mdash; けん / Kengo Yokoyama (@kentya6) <a href="https://twitter.com/kentya6/status/1389519440744747008?ref_src=twsrc%5Etfw">May 4, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

AppStoreでも公開されたとの事なので、皆様ぜひご利用下さい

https://apps.apple.com/jp/app/fuwari/id1187652334

なお以下の本記事は、執筆当時の記録としてそのまま残しておきます。


# 開発経緯

コードを書いている上で、ドキュメントや参考ページを見ながら作業をすることが多々あると思いますが、そんな時自分は「[Mapture](https://anatoo.jp/mapture/)」というソフトを使っていました。
機能としては、画面の好きな範囲を選択してスクショを撮影し、その画像を画面上に保持しておくことができます。
> ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265811/cbe002b5-eafe-989d-49b5-05148c8d18cc.png)
> チートシートを見ながらターミナルを叩く様子（Mapture配布サイトより引用）

このMaptureには「Gyazoに送る」という項目があって、元は撮影したスクショをGyazoに転送して共有できたのですが、ここ数年は使えなくなっていました。
2014年を最後に長らく更新されておらず、おそらくAPIが使えなくなったのでしょう。

もう少し頻繁にメンテナンスされている代替アプリはないかと探していたときに見つけたのが、「[Fuwari](https://github.com/kentya6/Fuwari)」でした。
2018年に公開されており、Qiitaで開発記事が上がっているほか、いろんなサイト様で紹介されているイケイケっぷり。

https://qiita.com/kentya6/items/00599091bd987b5fa797

モダンなアイコンが素敵で、早速乗り換えを検討したのですが……

- [ ] ワークスペース間で画像を共有できない（ワークスペース切り替えてもついてきてくれない）
- [ ] 透明度を変更できない
- [ ] クラッシュするバグがある
- [ ] メモリ使用率が雪だるま式に増えていく

と、所々不具合や、機能的な物足りなさ（Maptureに慣れていた所為）を感じてしまいました。

更新も途絶えてしまっているようなので、「せっかくMITで公開してくれているんだし、自分で直して公開しよう！」と思い立ったのが、今回の経緯です。

# 公開したアプリ

https://sskmy1024y.github.io/Fuwari/

Githubリポジトリは[こちら](https://github.com/sskmy1024y/Fuwari)です。
元のリポジトリをforkして、再配布形式で公開させていただいています。

デモ動画はこちら↓
![image.png](https://sskmy1024y.github.io/Fuwari/images/fuwari_demo.gif)

## 追加した機能

今回追加した機能や、バグフィックスの一覧です。

### 追加機能
- ➕右クリックメニューからGyazoに送信できる機能を追加しました
- ➕画像の拡大縮小をマウスドラッグで変更可能にしました
- ➕マウスウィールでキャプチャの透明度を変更できるようにしました
- ➕OS標準のダークテーマに対応しました
- ➕設定画面からドラッグ移動時の透明度を指定できるようにしました

### 変更箇所
- ✨Apple Siliconに対応したUniversal Binaryにしました
- ✨キャプチャのデフォルトショートカットをCmd+Shift+mに変更しました
- ✨キャプチャが全てのワークスペースで表示されるように変更しました

### バグフィックス
- 🐛キャプチャをESCでキャンセルするとアプリがクラッシュする問題を修正
- 🐛メモリーリークが発生していた問題を修正

## 機能比較

下はOS標準のスクショ機能も含め、各アプリを比較した表です。

|   | Fuwari(sskmy) | Fuwari(origin) | Mapture | OS標準(Cmd+Shift+4) | 
|---|:--:|:---:|:---:|:---:|
| 画面上にキープ | ✅ | ✅ | ✅ | ✖️ |
| ワークスペース間で共有 | ✅ | ✖️ | ✅ | - |
| 透明度の変更 | ✅ | ✖️ | ✅ | - |
| 共有リンクの生成（Gyazo） | ✅ | ✖️ | ✖️ | ▲（icloud） |
| ショートカットキーの設定 | ✅ | ✅ | ✖️ | ✖️ |
| ゴミファイルが残らない | ✅ | ✅ | ✖️ | ✖️ |

# はじめてのSwift

普段はTypescript中心にWebフロントやReactNativeばかり触っていて、Swiftをがっつり触ったのは初めてでした。
なので今回の機能追加は、とても学びになることが多かったです。

特に学びになった（足止め食らった）もの↓

- clone直後、フレームワークが最新のCarthageでビルドできなかった（超初歩）
- storyboardと<span>@</span>IBOutletする方法（超初歩）
- NSImageをbase64に変換して`multipart/form-data`で送信する方法
- Xcode projectで環境変数(.env)を使う最適解
- メモリリークという概念に初めて触れた

ここら辺は時間がある時に別途記事にしたいですね。

Swiftという言語の書き方については、Typescriptに似たような雰囲気があって、比較的スムーズに書くことができました。
Xcodeの補完やFix機能が優秀というのもあるのかもしれません。


# 今後の開発

Maptureの代替をようやく見つけた（作った）ので、自分自身がヘビーユーザとなり今後もメンテナンスしていくつもりです。
[Githubで公開してある](https://github.com/sskmy1024y/Fuwari)ので、不具合や追加機能のご要望等あればお待ちしております！
コメント欄や、[Twitter (<span>@</span>sskmy1024r)](https://twitter.com/sskmy1024r) での感想も承ります。

なお、オリジナルの更新が途絶えてしまっているので今回このような形で公開しておりますが、開発が再開された場合、ソースコードの提供を含めてオリジナル版の発展に貢献する所存です。

# 最後に

今回の開発を得て、オープンソースプロジェクトの偉大さを改めて感じました。
触れたことのない言語で１からこのアプリを開発をすることは、今の自分には到底無理だと思いました。
素晴らしいアプリを開発していただき、かつオープンソースとして公開してくださっている@kentya6様、本当にありがとうございます🙇‍♂️

そして世の中のOSSを公開してくださっている皆さん、OSSを使って新しい価値を生み出している皆さん、OSSを使ってくれている皆さん、ありがとうございます！！！