LoginSignup
109

More than 5 years have passed since last update.

MaterialDesignの文字サイズはAppCompatのstyleが使える

Posted at

MaterialDesignガイドラインのStyle > Typographyには、基本の文字サイズが規定されています。

Typography_-_Style_-_Google_design_guidelines_と_EnglishMasterClass.png

このサイズに揃えるには dimens.xml に独自に定義してもいいんですが、実はAppCompatに用意されているのでそれを使えます。

AppCompatの定義

values.xml の中に、TextAppearanceから始まるstyleが用意されています。

<style name="TextAppearance.AppCompat.Body1" parent="Base.TextAppearance.AppCompat.Body1"/>
<style name="TextAppearance.AppCompat.Body2" parent="Base.TextAppearance.AppCompat.Body2"/>
<style name="TextAppearance.AppCompat.Button" parent="Base.TextAppearance.AppCompat.Button"/>
<style name="TextAppearance.AppCompat.Caption" parent="Base.TextAppearance.AppCompat.Caption"/>
<style name="TextAppearance.AppCompat.Display1" parent="Base.TextAppearance.AppCompat.Display1"/>
<!-- 略 -->

継承元のstyleの1つを見てみると、textSizetextColor が指定されています。
textSize は、ガイドラインそのままのサイズです。 textColor は、textColorPrimarytextColorSecondary など、Typographyに合わせた色が設定されています。

<style name="Base.TextAppearance.AppCompat.Body1">
    <item name="android:textSize">@dimen/abc_text_size_body_1_material</item>
    <item name="android:textColor">?android:textColorPrimary</item>
</style>

指定する時

textAppearance でstyleを指定すればよいです。
AndroidStudioは補完がイケてるので、TextAppearance.AppCompat. で補完すれば他にも色々出てきます。

  <TextView
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="Username"
      android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>

おまけ

AppCompatの中には、MaterialDesignガイドラインで規定されているdpサイズ等はだいたい入ってます。
values.xmlの中をざっと見てみるといいかもしれません。

<dimen name="abc_text_size_body_1_material">14sp</dimen>
<dimen name="abc_text_size_body_2_material">14sp</dimen>
<dimen name="abc_text_size_button_material">14sp</dimen>
<dimen name="abc_text_size_caption_material">12sp</dimen>
<dimen name="abc_text_size_display_1_material">34sp</dimen>
<dimen name="abc_text_size_display_2_material">45sp</dimen>
<dimen name="abc_text_size_display_3_material">56sp</dimen>
<dimen name="abc_text_size_display_4_material">112sp</dimen>
<dimen name="abc_text_size_headline_material">24sp</dimen>
<dimen name="abc_text_size_large_material">22sp</dimen>
<dimen name="abc_text_size_medium_material">18sp</dimen>
<dimen name="abc_text_size_menu_material">16sp</dimen>
<dimen name="abc_text_size_small_material">14sp</dimen>
<dimen name="abc_text_size_subhead_material">16sp</dimen>
<dimen name="abc_text_size_subtitle_material_toolbar">16dp</dimen>
<dimen name="abc_text_size_title_material">20sp</dimen>
<dimen name="abc_text_size_title_material_toolbar">20dp</dimen>

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
109