《Bubble》使用中のデバイス種類を判別する実装方法（プラグイン）

スマートフォン使用時のみ動作させる方法

スマートフォンにて「SNS共有」ボタンを押すと、共有機能を呼び出しました。

[画像]

PCにてボタンを押すと、メッセージが表示されました。

[画像]

１．プラグインをインストール

isMobileプラグインをインストールします。

ユーザーが特定タイプのデバイスを使用しているかどうかを、yes/no形式で返してくれます。

[画像]

２．エレメントを配置する

本記事では、モバイル共有機能（佐藤さんが記事を書き終わったらリンクをつける）の実装後から引き続き実装します。

Alert、isMobileを配置します。

[画像]

Alertに表示したいテキストを入力します。

[画像]

３．ワークフローを設定する

まずは、ユーザーがスマートフォンを使用している場合です。

この場合は、ボタンを押すとスマートフォンの共有機能を呼び出します。

Workflowタブにて、ボタン押下時のeventを選択します。(Button SNS共有 is clicked)

その中のOnly whenに「isMobile A’s Phone? is “yes”」と設定します。

[画像]

続いて、ユーザーがスマートフォンを使用していない場合です。

この場合は、画面上部にメッセージを表示します。

「SNS共有」ボタン押下時のeventをもうひとつ作ります。

クリック時のeventを作るには点線四角形の「Click here to add an event…」より「An element is clicked」を選択します。 または、既にあるeventを右クリックでコピー&ペーストし、中身を書き換えます。

[画像]

[画像]

Actionにはアラートを表示する「Show message」を設定します。

[画像]

Only whenの条件に「isMobile A’s Phone? is “no”」と設定します。

[画像]

以上で完成です。スマートフォンやPCでプレビューし、それぞれの端末で動作を確認してみてください。