11
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

NotoSansCJKJPを使ってみてのメモ(Android)

Last updated at Posted at 2019-05-02

仕事でNotoSansCJKJPを使ったので

仕事でデザイナーさんに指定されて、NotoSansCJKJPを使うことが続いたので、メモを残します。
ソースはこちらに。
https://github.com/shinya-takano/NotoSansCjkJpSample

NotoSansCJKJPのダウンロードからAndroidStudioへの格納まで

  • https://www.google.com/get/noto/ からフォントをDLして、zipを解凍します。
  • 解凍したotfファイルをresフォルダのfontフォルダに格納します。
  • そのままだと大文字と「-」がフォーマット違反なので、キャプチャのようにリネームして格納します。
スクリーンショット 2019-05-02 16.26.33.png

これで、xmlから使うときは、android:fontFamily="@font/noto_sans_cjk_jp_regular"
のように使えます。
ソースから使う場合は、

val font = context.resources.getFont(R.font.noto_sans_cjk_jp_regular)
textView.setTypeface(font, Typeface.NORMAL)

のようにして使えます。

いくつかハマったところがあったので、解決策をメモ

そのまま使うと、キャプチャ(サンプルアプリ)の3つめのように元々のフォントの空白が大きく出てしまい、
デザインで指定・イメージしているマージンとだいぶ違う結果になってしまうので、
android:includeFontPadding="false" を設定します。
(フォントがNotoSansCJKJPでプロパティをfalseに設定しているのが、4つめ)
Screenshot_1556781750.png

ちょっとサンプルアプリがわかりにくいのですが、以下の形でまとめています。

上から1つめ 上から2つめ 上から3つめ 一番下
DefaultFont DefaultFontで includeFontPadding="false" NotoFont NotoFontで includeFontPadding="false"

なお、ViewPagerのタブ文字の場合は、フォント自体がうまく適用できなかったので、
stackoverflow を参考に直接フォントを設定します。

    private fun changeTabsFont(tabs: TabLayout) {

        val font = this.resources.getFont(R.font.noto_sans_cjk_jp_regular)

        val vg = tabs.getChildAt(0) as ViewGroup
        val tabsCount = vg.childCount
        for (j in 0 until tabsCount) {
            val vgTab = vg.getChildAt(j) as ViewGroup
            val tabChildsCount = vgTab.childCount
            for (i in 0 until tabChildsCount) {
                val tabViewChild = vgTab.getChildAt(i)
                if (tabViewChild is TextView) {
                    tabViewChild.setTypeface(font, Typeface.NORMAL)
                    tabViewChild.includeFontPadding = false
                }
            }
        }
    }

まとめ

NotoSansCJKJPを使う機会がちょくちょく出るので、解決策をメモしておきたかったので、
自分用のメモを作りました。

11
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?