【解決】XDで文字の上下にある余白を削除したい！

「Adobe XDでフォントの余白分の高さを削除してくれるプラグインはないの？」というコメントを見かけました。確かにフォントによっては文字の上下が大きく空いていて，数値上のマージンと見た目のマージンに差が出ます。空きが実際どれくらいなのかわかりにくいですね。

ただテキストのパネルを見ても，Wordのようなトリミングくい込み設定などはなさそうです。

そこで今回は，選択しているテキストを，文字のアウトラインサイズの四角でマスクするAdobe XD用プラグイン「MaskText」を紹介します。

MaskTextって何？

選択しているテキストを，文字のアウトラインサイズの四角でマスクするAdobe XD用プラグインです。実行後，テキストはマスクグループの子要素になります。もし複数のテキストを選択している場合は，1つひとつ別々にマスクします。

実行できるメニューはこちらです。どれもマスクする点は同じですが，フィットさせる場所を幅だけ・高さだけ・幅と高さ両方の中から選べます。

Fit Width	幅は文字のアウトラインに合わせ，高さはテキストそのままでマスクする
Fit Height	幅はテキストそのままで，高さは文字のアウトラインに合わせてマスクする
Fit Bounds	幅はと高さ両方を文字のアウトラインに合わせてマスクする

今回のXDプラグインはAdobeの公開審査をすでに通過しているので，次のリンクから直接インストールできます。
https://xd.adobelanding.com/en/xd-plugin-download/?name=0f498295

「このページで“Adobe XD.app”を開くことを許可しますか?」と出たら許可してください。XDのプラグインマネージャが自動で開きます。その右のほうにあるインストールボタンを押せばインストールは完了です。

難しいことは何もありません。ただテキストを選択してプラグインを実行するだけです。動作イメージはこちら（Keyboard Maestroというアプリを使い，パレットで実行しています）。

簡単すぎです！

このプラグインは，テキストを複製してアウトラインを取ることでサイズを調べています。そのため，アウトライン化できない絵文字などはサイズが合わない可能性があります。
マスク用の四角は，位置と大きさを整数に合わせるため最大2pxほどテキストより大きくなることがあります。そのかわり文字の端が隠れることはありません。

これでまた少し仕事が速くなりました。今日もさっさと仕事を切り上げて好きなことをしましょう！

コードは長いので，ダウンロードして見てください。

このサイトで配布しているスクリプトやその他のファイルを，無断で転載・配布・販売することを禁じます。
それらの使用により生じたあらゆる損害について，私どもは責任を負いません。
スクリプトやファイルのダウンロードを行った時点で，上記の規定に同意したとみなします。