# オーディオプレーヤー *スキルレベル: 中級* ## 開始前に * [データベース](https://help.adalo.com/ja/database) と [画面とコンポーネント](https://help.adalo.com/ja/component-basics) について知っていること。 * [マジックテキスト](https://help.adalo.com/ja/component-basics/inserting-dynamic-text) の使い方を知っていること * この機能を使用するには有料の Adalo プランは必要ありません ## 手順 {% tabs %} {% tab title="シンプル" %} オーディオプレーヤーコンポーネントは、Web、iOS、Androidで動作し、バックグラウンド再生をサポートしています。これは、ポッドキャスト、音楽、オーディオブック、およびその他のURLを持つオーディオファイルに最適です。セットアップは非常に簡単です！ **1.)** Adaloアプリ内で、左上隅にある大きなプラスサインをクリックします **2.)** 検索バーに **"Marketplace"** と入力し、**Explore Marketplace** をクリックします **3.)** リストから **Audio Player** を見つけ、**Install** をクリックしてから **Done** をクリックします **4.)** コンポーネントリストに戻り、検索バーに **Audio Player** と入力し、コンポーネントを目的の画面にドラッグアンドドロップします **5.)** オーディオプレーヤーが動作するために必要なのは実際には1つだけです。**Audio Player** のドロップダウンセクションで、データベースからの曲のURLを入力するか、マジックテキストを使用して **URL of Song** フィールドを埋めます。 ![](https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-f26951b94e15aae41001dce45cbe35945529dd13%2FScreen%20Shot%202021-10-08%20at%202.26.29%20PM.png?alt=media) **6.)** 他のオプションは完全に任意ですが、ユーザーエクスペリエンスを向上させるのに役立ちます！異なるセクションの概要は以下の通りです： * **オーディオプレーヤー** - ここでは、曲のURL、アーティスト名、アルバム名の変更、自動再生の有効化、他の画面での再生の有効化、トラックの終了時にアクションを追加することができます。 * **アートワーク** - このセクションでは、アルバムアートワークのURLを追加したり、アートワークのサイズや角丸の制御、アートワークを完全に無効にしたりすることができます。アートワークURLを常に持っている方が良いです。なぜなら、アートワークは常に表示されるからです（例えば、電話がロックされている場合など）。 * **プログレスバー** - プログレスバーに関するすべてをカスタマイズできます。色、太さ、影、角丸、ボーダー、オーディオの残り時間の表示方法など。 * **再生と一時停止ボタン** - ここでは、再生と一時停止に使用されるシンボルをカスタマイズできます。色、サイズ、各ボタンに対する追加アクションを変更できます。これらのボタンには再生と一時停止のアクションが組み込まれています。 * **進むと戻るボタン** - このセクションでは、進むと戻るボタンのアイコン、サイズ、追加アクション、色、スキップする時間などをカスタマイズできます。または、それらを完全に無効にすることもできます。 * **左右のボタン** - このセクションはデフォルトで無効になっていますが、ユーザーがトラックに投票したり、お気に入りに追加したり、購入したりするための追加ボタンをプレーヤーに追加するために有効にすることができます。これらのボタンには、色、アイコン、サイズ、追加アクションのコントロールもあります。これらのボタンには、再生、一時停止、進む、戻るボタンのような組み込みアクションはありません。 {% endtab %} {% tab title="ビデオ" %} {% embed url="" %} {% endtab %} {% endtabs %} ## 例 外部コレクションを使用してポッドキャストを取り込み、ユーザーが独自のオーディオファイルをアップロードできるようにした[クローン可能なアプリ](https://previewer.adalo.com/b1b1fc0b-e7a4-46f8-aee9-da12b5b3790c)を作成しました。アプリのクローン方法がわからない場合は、[こちら](https://help.adalo.com/ja/settings/copying-vs-cloning-your-app/how-to-clone-an-app)で学ぶことができます。以下は、デフォルト設定と史上最高のサウンドトラックが再生されているオーディオプレーヤーの例です。 ![](https://gblobscdn.gitbook.com/assets%2F-LhGHkPsv15svPIU5I7C%2F-MDrHaDGLB9h1G0o8JAS%2F-MDrIFnr9Ci9ao2q28KD%2Fimage.png?alt=media\&token=e0683165-14a1-484b-9921-0b80936b1a76) ## もっと詳しく * 1つの画面に**1つのオーディオプレーヤーコンポーネントのみを使用**するのがベストプラクティスです。同じ画面に複数配置すると、すべてが同時に再生されるなどの奇妙な動作が発生する可能性があります。通常は、まず「トラックリスト」を作成し、リスト内の各アイテムを新しい画面にリンクして、その画面に1つのオーディオプレーヤーを配置するのが最善です。 * リスト内ではオーディオプレーヤーは機能しません。 * ネイティブの電話プレーヤー（たとえば、電話がロックされているとき）でトラックの再生ヘッド（オーディオタイムラインのドットをドラッグする）を「スクラブ」することはできません。 * オーディオプレーヤーにアートワークを表示しないことを選択しても、アートワークを指定することが望ましい場合があります。なぜなら、オーディオが再生されているときには、アートワークが電話の通知領域/ロック画面にも表示されるからです。 * ユーザーがボタンを押すたびに「Plays」というコレクションを追加し、オーディオプレーヤーボタンの追加アクションに作成アクションを追加することで、再生回数を追跡することもできます。これにより、ユーザーがボタンを押すたびにこのコレクションにレコードが作成され、再生回数をカウントできます。 * オーディオプレーヤーを使用する最良の方法は、[外部コレクション](https://help.adalo.com/ja/integrations/external-collections-with-apis)や[カスタムアクション](https://help.adalo.com/ja/integrations/custom-actions)を使用して、[Spotify](https://developer.spotify.com/documentation/web-api/)、[Soundcloud](https://developers.soundcloud.com/docs/api/guide#playing)、[Audius](https://audius.org/api/)、[Listen Notes](https://www.listennotes.com/api/)などの外部サービスAPIに接続することです。また、[RSSフィード](https://rss.com/blog/find-rss-feed/)を使用することもできます。 * ユーザーが独自のトラックをファイルプロパティにアップロードし、そのファイルのURLをオーディオプレーヤーコンポーネントの曲URLとして参照することもできます。現在サポートされているファイルタイプは\*\*.mp3\*\*のみです。 ## ヘルプ この記事に関する追加のヘルプが必要な場合は、いつでも[コミュニティフォーラム](https://forum.adalo.com/)で質問できます！投稿する際には、この記事へのリンクも貼り付けてください！ チュートリアルやヘルプドキュメントのリクエストがありますか？[お知らせください！](https://ideas.adalo.com/tutorial-requests)