プロダクト ニュース

Material 3 Adaptive 1.2.0 が安定版になりました

所要時間: 2 分
Rob Orgiu さんのプロフィールを表示
Rob Orgiu Developer Relations Engineer

Material 3 Adaptive 1.2.0 が安定版になりました。

このリリースでは、以前のバージョンの基盤を基に、ウィンドウ サイズ クラスのブレークポイントのサポートを拡大し、ディスプレイ ペインを自動的に配置する新しい戦略を導入しています。

Material 3 Adaptive 1.2.0 の新機能

この安定版リリースは、大サイズと特大サイズのブレークポイントに対する WindowManager 1.5.0 のサポートを基盤としており、ListDetailPaneScaffold と SupportingPaneScaffold の新しいリフロー戦略とリビテート戦略を導入しています。 

新しいウィンドウ サイズクラス: 大と特大

newwindow.png


WindowManager 1.5.0 では、幅のウィンドウ サイズクラスに 2 つの新しいブレークポイントが導入されました。これにより、拡大ウィンドウ サイズクラスよりも大きなウィンドウをサポートできるようになりました。コードベースの currentWindowAdaptiveInfo() 呼び出しに次のパラメータを追加すると、大（L）と特大（XL）のブレークポイントを有効にできます。

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

このフラグにより、ライブラリは必要に応じて L と XL のブレークポイントも返すことができます。

新しいアダプティブ戦略: リフローと浮遊

ウィンドウ内のコンテンツと表示ペインの配置は、ウィンドウ サイズをはじめとする多くの要素を考慮する必要がある複雑なタスクです。新しい Material 3 Adaptive ライブラリでは、2 つの新しいテクノロジーを使用して、最小限の労力でアダプティブ レイアウトを実現できます。

リフローでは、ウィンドウのサイズやアスペクト比が変更されるとペインが再配置されます。ウィンドウの幅が十分な場合は 2 番目のペインが 1 番目のペインの横に配置され、ウィンドウの高さが十分な場合は 2 番目のペインが 1 番目のペインの下にリフローされます。この手法は、ウィンドウが小さくなった場合にも適用されます。コンテンツは下部にリフローされます。

material.jpg

ウィンドウ サイズに基づいてペインをリフローする

リフローは多くのケースで優れたオプションですが、コンテンツをウィンドウの横にドッキングしたり、ウィンドウの上に浮かせたりする必要がある場合もあります。浮遊戦略では、コンテンツをドッキングするだけでなく、ドラッグ可能、サイズ変更可能、背景スクリムなどの機能をカスタマイズすることもできます。


 

material2.jpg

アスペクト比に基づいてペインを横から中央に移動させる

フロー戦略とリフティング戦略はどちらも、adaptStrategies パラメータを使用して Navigator コンストラクタ内で宣言できます。また、どちらの戦略もリスト詳細とサポート ペインの scaffolds に適用できます。

val navigator = rememberListDetailPaneScaffoldNavigator<Nothing>(
        adaptStrategies = ListDetailPaneScaffoldDefaults.adaptStrategies(
            detailPaneAdaptStrategy = AdaptStrategy.Reflow(
                reflowUnder = ListDetailPaneScaffoldRole.List
            ),
            extraPaneAdaptStrategy = AdaptStrategy.Levitate(
                alignment = Alignment.Center
            )
        )
    )


 

これらの新しい適応型戦略を活用する方法について詳しくは、Material ウェブサイトと GitHub の完全なサンプルコードをご覧ください。

作成者:
続きを読む