ichigotake's diary

個人の日記

【CoordinatorLayout】スクロールするとニュっと動いてヘッダーへ固定される UI は "Flexible space header" と呼ぶとよさそう

こういう挙動について。

https://storage.googleapis.com/material-design/publish/material_v_12/assets/0B6Okdz75tqQsRTM1M1lCWWZiN2c/patterns-scrolling-techniques-flexible-space-xhdpi-003.webm

Scrolling techniques - Patterns - Material Design より

Material Design のドキュメントには Flexible space と記載がある。、英語で呼ぶ時は Flexible space、ヘッダーであることを強調したいときは Flexible space header で通じそう?

(他にいい呼び方があったら教えてください。)

調査

Material デザインのドキュメント

Scrolling techniques - Patterns - Material design guidelines より

Flexible space: space to accommodate a desired aspect ratio for images or extended app bars Flexible space

該当の表現を解説するセクションには Flexible space という小見出しがある。

Google 検索をしてみる

Material Design のドキュメントにある Flexible space header をベースにググってみると Android アプリに関するページがいくつかヒットする。

  • flexible space header [検索]
  • flexible space header ios [検索]
  • flexible space header javascript [検索]

検索結果では CoordinatorLayout で表現できそうな UI が多くヒットしている。CoordinatorLayout で実装する スクロールしてニュっと動いてヘッダーで固定されるやつ の呼称はドキュメント通り Flexible space header で良さそうだし、語感的にも呼称を知らない人に通じそうな雰囲気がある。