Snackbarの文言が複数行の時に上下に大きな空白ができるのを調整する

1973 ワード
Android MaterialDesign MaterialComponents Android テキストリンク

この記事は material-components 1.2.0 での内容になります

遭遇した問題

Snackbar の文言が複数行の時に上下の Padding が広すぎる気がする 🤔

Snackbar のガイドライン をみてもここまで上下に Padding は設定されていなさそう。

解決策

design_snackbar_padding_vertical_2lines のリソースをオーバーライドする

<dimen name="design_snackbar_padding_vertical_2lines">14dp</dimen>

原因

Snackbar の文言の上下の Padding は SnackbarContentLayout の内部で

  • 1 行の時は 14dp (R.dimen.design_snackbar_padding_vertical)
  • 複数行の時は 24dp (R.dimen.design_snackbar_padding_vertical_2lines)

が設定されるようになっていて、これが Padding が広い理由の原因のよう。
https://github.com/material-components/material-components-android/blob/f00cd57f133d394347baf3e75d5ba6cdb41bcf85/lib/java/com/google/android/material/snackbar/SnackbarContentLayout.java#L91-L94



SnackbarContentLayout へ直接アクセスが難しいので、Snackbar 周りを自分で実装しない限りはリソースのオーバーライドが回避策になりそうだが、ライブラリの方でリソース名がリネームされる可能性はある。

この値は FullWidth な Snackbar の時の名残なのかな🤔(個人的な解釈)