Visual Studio CodeでAPLドキュメントの管理やプレビューを行う
Alexa Skills Toolkit for Visual Studio Code（ASK Toolkit for VS Code）を使って、スキルでAlexa Presentation Language（APL）ドキュメントの作成や編集、プレビューができます。ASK Toolkit for VS Codeは、Alexaスキルの作成からテスト、導入までを簡単に行える拡張機能です。前提条件とインストール手順については、ASK Toolkit for VS Codeで開発を始めるを参照してください。
概要
APLを使用して、スキルに追加する視覚エクスペリエンスを作成できます。Echo Show、Fire TV、一部のFireタブレットなどのサポートされているデバイスで視覚要素を表示し、ユーザーはその視覚要素を使って操作や対話ができます。視覚エクスペリエンスには、アニメーション、グラフィック、画像、スライドショー、ビデオを含めることができます。詳細については、スキルに視覚要素とオーディオを追加するを参照してください。
以下は、Visual Studio Code IDEのAPL Previewページのスクリーンショットです。
APLドキュメントの新規作成
APLドキュメントを作成する
- アクティビティバーで、Alexaアイコンをクリックします。Alexa Skills Toolkitサイドバーが表示されます。
- Skills、スキル、Alexa Presentation Language (APL)の順に展開し、Createを選択します。Choose a templateダイアログが表示されます。
- 使用するAPLテンプレートをクリックし、ドキュメントの名前を入力してEnterを押します。
新しいAPLドキュメントがskill-package\response\displayフォルダのスキルに追加されます。
既存のAPLドキュメントのダウンロード
既存のAPLドキュメントがAlexa開発者コンソールにある場合、ダウンロードしてローカルのVS Codeプロジェクトに追加できます。
既存のAPLドキュメントをダウンロードする
- アクティビティバーで、Alexaアイコンをクリックします。Alexa Skills Toolkitサイドバーが表示されます。
- Skills、スキル、Alexa Presentation Language (APL)の順に展開し、Downloadを選択します。Download APL documentダイアログが表示されます。
- ローカルプロジェクトにダウンロードするAPLドキュメントを選択し、Downloadをクリックします。
APLドキュメントのプレビューと編集
APLドキュメントをプレビューしてユーザーにどう表示されるかを確認できます。
APLドキュメントのプレビューと編集を行う
- アクティビティバーで、Alexaアイコンをクリックします。Alexa Skills Toolkitサイドバーが表示されます。
- Skills、スキル、Alexa Presentation Language (APL)の順に展開し、Previewを選択します。ダイアログが開き、スキルで利用可能なAPLドキュメントが表示されます。
- プレビューするAPLドキュメントを選択します。ドキュメントのエディターが開き、APL Previewペインが表示されます。
- （任意）APLドキュメントのJSONを直接編集するか、データソースを編集して、ファイルを保存します。
APLドキュメントへの変更を保存すると、APL Previewペインが自動更新され、変更内容が表示されます。
APLドキュメントプレビューのViewportの変更
APLドキュメントプレビュー時にViewportを変更して、別の画面でどのように表示されるかを確認できます。
Viewportを変更する
- アクティビティバーで、Alexaアイコンをクリックします。Alexa Skills Toolkitサイドバーが表示されます。
- Skills、スキル、Alexa Presentation Language (APL)の順に展開し、Change viewportを選択します。ダイアログが開き、利用可能なViewportが表示されます。
- 新しいViewportを選択してEnterを押します。APL Previewペインが更新され、新しいViewportにドキュメントが表示されます。
関連トピック
最終更新日: 2022 年 06 月 30 日