Xamarin.Forms のデュアル画面

Microsoft Surface Duo のようなデュアル画面デバイスでは、アプリケーションの新しいユーザー体験が促進されます。 Xamarin.Forms には TwoPaneView クラスと DualScreenInfo クラスが含まれているため、デュアル画面デバイス用のアプリを開発できます。

作業開始

以下の手順に従い、デュアル画面機能を Xamarin.Forms アプリに追加します。

  1. ソリューションの [NuGet パッケージ マネージャー] ダイアログを開きます。

  2. [参照] タブで Xamarin.Forms.DualScreen を検索します。

  3. ソリューションに Xamarin.Forms.DualScreen パッケージをインストールします。

  4. OnCreate イベントで Android プロジェクトの MainActivity クラスに次の初期化メソッド呼び出しを追加します。

    Xamarin.Forms.DualScreen.DualScreenService.Init(this);
    

    2 つの画面にまたがるなど、アプリの状態変化をアプリが検出するにはこのメソッドが必要です。

  5. これらの ConfigurationChanges オプションが "すべて" 含まれるよう、Android プロジェクトの MainActivity クラスで Activity 属性を更新します。

    ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation
        | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.UiMode
    

    これらの値は、構成の変更や範囲の状態をより確実に報告できるようにするために必要です。 既定では、2 つだけが Xamarin.Forms プロジェクトに追加されます。そのため、信頼できるデュアル画面サポートのために残りを忘れずに追加してください。

トラブルシューティング

DualScreenInfo クラスまたは TwoPaneView レイアウトが想定どおりに動作しない場合、このページのセットアップ手順を再確認してください。 Init メソッドまたは ConfigurationChanges 属性値を省略したり、間違って構成したりすることは、よくあるエラーの原因です。

追加のガイダンスと参照実装が必要であれば、Xamarin.Forms デュアル画面サンプルをご覧ください。

次の手順

NuGet を追加したら、次の手順でアプリにデュアル画面機能を追加します。

  • デュアル画面デザイン パターン - デュアル画面のデバイスで複数の画面を最適に使用する方法を検討する場合は、このパターンに関するガイダンスを参照して、アプリケーション インターフェイスに最適なものを見つけてください。
  • TwoPaneView レイアウト - Xamarin.FormsTwoPaneView 同じ名前の UWP コントロールに着想を得たクラスは、デュアルスクリーン デバイス用に最適化されたクロスプラットフォーム レイアウトです。
  • DualScreenInfo ヘルパー クラス - DualScreenInfo で、表示されるペイン、その大きさ、デバイスがどのようなものか、ヒンジの角度などを決定できるようになります。
  • デュアル画面トリガー - Xamarin.Forms.DualScreen 名前空間には、アタッチされたレイアウト (ウィンドウ) の表示モードが変更されたときに VisualState 変更をトリガーする 2 つの状態トリガーが含まれています。

詳細については、デュアル画面開発者向けのドキュメントを参照してください。