---
sourceDocument: Xanadu モバイルの構成とナビゲーション
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ja-JP/xanadu/mobile

 Release :

    - xanadu

ft:locale :

    - ja-JP

ft:publication_title :

    - Xanadu モバイルの構成とナビゲーション

ft:clusterId :

    - mobile

bundleId :

    - mobile

workflow :

    - Platform


---

# での Now Experience フレームワークページの作成 UI ビルダー

# での Now Experience フレームワークページの作成 UI ビルダー {#ariaid-title1}

* リリースバージョン: Xanadu
* 
* 更新日 2024年08月01日
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 所要時間：3分

モバイルアプリブリッジを使用してモバイルデバイスでプレイブックを利用するモバイル Web 画面を構成するには、最初のステップとして、UI ビルダー で Now Experience フレームワークページを作成します。

## 始める前に

必要なロール：admin

## このタスクについて

モバイルデバイスでプレイブックを活用できるモバイル Web 画面を設定する前に、[UI Builder](https://www.servicenow.com/docs/access?context=ui-builder-overview&version=xanadu&pubname=xanadu-application-development&ft:locale=en-US) で Now Experience フレームワークページを作成する必要があります。ページを構成した後、 モバイルアプリビルダー (MAB) で Web 画面を構成する必要があります。モバイルアプリブリッジを使用してモバイルデバイスでプラットフォーム機能を活用するモバイルウェブ画面の設定について詳しくは、[でのモバイル Web 画面の設定 モバイルアプリブリッジ](https://servicenow-prod.fluidtopics.net/7DmIbTqVARtgxJ5OdvUlyg "埋め込み Web ビュー内でホストされている重大ページ、クラシック Web ページ、またはサービスポータルページを有効にするには、 モバイルアプリブリッジ を使用してモバイル Web 画面を構成します。この機能を使用すると、 ServiceNow モバイル アプリのネイティブモバイル機能にアクセスできます。")をご覧ください。

## 手順

1. 移動先 すべてNow Experience フレームワークUI ビルダー.
2. UI ビルダー ホームページで、右上の \[作成\] を選択します。
3. \[ エクスペリエンスを作成 \] ダイアログボックスに入力し、完了したら \[ 作成 \] を選択します。  
   注:  
   \[アプリシェル UI\] ドロップダウンリストから \[UXR Base Experience シェル\] を選択します。
4. \[エクスペリエンスを開く\] を選択し、\[新しいページの作成\] を選択します。
5. \[代わりに最初から作成します\] を選択します。  
   テンプレートを使用したり、 UI ビルダー でページを最初から作成したりする方法については、「 [Customize the Playbook Experience](https://www.servicenow.com/docs/access?context=playbook-customize-playbook&version=xanadu&pubname=xanadu-build-workflows&ft:locale=en-US)」を参照してください。
6. ページに名前を付けて、 \[続行\] を選択します。
7. URL パラメーターを確認し、必要な場合は \[問題なし\] を選択します。
8. ページバリアント名と対象者を構成するか、\[ 既定\] を受け入れ、必要に応じて 条件 を追加して、 \[ 作成\] を選択します。
9. ページで、右上隅にある \[ エディターで開く \] を選択します。
10. ページの左側にあるデータ アイコンを選択して \[データ リソース\] ダイアログ ボックスを起動し、 \[ + 追加\] を選択します。
11. \[データリソースの検索\] ダイアログボックスの \[アプリケーション \] 列で @servicenow/now-mobile-app-bridge を選択し、\[ データリソース \] 列で \[モバイルアプリ\] を選択します。  
12. ダイアログボックスの右下隅にある \[ 追加 \] を選択して、 モバイルアプリブリッジ データリソースをページに追加します。  
    注:  
    \[追加\] ボタンが表示されていない場合は、ページを下にスクロールして \[ 追加 \] ボタンを確認します。
13. イベントハンドラーを追加して モバイルアプリブリッジ API をトリガーし、モバイル画面でネイティブ機能を有効にします。  
    たとえば、モバイルデバイスのボタンに対してイベントをトリガーする場合は、次のようにします。
    1. エディター ページの 左側にある 本文 を選択し、 コンポーネントの追加 を選択します。

    2. \[コンポーネント\] タブを選択し、使用するボタンの種類を選択します。
    3. ページの本文に追加したボタン コンポーネントを選択し、右側のダイアログ ボックスで \[ イベント \] タブを選択して、 \[ イベント ハンドラーの追加\] を選択します。

    4. \[ イベントハンドラーを以下に選択... \] ダイアログボックスで、\[ モバイルアプリ 1\] の下にあるイベントハンドラーの 1 つを選択し、構成します。

       注:  
       \[画面 ID\] フィールドには、有効なモバイル画面の <kbd class="ph userinput">sysid</kbd> を必ず入力してください。

    5. イベント ハンドラーの構成が完了したら、ダイアログ ボックスの右下隅にある \[ 追加 \] を選択します。
    {#mob-playbk-create-playbk-pg__ol_j2q_bhb_txb}
14. Now Experience フレームワークエディターページで、右上隅の \[保存 \] を選択してページを保存します。  
    プレイブックの構成については、「[Customize the Playbook Experience](https://www.servicenow.com/docs/access?context=playbook-customize-playbook&version=xanadu&pubname=xanadu-build-workflows&ft:locale=en-US)」を参照してください。  
    注:  
    GlideListProperties API の getTitle() メソッドは、ネクストエクスペリエンス (Seismic) ページを構成するために モバイルアプリブリッジ では使用できません。

## 次のタスク

Now Experience フレームワークページを作成したら、 MAB でモバイル Web 画面を作成する必要があります。次に、Now Experience フレームワークページの URL を MAB のモバイル Web 画面構成に追加する必要があります。この構成を完了する方法の詳細については、 [でのモバイル Web 画面の設定 モバイルアプリブリッジ](https://servicenow-prod.fluidtopics.net/7DmIbTqVARtgxJ5OdvUlyg "埋め込み Web ビュー内でホストされている重大ページ、クラシック Web ページ、またはサービスポータルページを有効にするには、 モバイルアプリブリッジ を使用してモバイル Web 画面を構成します。この機能を使用すると、 ServiceNow モバイル アプリのネイティブモバイル機能にアクセスできます。")のステップ 2 を参照してください。