オリジナルなボタンを作成する
アイコン(フォント文字)の編集 に FontForge
アイコンを編集するには、当管理人は普段は「TTEdit」を利用しているのですが、
有料ですし、所持していない人がほとんどでしょうから、
ここでは、無料で使える「FontForge」という有名なソフトでの解説とします。
FontForgeをインストール
普通にインストールしてください
HmToolBar.ttfの読み込み
FontForge を起動して、HmToolBar.ttf ファイルを読み込みます。
デフォルトだと「Document」と見えているところをマウスでクリックして、
順番にファイルをたどっていくか、
もしくは、パスを指定してファイルを読みこむのですが
下の画像にあるようにパスの形式は「/」にする必要があり「\」のままでは読み込めません。
「ファイルが見つかりません」といったエラーは、ほぼ間違いなく「\」のパス区切りのままファイルを指定しています。
すでに存在する文字の位置を見つけよう
下の画像の右下の「スクロール位置」にあるように、全体の下付付近にだけ文字が入っています
文字を編集してみよう
今回はネットから「ロゴ画像」などなんらかの画像を取得し、
それをフォントにと変換する手順を軽く解説します。
下画像の赤い枠の部分の「フォントの文字」を編集しますので、
赤枠のフォントをダブルクリックし、
グリフを表示
最初から入っている「■」をクリア
「CTRL+AしてDEL」なり、「マウスをドラッグして範囲選択してDEL」なりして、
最初からあるグリフ情報を削除しましょう。
このクリアをしない場合、何か新しい文字を設定しても、全体が真っ黒なままになります。
↑全体を選択して削除 (CTRL+AしてDEL)
ネットから適当に画像取得
ここではネットなどから「ロゴ画像」などなんらかの画像を取得し、
それをフォントにと変換する手順を軽く解説します。
まず、今回は有名なPythonの画像をネットから探してきましょう。
.png 形式もしくは .bmp 形式で保存
FontForge のメニューから「ファイル」→「取り込み」
保存した.pngなり.bmp なりのファイルを指定して取り込んでください。
取り込むと画像が表示されますが、単に画像が表示されているだけで文字になってません。
FontForge のメニューから「エレメント」→「自動トレース」
画像を実際にフォントグリフにするためには、トレースします。
実際には手動で多少編集することが多いですが、今回は割愛します。
このPythonのマーク編集に使ったこのウィンドウを閉じます。
文字内容がちゃんと変化しました。
HmToolBar.ttf として出力
文字内容が変化しましたので、フォント内容を出力します。
FontForgeのメニューから、「フォントを出力」を選び、
フォントの基礎的な情報(フォント名や全体のフォント情報)は、
元々HmToolBar.ttfに設定されているため、編集や設定する必要はありません。
警告が出ますが、無視して「生成」を押しましょう
生成したフォントを改めてインストール
HmToolBar.ttfを、
「プログラムから開く」→「Windows フォントビューアー」を選択して「インストール」してください。
もしくは「C:\Windows\Font」ディレクトリに「HmToolBar.ttf」をコピペしても良いです。
HmToolBar.jsonを改めてみてみる
一度秀丸を終了し、改めてHmToolBar.jsonを開いてみましょう
以下のようにPythonのアイコンが見えてればOKです
新たなに用意したアイコン(文字)を使う場合は、該当の見えてる文字をコピペすればよいだけですので簡単です。
HmToolBar.jsonを改めてみてみる
一度秀丸を終了し、改めてHmToolBar.jsonを開いてみましょう
以下のようにPythonのアイコンが見えてればOKです
新たなに用意したアイコン(文字)を使う場合は、該当の見えてる文字をコピペすればよいだけですので簡単です。
HmToolBar.jsonを改めてみてみる
一度秀丸を終了し、改めてHmToolBar.jsonを開いてみましょう
以下のようにPythonのアイコンが見えてればOKです
新たなに用意したアイコン(文字)を使う場合は、該当の見えてる文字をコピペすればよいだけですので簡単です。
FontForgeの文字一覧から「使いたい文字をコピー」する
使いたい文字をFontForgeから直接コピーすることも可能です。
コピーしたい文字を「右クリック」して、メニューから「グリフ情報」を選択します
「Unicode文字」とあるところの文字をコピーし、エディタにペーストすれば、該当の文字をエディタに挿入できます。
