Android アプリを Surface Duo に対応させる

  • [アーティクル]

このセクションでは、デュアルスクリーンでアプリをテストし、その後、Surface Duo によって提供される画面やポスチャを最大限に活用できるように拡張するいくつかの方法について説明します。

既定では、Android アプリは、Surface Duo 上では Android デバイスの場合と同じようにシングル スクリーンで実行されます。 しかし、デュアルスクリーンと柔軟なポスチャによって、アプリを目立たせる新しいチャンスが生まれます。また、予想していなかったような新しい方法で、お客様にアプリを使ってもらうこともできます。

アプリを Surface Duo に対応させるためには、次の 3 つの主要な手順を行う必要があります。

  1. アプリをテストする - Duo エミュレーターを使用して動作することを確認します。
  2. 段階的に変更する - Android ネイティブの API とライブラリを使用して、アプリの動作が、シングルスクリーン モードで並べて実行している場合よりも、デュアルスクリーン デバイスでの方が向上するようにします。
  3. 新機能を活用する - Microsft の Surface Duo Preview SDK とデュアルスクリーン アプリのパターンを使用して、Surface Duo によって提供される新機能を活用します。

手順 1:アプリのテスト

Surface Duo エミュレーターを使用してアプリをテストします。 既定では、シングルスクリーン エクスペリエンスとして実行されます。

エミュレーターの [設定] で自動回転を有効にします。 エミュレーターでデバイスを回転させながら、左側の画面から右の画面に移動して、アプリのテストを続行します。

問題が発生した場合は、サイズ変更可能な画面に関する Android のガイダンスに従っていることを確認し、android:resizeableActivity="true" が設定されていることを確認します。 詳細については、developer.android.com の「折りたたみ式端末に対応したアプリの作成」を参照してください。

手順 2:段階的に変更する

アプリをデュアルスクリーン デバイスで実行する場合に価値を追加できるいくつかの変更を次に示します。 これらの変更では Android のネイティブ API とライブラリを使用するため、他のデバイスのフォーム ファクターでもアプリはこれらの変更の利点を得られます。

アプリにこれらの機能がまだない場合は、追加することを検討してください。

すべてのデバイスの向きとポスチャを処理する

特定の UX の向きの "ロック" を削除し、すべてのデバイスのポスチャをサポートします。

ドラッグ アンド ドロップのサポートを追加する

ドラッグ アンド ドロップによって、ユーザーはアプリのパーツ間、または 2 つの画面の異なるアプリ間でデータを簡単に共有できます。

アプリにドラッグ アンド ドロップを実装するには、develop.android.com の「ドラッグ & ドロップ」のガイダンスに従います。 実行方法を確認するには、ドラッグ アンド ドロップのサンプルを使用します。

マルチインスタンスのサポートを追加する

マルチインスタンスのサポートを追加して、ユーザーが、2 つのインスタンス (各画面に 1 つずつ) があるアプリを実行できるようにします。

ピクチャ イン ピクチャのサポートを追加する

アプリにピクチャ イン ピクチャのサポートを実装するには、develop.android.com のガイダンスに従います。

他のウィンドウで新しいアクティビティを起動する

デュアルスクリーン デバイスでは、2 番目の画面で新しいアクティビティを起動するのは自然なことです。 インテント フラグ FLAG_ACTIVITY_LAUNCH_ADJACENT を使用して、システムにこれを行うためのヒントを提供します。

フラグの詳細については、developer.android.com の「マルチウィンドウ モードで新しいアクティビティを起動する」を参照してください。 実行方法を確認するには、「2 番目の画面へのインテントを起動するサンプル」を使用します。

手順 3:新機能を活用する

魔法が起きるのはここです。アプリを見せる画面領域が広がりました。 デュアルスクリーン API は、エミュレーターの Surface Duo イメージに組み込まれているので、独自のアプリや Microsoft のサンプルのいずれかを使用して試すことができます。

アプリで、まず、アプリがデュアルスクリーン デバイスで実行されているかどうかを判断します。 これにより、デバイス間で同じコードを使用することができます。Surface Duo 用の別のバージョンのアプリは存在しません。 アプリがデュアルスクリーン デバイスで実行されている場合は、SDK のデュアルスクリーン API を使用してアプリを強化できます。

アプリをスパンする

両方の画面にアプリをスパンして、エンドツーエンドのユーザー エクスペリエンスを確認します。

  • 継ぎ目が重要なアプリ コンテンツを覆っていますか?
  • 中央にボタンがありますか?
  • レイアウト内でコンテンツを再配置する必要がありますか?

アプリが継ぎ目で動作するようにするには、Display Mask API を使用します。

ヒンジの角度を検討する

ヒンジの角度センサーを使用すると、ヒンジの角度に関する情報を取得できます。 アプリ (ゲームやユーティリティまたは電源アプリ) で、ヒンジの角度を使用してユーザーに価値を提供できるかどうかを検討します。

デュアルスクリーン アプリのパターンを使用する

画面が 2 つあることを利用できるデュアルスクリーン アプリのパターンをいくつか特定しました。 ご自分のアプリとユーザーに適合するアプリのパターンについて考えてみましょう。 Microsoft では、これらの各パターンのデモを行うためのサンプルを用意しています。 エミュレーターでこれらを試してみてください。コードを使用して、それぞれをどのように実装できるかを確認してください。

dual-screen app patterns

これらのアプリのパターンの設計上の考慮事項とヒントをいくつか次に示します。

拡張キャンバス

リスト - 詳細

  • 既定で選択されている項目を指定します。指定しない場合、右側の画面が空になります。
  • また、デバイスをデュアル (横) に回転した場合に、どのようになるかについても考慮します。 マスター - 詳細フローは上下の画面に保持されますか。 コンテンツを読むための画面領域が広がるため、両方の画面を詳細ビューに使用することをお勧めします。
  • リスト - 詳細のサンプル

2 ページ

  • ページ割り当てに対してスワイプをどのように構成するかを検討します。 カードをスライドするように、1 と 2 ページから 2 と 3 ページに移動しますか、それとも本を読むように、1 と 2 ページから 3 と 4 ページに移動しますか。
  • 2 ページのサンプル

デュアル ビュー

  • このパターンでは、同じデータが 2 つの異なるビューで表示されるため、1 つの画面で項目を変更すると、もう一方の画面にその変更が反映され、コンテンツの同期が維持されることを確認してください。
  • デュアル ビューのサンプル

コンパニオン ペイン

  • コントロールのレイアウトは、デバイスの向きに応じて変更することができます。また、コントロールがデュアル (縦) ポスチャで右側の画面に表示されている場合と、デュアル (横) で下の画面に表示されている場合では、ビューが異なります。
  • コンパニオン ペインのサンプル

作業を強調表示する

アプリがデュアルスクリーン デバイス向けに拡張されていることを顧客に知らせたい場合があります。 検討すべきいくつかのアイデアを次に示します。

  • デュアルスクリーン エクスペリエンスを反映するように、Web サイトやオンライン ストアのページを更新する。
  • アプリでの最初の実行エクスペリエンスと、デュアルスクリーン機能用に UX の検出を提供する。
  • ユーザーの分析情報のため、Microsoft Graph などの Microsoft サービスに接続することを検討する。