Bubble上での横スクロールについて

いつもお世話になっております。

現在、bubbleでiPhoneアプリを作成しています。(BDKを用いてネイティブ化します)
そのアプリ内でスマートニュースのような、横スクロールメニュー(赤く囲っているところ)でカテゴリーを選択し、該当カテゴリーの記事が一覧表示されるものを実装しようと考えています。

横スクロールメニューについて、Repeating Groupを用いて再現することはできますが、下部の記事の表示と連携させることができませんでした。

質問なのですが、RepeatingGroup以外で、Elementsなどを設置し、横スクロールできる機能(プラグインを含む)はありますか?

前提条件
横スクロールメニューの下部に設置する記事の一覧表示は、FloatingGroup内にRepeating Groupを設置したものをカテゴリーの数だけ、複製して配置します。(iphoneアプリにした際にページ切り替えになるとロードの時間が長くなるため)
そして、記事をタップすると(workflow>navigation>go to pageのsend more parameters to the pageを用いて)各記事の詳細情報が別ページで表示される仕様を考えています。
また、floatingGroupの表示は、各floatingGroupのconditionから設定しようと思います。

よろしくお願いいたします。
d7945-429-40efc9bfca1151ce69b3-0 (1)

「いいね!」 1

LayoutがRowのグループの中に、スクロールさせたいタブを置いていきます。
そして、そのグループにClassまたはIDを付与し、以下のCSSを適用させます。

flex-wrap: nowrap !important;
overflow-x: scroll !important;

flex-wrapをnowrapにすることで、ブラウザ幅が縮んでも改行されなくなります。
そしてそのはみ出した部分を、overflow-xのscrollで、横スクロールにさせています。

実際に作ってみたのでご参照ください。

↓動きはこんな感じ

↓エディタ

「いいね!」 5

Aki_Sydney様

ありがとうございます。そちらで試してみます。

Aki_Sydney様

いただいたエディタの通り、elementのグループに{addClass:“nav_menu”}を付与する形に行いましたが、実装できませんでした。
しかし、workflowのAdd Class by ID CSSTools を用いて、Classを付与した後、Add Custom Style To Head CSSTools を用いて上記のCSSを適用すると実装できました。

ご回答いただき、ありがとうございました。

「いいね!」 1