Bana’s Tech Tips

Windows10やChromeでの中華フォント現象を解決してみる

f:id:BanaoLihua:20210507180753p:plain

<追記(2019/9/29)>

Windows10に元から入っているMicrosoft Yi Baiti、Microsoft Jheng Heiでも可能なようです。それを使用すればわざわざsource han sunsをインストールしなくても大丈夫だと思います。


こんにちは。皆さんは中華フォント現象って知っていますか?

一部の漢字だけフォントが変になったり、続く文字も気持ち悪いフォントになったりする現象のことです。

気にする人はすぐ気づきますが、全く気にしないし気付かないしどうでもいいって人も多いと思います。

私は断然前者で、この現象が起こると気持ち悪すぎて眠れないほどです。

iPhoneでこの現象を解決しようとしたのですが、失敗に終わったので取り敢えずWin10のシステムフォントから変えていきたいと思います。

最終的にはこのように変わります。

f:id:BanaoLihua:20210507180923p:plain

変更前

f:id:BanaoLihua:20210507180952p:plain

変更後
 <注意!> 

あくまで簡体字を日本のフォントに近くするだけです。そのため、糸へんや「直」などは繁体字の形で表示されてしまいます。

フォントをインストール

そもそも中華フォント現象は、日本語のフォントが簡体字に対応していないというのが根本的な原因(?)なので日中共通形のフォントを探しました。

すると、Adobe日中韓共通形の「Source han sans」というフォントを無料でリリースしているのを見つけたので、こちらを利用することにしました。

<フォントをダウンロード>

正式なダウンロードページはリンク切れ?していたのでGit hubから直接ダウンロードします。仕方ない。

こちらのページに飛び、下のDownloadからzipファイルをダウンロードします。

f:id:BanaoLihua:20210507181024p:plain

解凍すると色んな太さのotfファイルがでてきます。適用したいものをインストールしていきましょう。

<フォントをインストール>

インストールの方法ですが、otfファイルをダブルクリックするとサンプル画面が出現し、左上に「インストール」という項目が出てくるはずです。また、管理者権限も必要です。

<インストールできたか確認>

適当にWordでも開いてみてください。フォント選択のセレクトボックスに画像のような「Source han sans」が出てくると思います。

f:id:BanaoLihua:20210507181054p:plain
このフォントはカタカナの横幅が少し気になりますが、よしとします。

ちなみにSource han sans JPをインストールすると「源ノ角ゴシック」という名前になっています。

Windows10のシステムフォントを変更

Windows10のデフォルトのシステムフォントは「Yu Gothic UI」というフォントを採用しているらしいのですが、これを強制的に変更します。

こちらのサイトから、「Meiryo UIも大っきらい!!」というソフトをダウンロードしてください。

このソフトではデスクトップやメニューバーなどのフォントを好きなフォントに変更することができます。

また、使用方法もこのサイトに書いてあるので参考にしてください。

ちなみに私はこのように設定しました。

戻す方法も作者様のサイトに書いてあるのでそちらをご覧ください。

成功するとこんな感じです!

「华」(「華」の簡体字)の違和感が無くなりましたね。もう少しカタカナが小さければより良いですが・・・

細字の方がかっこいいような気がしたのでLightを適用したのですが、文字はもう少し大きくてもよかったかも。

何はともあれ中華フォントの気持ち悪い現象は解決しました!

Chromeでも中華フォントを解決してみる

上のやり方だと、デスクトップなどは適用されますが、当然ながら他のソフト上は適用範囲ではありません。

せめてブラウザだけでも中華フォント現象を根絶していきたいので、Chrome上で解決したいと思います。

さて、Chromeには様々な拡張機能が世界中のデベロッパーによりリリースされています。

以前、Vue.js開発で役に立つ拡張機能を紹介しましたが、今回も拡張機能に頼っていきたいと思います。

「font」と検索すると色々出てきますが、今回はこちらの「Force Custom Fonts」という拡張機能を使ってみます。

Chromeに追加」を選択してインストールしましょう。

右上にアイコンが出現すると思うので、アイコンをクリック⇒オプションから画像のように設定します。

これの良いところはアルファベットなどを個別にフォント指定することができることですね。

「Save」すると適用されます。

適用前

適用後

ちゃんと中華フォントも解消しました~

ただこの拡張機能、恐らくページ内のフォントを強制的に変更しているので全て選択したフォントになってしまうと思います(確認はしていませんが・・・)

ページのレイアウトが何か変だなぁと思ったら設定からオフにしてみてください!

お疲れさまでした~~

Jupyterのダークテーマが見にくいので見やすくしてみる

Jupyterのテーマ

皆さんはJupyterNotebookはデフォルトの状態で使っていますか?

エディタは白背景ではなく黒背景の方が好きなのでChesterishを使っています。しかしこのChesterish、ボタンが背景色と同化していたり、枠が無くなって領域が分かりにくいので少し改善してみました。以下で方法を紹介します。

テーマの変更

テーマの変更方法

変更方法は2つあります。一つはコマンドからinstall jupyterthemesでテーマのパッケージをインストール、jt -t xxxxxで好きなテーマを適用することができます。

もう一つはcustom.cssを使用する方法です。/.jupyter/custom/custom.cssを直接変更します。今回はこの方法を使います。

必要なもの

ここにアクセスしてください。jupyterthemes > styles > compiled > chesterish.css(任意)をダウンロードしてください。

ダウンロードしたCSSをエディターで編集してcustom.cssに差し替えます。





cssを編集

chesterishの気になる点

ずっとデフォルトの白いテーマを使っていたので、まずは処理の実行/停止ボタンが見えていないのが非常に不便に感じました。もう一つはコードを記述する領域の枠が無いことです。

取り敢えずこの2点について修正して、以下のような変更を加えたいと思います。

実行/停止ボタンの修正

上のクラスを上記のように書き換えます。背景色と同化して見えないのでcolor: white;を追加。アイコン自体小さいので9pxから15pxにします。

 

枠の追加

div.CodeMirror-linesにborder: solid;とborder-radius: 5px;を追加します。

 

完成形

【非会員も可】spotifyで無料で音楽をダウンロードする方法(曲のURLだけで可)

用意するもの

・PC(WindowsでもMacでもどちらでも)

・PCのファイル操作やコマンド操作の知識

手順

・python3をインストール

・ダウンロードしたい曲のリンクをコピー

コマンドプロンプトで実行

python3のインストール

インストールの方法は調べればすぐに出るので解説しません。

python2では動作しないらしいので注意してください。

リンクのコピー

ダウンロードしたい曲のリンクをコピーします。

コマンド操作

ここからはコマンド操作です。真っ暗な画面で少し怖いかもしれませんが、わざわざ調べて危険なコマンドを打たない限り大丈夫です。

コマンドプロンプトを開きます。以下を順番に実行していってください。

 

画面にapplying metadataと出たら終了です。

保存先はミュージックに指定されているので、そこを見てみるとダウンロードした曲のmp3ファイルが追加されていると思います。

またプレイリストの一括ダウンロードもできるようです。

詳しい使い方はこちらのドキュメント(英語)を参照してください。

【wechat pay】支払い時に起こるエラー

現在ではコンビニやファミレスなどの様々な施設で電子決済が日本でも普及してきています。私は電子決済に前々から興味を持っていたため、日本のコンビニやファストフードにいち早く参入していた中国発祥のwechat payを試みることにしました。
しかし!いざ支払おうとすると、こんな画面が出てきます。。。



中国語で「由于政策原因 非身份证实名用户暂时无法在境外商户支付」と書かれています。訳すと、「政策により、実名認証されていないアカウントでは中国大陸(香港や台湾を含まない)以外で支払いをすることはできません」という意味です。では実名認証を確認しようと思い、画面下部の「本人」→「WeChat Pay」→「(画面右上タブ)支払い管理」から確認してみました。

するとどうやら実名認証は登録されているようです!
どうにか解決しようと日本に住んでいる中国人の友人達に聞いたところ、普通に日本で使えるとのこと。
中国の銀行カードと紐づけしていないから?と考えたものの友人のうち一人は銀行カードとも紐づけしていないという。
そこでさらに詳しく調べたところ、「日本人のアカウントでは日本で決済することは不可能」という結論に至りました。。。中国の銀行と紐づけしても無理なようです。
また、中国大陸では正常に使えます。しかし、香港や台湾では使えないので注意しましょう。

元中国人で、現在は日本人に帰化している友人は使用できているので何か抜け道はあるかもしれません。最近やっと日本でもスマホ決済に対応している店も増えてきたので、素直にPaypayやLINEpayあたりを利用するのが吉かもしれませんね。

【iPhone】XenHTMLで導入したウィジェットをカスタマイズ

 

FilzaでiPhoneの中身を眺めていたところ、偶然iWidgetが目に留まったので、中身を書き換えてカスタマイズしてみることにしました。半分メモです。

目標

【XenMusicのレイアウトを変更】

・基本色を白からダークテーマにする

ウィジェットを若干半透明にする

・影を作って浮き出ているように見せる

必要なもの

iPhone

・ファイルマネージャ(Filzaなど)

・ファイル操作やフロントの知識(無くても可)

環境

iPhone8(iOS11.2.5)JB済

試してはいませんが、XenInfoがiOS9~12に対応してるので、iOS9以上なら動作すると思います。

事前準備

・XenHTML,XenInfoのインストール

・XenMusicを導入

ウィジェットの追加方法

1.ホーム画面のアイコンを長押しします。

2.画面下部に出てきた「添加小工具(add widget)」をタップします。
※言語設定の優先順位で、中国語が英語より上位にあると自動的に中国語になってしまいます。

3.XenMusicを選んで適用させると、ウィジェットの配置を決められるようになります。

初期状態はこんな感じ!(画像は配布サイトのサンプルスクリーンショットです)


ダークテーマ好きなのでシックな感じに変更を加えていきたいと思います!

ウィジェットのソースを操作

ソースの保存先
/var/mobile/Library/iWidgets
Filzaなどのファイルマネージャを開いてください。上記のパスまで移動します。既に数種類のフォルダがあるかもしれませんが、今回はXenMusicをいじるので、XenMusicフォルダを開いてください。
htmlファイルとアイコン画像が入ったimgフォルダがあります。再生ボタンなど変えたい場合は画像を差し替えてください。
htmlの編集ですが、Filzaでは直接ソースコードを編集できないようなので、一度拡張子をtxtに変更してソースコードを編集します。

 

htmlの編集・レイアウトの変更

レイアウトを変更するには<style>から</style>の間を編集します。曲名やアーティストなどの文字部分を変えたい方は<body>から</body>の間の該当箇所を変えます。
htmlやcssの知識がある方は自由にカスタマイズしてみてください。また、scriptタグではjsが記述されており、ボタン押下時の処理などの動的な部分が編集できます。
そしてXenMusicはファイルが一つにまとめられているのでシンプルで分かりやすいですね!

以下では初心者向けに、上で提示した目標に沿ってレイアウトを変えていきたいと思います。

#baseに「background-color: rgba(147, 147, 147, 0.7);」と「box-shadow: 0 3px 2px rgba(0,0,0,0.2);」を追加

#artistのcolorを「color:#353535;」に変更

※画像ではPCのエディタを使用していますが、書き換える際はFilzaのテキストエディタで構いません。

書き換えが終わったら、「XenMusic.txt」を「XenMusic.html」に戻しましょう

上にある「ウィジェットの追加方法」に従ってXenMusicを表示させることができれば成功です!

お疲れさまでした~

はじめまして

はじめまして、Banaoと申します。

 

趣味はアプリ開発や海外旅行です。主に技術分野、言語分野、旅行記などを雑多に書いていこうと思います。

 

 はじめは、以前のブログでの記事を写していこうと思います。

 

それでは✋