がとらぼ
INTAA.NET

Linux環境でのArduino IDEの豆腐文字化けを直す

Arduino IDEをLinuxにインストールしたところメニューなどが豆腐状態になって正しく表示されない。そこで、その対応。

Arduino IDEの文字化け解消 1
Arduino IDEは https://www.arduino.cc/en/softwareから貰ってくる。
Windows用, Linux用, Mac OS X用があるので使用しているOSに対応してなくて困るということはない筈。今回はArduino IDE 1.8.16 Linux 64bit版をDLした。

DLしたファイルを任意の場所に解凍する。この解凍したファイル群はその後も使い続けることになるので一時ファイル保管場所などではなくホームディレクトリの下など。 /home/user/arduino-1.8.16 例えばこんな感じ。
$ cd ~/arduino-1.8.16
$ sudo ./install.sh

これでインストールされる。必要なファイルがインストールされ、デスクトップにArduino IDEのアイコンが作成される。合わせてアプリケーションランチャー(Windowsでいうスタートメニュー)にもArduino IDEの項目が登録される。デスクトップのアイコンは要らなければ消してO.K.
「がとらぼ」の人の環境では/home/user/arduino-1.8.16でインストーラーを実行すると/home/user/Arduinoディレクトリが作成された。また、隠しとして/home/user/.arduino15 もできた。(これはもしかするとArduino IDE初回起動時かも)

Arduino IDEの文字化け解消 2
とりあえずArduino IDEを起動してみた。起動時に表示される絵の下に表示される文字やメイン画面のメニューなどの文字が□で表示される。所謂「豆腐」というやつ。

まずは英語表示にする

Arduino IDEの文字化け解消 3
文字化けで読めないので取り敢えず英語表示にしたい。
メニューの一番左をクリック。 ポップアップしたメニューの下から2番めをクリック。

Arduino IDEの文字化け解消 4
上寄りにあるドロップダウンメニューが言語選択。
ついでに下の方にあるのが設定ファイルのPath

Arduino IDEの文字化け解消 5
言語のドロップダウンメニューから English (English)を選択。
右下のOKを押す。

一旦、Arduino IDEを終了して再度起動する。

Arduino IDEの文字化け解消 6
メニューが英語で正常に表示されることを確認する。

日本語表示にする

Arduino IDEで日本語表示する方法はググるといろいろ出てくるが、Java実行環境の整備とかはどうでも良くて、今回はフォント問題を解決するだけで何とかなりそう。
つまり、「設定ファイル ~/.arduino15/preferences.txt でフォント指定する」という解決方法は半分正しいけど足りない。「Java実行環境 ~/arduino-1.8.16/java/lib/fonts 等にフォントを用意する」というのは要らない。現在のArduino IDEはシステムOSに入っているフォントを使えるようになってるっぽい。
Arduino IDEではTrueTypeのフォントしか利用できないようだが「がとらぼ」の中の人のLinux環境(KDE neon)では日本語フォントはOpenTypeのものしか入っていないみたい。おそらくこれが原因で日本語表示しようとすると表示できるフォントがなくて豆腐になる。そこでTrueTypeの日本語フォントをインストールする。読みやすいフォントなら何でも良いが、今回はVL ゴシックを使うことに。

$ fc-list

インストール済みフォントが表示される。TrueTypeで日本語フォントがあるか探してみる。
ざっと見たところKDE neon(Ubuntu系)の標準では入ってないっぽい。

VLフォントを追加
$ sudo apt search VL font    ⬅パッケージにVLフォントがあるかを探してみる
fonts-vlgothic/focal,focal 20141206-4ubuntu1 all  ⬅あった(黄色字)
  Japanese TrueType font from Vine Linux

$ sudo apt install fonts-vlgothic  ⬅インストール

中略

$ fc-list | grep VL
/usr/share/fonts/truetype/vlgothic/VL-PGothic-Regular.ttf: VL Pゴシック,VL PGothic:style=regular
/usr/share/fonts/truetype/fonts-japanese-gothic.ttf: VL ゴシック,VL Gothic:style=regular
/usr/share/fonts/truetype/vlgothic/VL-Gothic-Regular.ttf: VL ゴシック,VL Gothic:style=regular

これで、VLフォントがインストールできた。ついでにフォント名(英語名)が「VL Gothic」であることも確認できた。正しいフォント名を得ることが大事
パッケージにVLフォントが無いとか他のVLフォント以外のパッケージ外フォントを使いたい場合は適切にインストールしてください。

Arduino IDEが開いていたら終了する。(実行中にだと次の設定ファイルの変更をしても変更が無かったことになるので)

さきほどのArduino IDEの設定画面に表示されていた設定ファイルの在り処からそのファイルをテキストエディタで開く。
vim ~/.arduino15/preferences.txt など。

editor.font=VL Gothic,plain,12
editor.languages.current=ja_JP

少なくともこの2行を変更して上書き保存する。

Arduino IDEを起動する。

Arduino IDEの文字化け解消 7
メニューが日本語表示になった。

Arduino IDEの文字化け解消 8
設定画面も日本語表示になった。言語選択も日本になっている。

無理に日本語表示させなくても英語で十分だが、「日本語が化ける」ことが腹立たしかったので敢えて日本語表示させてみたという些細な内容でした。

関連記事:

Androidスマホ画面をWindowsで表示 (ワイヤレスディスプレイ プロジェクション)

スマホ画面テレビ
©いらすとや.

スマートフォンの画面を外部モニタに出力したいことが多いかというと疑問だが、稀に複数の人にスマホ画面を見せたいなどで大画面に表示したいと思うことがある。スマホにHDMI端子が付いているとかType-CのUSBでディスプレイに出力できるとかができなくてもエントリー帯のモデルを除いて多くはワイヤレスディスプレイには対応している筈。このワイヤレスディスプレイというのはWi-Fiを使って出力元の機器(今回はスマホ)から出力先のテレビやモニターなどに画面(のデータ)を飛ばして表示するもの。
使用しているモニタやテレビがワイヤレスディスプレイに対応していなくてもWi-FiディスプレイとかMiracast対応レシーバのようなワイヤレスディスプレイの受信用HDMIドングル等が数百円から購入可能。ただし、レシーバといってもWi-Fiで通信するので実際には電波を出す。なので技適のある機器を使用してください。
でも、急にスマホ画面を大画面に出力したいとなった時にドングル持ってないということもある筈。そんなときはWindowsのワイヤレスディスプレイの表示機能を使ってWindows上にスマホの画面を表示することもできる。この記事はそのスマホからWindowsに画面を表示させる手順。

Windowsでは一時期標準でワイヤレスディスプレイが利用できるようになっていたこともあるようだが、2021年9月現在のWindows 10やWindows 11では標準ではワイヤレスディスプレイ機能はオプションになっているので利用できない。以下はそのオプションの有効化から。

Windows側の準備

以下、Windows PCはWi-Fiが使用できるものとします。そのPCはインターネット接続のためにWi-Fiで無線ルーターなどのアクセスポイントと通信中であっても構いません。(ただし、ハードウエアによってはダメなことがあるので絶対ではありません)
Windowsの画像と説明はWindows 11の正式リリース前のものです。Windows 10やWindows 11リリース版とは異なることがあるかもしれません。スマートフォン側はXiaomiのMIUI 12 (Android 11ベース)で純正Android (11)とは若干異なることがあるかも。

スマホからワイヤレスディスプレイでWindows画面に表示 1
Windowsのスタートボタン①から「設定」②を開く。

スマホからワイヤレスディスプレイでWindows画面に表示 2
設定画面の左列から「アプリ」①を選択し、右列で「オプション機能」②を開く。

スマホからワイヤレスディスプレイでWindows画面に表示 3
右列が「オプション機能」の表示になったら一番上の「オプション機能を追加する」の「機能を表示」ボタンを押す。

スマホからワイヤレスディスプレイでWindows画面に表示 4
有効にできるオプション機能はたくさんあるが、あいうえお順なので検索しなければ見つけられないほどでもない。
リストをスクロールして「ワイヤレスディスプレイ」の行を見つけて①、チェックボックスをチェックする②。
ウィンドウ下部の「次へ」ボタンを押す③。

スマホからワイヤレスディスプレイでWindows画面に表示 5
「インストールされるもの」に「ワイヤレスディスプレイ」がリストアップされたことを確認①。
ウィンドウ下部の「インストール」ボタンを押す②。

スマホからワイヤレスディスプレイでWindows画面に表示 6
約2.5MBしかないと表示されていたにも関わらず「がとらぼ」の中の人が試したところインストールには結構時間がかかった。
「最近のアクション」の「ワイヤレスディスプレイ」(画像の赤枠部分)に青棒が表示されるのでその青棒が「インストール済み」の下まで伸びるまで20分ほど。(依存関係を満たすために他のなにかもインストールしたとか？)
ワイヤレスディスプレイをインストールしたら次は有効化。(次へ)

スマホからワイヤレスディスプレイでWindows画面に表示 7
Windowsの設定の左列で「システムを選択」
右列で「このPCへのプロジェクション」をクリック。

スマホからワイヤレスディスプレイでWindows画面に表示 8
「このPCへのプロジェクション」の初期値はオフ側になっている。(次へ)

スマホからワイヤレスディスプレイでWindows画面に表示 9
「このPCへのプロジェクション」が利用可能になりそうな設定に変更する。(画像のようなのでOK)
上の画像のように赤字で警告表示が出ることもあるが、「表示に異常があるかも」程度であれば無視してよいかと。
これで設定は終了。(次へ)

スマホからワイヤレスディスプレイでWindows画面に表示 10
Windowsのスタートボタンを押し、検索欄に「接続」を入力する。

スマホからワイヤレスディスプレイでWindows画面に表示 11
「接続」というアプリが表示されるので選択①。
「開く」をクリック②。

スマホからワイヤレスディスプレイでWindows画面に表示 12
「接続」アプリが起動して青い画面が表示される。ここに「ワイヤレス接続する準備ができました。」と表示されていること。画像では「デバイスのハードウエアがワイヤレスプロジェクション用として設計されていないため、コンテンツ表示に問題が生じる可能性」云々が表示されているが、このような警告レベルなら大抵は問題なく使える。ここでハードウエアが対応していなくて利用不可の旨が表示されていたら諦めなければならないかも。
これでワイヤレスディスプレイの画面表示の待受け状態。

スマホ側の操作

スマホ側ワイヤレスディスプレイ操作 1
ワイヤレスディスプレイはWi-FiなんだからWi-Fiの設定だろうと思う人は多いハズ。事実、ワイヤレスディスプレイの表示側が待ち受け状態だとWi-Fiの設定画面の「利用可能なネットワーク」にその表示が出る。
でも、これに接続しようとするのは間違い。(次へ)

スマホ側ワイヤレスディスプレイ操作 2
Androidの設定(トップ)から「接続と共有」を開く。(「Wi-Fi」ではない)

スマホ側ワイヤレスディスプレイ操作 3
「接続と共有」の中にある「ワイヤレスディスプレイ」をタップして開く。

スマホ側ワイヤレスディスプレイ操作 4
ワイヤレスディスプレイのスイッチをオンにする。

スマホ側ワイヤレスディスプレイ操作 5
スイッチをオンにして数秒〜30秒でワイヤレスディスプレイの出力先の候補(今回だと待受側であるWindowsが1つだけ)が表示されるのでそれをタップ。

スマホ側ワイヤレスディスプレイ操作 6
(数秒後)タップした出力先の下に「接続中」の表示が出ることを確認する。画像の①の部分。
(設定にも依るかもだが)(初回)接続時は接続認証もどきが実行される。Windowsの「接続」アプリの青画面に8桁程度の数字が表示されるのでその番号を入力する。
MIUIのバグなのか画像のようにとても暗くて見えにくいが、「接続への招待」の部分の②の部分。入力できたら「同意する」を押す。画像の③の部分。

スマホ側ワイヤレスディスプレイ操作 7
接続に成功すると「接続中」から「接続済み」に変わる。(画像の赤線部分)
30秒以内程度で、Windowsの画面にスマホと同じ画面が表示されるので、それを確認する。この画像のような画面がWindowsに表示されているハズ。

表示されたスマホ画面

スマホからワイヤレスディスプレイでWindows画面に表示 13
スマホ画面がWindowsの「接続」アプリに表示される。この状態でスマホを操作すれば追従して表示される。
また、「接続」アプリの画面をよく見ると小さいマウスカーソルのようなものが表示されていて、そのカーソルを動かしてクリックボタンクリックするとWindows側からスマホの操作も可能。ただし、マウスでの操作は考慮されていないのかかなり難易度高め、というか無理ゲーかも。Windowsタブレットだともう少しまともに操作できるのかな？

スマホからワイヤレスディスプレイでWindows画面に表示 14
Windowsの「接続」アプリの表示領域を変更すると中に表示される(スマホ)画面の大きさもあるていどは追従する。スマホが縦画面表示だと1つ前の画像の画面のように小さな表示になるが、横画面アプリを起動すると上の画像のように自動的に横画面拡大状態で表示される。(画像は数年前にテレビCMもやってた某ゲームの起動画面)

ワイヤレスディスプレイの終了

スマホ側ワイヤレスディスプレイ操作 8
ワイヤレスディスプレイを終了する場合は、Android設定の「接続と共有」の「ワイヤレスディスプレイ」画面で、接続中の出力先(画像の①)をタップ。
画面の下部に「接続の解除」が表示されるのでそのボタンをタップ。
最後にワイヤレスディスプレイのスイッチをオフにする。(画像の③)
実際にはいきなりワイヤレスディスプレイのスイッチオフで良さそうだし、もっといえばWindowsの「接続」アプリを終了するだけでも良いかも。

上の画像ではMIUIのバグなのかボタンが押せなさそうな色で表示されているが実際には押せる。

アクセスリスト

スマホからワイヤレスディスプレイでWindows画面に表示 15
Windowsの「接続」アプリ画面で[Ctrl]+[S]を押すとデバイスアクセスリストが表示される。他「設定」って表示されるけど機能していない？
デバイスのアクセスリストでは過去に接続されたデバイスが表示される。画像では1台のスマホで試しただけなのでそれ1つだけが表示されている。見に覚えのない端末が表示されていなけば大丈夫。 仮に覚えのない端末が表示されていたらブロックすれば良さそうだが方法は不明。

感想

最近はPCで大型モニタを使うことも増えているのでスマホ画面をワイヤレスディスプレイでWindowsに表示するというのはアリかなと思う。(テレビに出力しなくてはならないと思わなくても良いと言いたい。)
ただし、表示の遅延が気になったり、基本的に画面が出力元と出力先で1:1にはならないので縮小表示の結果汚く見えたり、電波状態によるのかときどき1瞬画面が崩れたり、問題がないわけではない。表示遅延は時間的には1秒の半分もなさそうだが、リアルタイム性を求めるならアウトということもあるかもしれない。

関連記事:
Up