web-dev-qa-db-ja.com

フローティングアクションボタンのモーフを元に戻すことはできますか?

Android フローティングアクションボタンのガイドライン には、ボタンが新しいボタンまたはツールバーに変形する方法を説明する2つの具体的な例があります。

アプリの特徴がファイルタイプの追加である場合、フローティングアクションボタンは、最初に触れられた後、関連するアクションに変化する可能性があります。

floating action button can morph into related actions

フローティングアクションボタンがツールバーに変化した場合、そのツールバーには関連アクションが含まれている必要があります。この例では、ボタンでユーザーが追加するメディアタイプを選択できます。

floating action button morphs into a toolbar

ボタンがモーフィングした後、ユーザーはどのように前のシングルボタンモードに戻りますか?

私が理解しているように、これらのボタンがモーフィングされた後、UIの残りの部分はブロックされないので、ユーザーが新しいボタンを非表示にしたり、モーフィングされた形状を元に戻したりする方法は明確ではありません新しいアクションを実行しないことを決定します。

更新

これは何よりも解説です。実装例を見つけるためにドライブを調べたところ、FABモーフではなくボトムシートが見つかりました。

enter image description here

3
nipponese

ガイドラインでは、フローティングアクションボタンによってトリガーされるフローティングアクションメニューの状態を元に戻すことについては何も述べられていませんが、このユースケースでは2つのパターンが顕著になっています。

  1. 受信トレイのフローティングアクションメニューは、残りのコンテンツの上に半透明の白いオーバーレイでフェードインし、メニューにフォーカスを移動します。 UIの残りの部分はブロックされていませんが、オーバーレイはそれを描写し、フローティングアクションメニューがフォーカスされている場合は無効または使用不可になります。メニューが原因でフォーカスが失われ、状態が元に戻ります。このパターンはEvernoteやCabinetなどのアプリでも採用されています

  2. 2番目のパターンは、フローティングアクションボタンがフローティングアクションメニューの項目の1つとしてオンのままであり、フォームを閉じるボタンのフォームに一致するように変更し、UIをブロックせずに閉じるアクションを簡潔に描写します。 こちら この実装の優れた要点とGif。

1
Faiz Malkani

はい、できます

マテリアルデザインガイドラインでは、モーフィングアイテムの反転方法は指定されていません。

  1. 反転アニメーションの実装例があります。たとえば、 このデモ は、フローティングボタンまたは固定ナビゲーションバーで使用できるリバーシブルメニューボタンを示します。

  2. マテリアルデザインの物理に対応する可逆的な相互作用。モーフィングボタンは、スライドアップボトムシート、スライドダウンペーパーエレメント、またはフォールドダウンアイテムを開くことがあります。 。

0
tohster