# Adalo 条件付きで画像をランダムに表示させたい

**URL:** <https://www.nocode-faq.com/t/topic/2974>\
**Category:** Adalo\
**Created:** [2022 年 6 月 30 日午前 5:49 UTC](https://www.nocode-faq.com/t/topic/2974 "2022-06-30T05:49:15Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午前 5:49 UTC](https://www.nocode-faq.com/t/topic/2974/1 "2022-06-30T05:49:15Z")

</div>

【前提】  
本件ではログイン機能は使用しないこととします

【実装したい機能】  
①47都道府県の画像をランダムに表示する機能  
②自分が住んでいる県を設定すると、そこから日帰りで行ける（※要定義）県の中からランダムに表示する機能

【今既にできていること】  
①の機能は実装できています。  
仕組みとしてはRAND関数を用いて、1から47までの範囲で乱数を発生させることで、それに応じた都道府県が表示されるというものです。  
（1の場合は北海道、2の場合は青森県、・・のような形で）  
 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/2/28c5a8f5dae999fc0809c8765898774b8c574d7f.png)

テスト版が下記でございます。（1北海道・2青森・3岩手・4宮城・5秋田、のみ登録しています）

> **[都道府県をランダムに](https://previewer.adalo.com/4e4a336d-7662-45d9-ad6c-566104dbd4c8)**
>
> Built with Adalo

【できていないこと】  
現状では②の機能を実装することができていません。  
イメージとしては下記画像のように、

「日帰りモード」ボタンを押す  
→ドロップダウンから住んでいる県を選ぶ  
→「ランダムに表示する」ボタンを押す

といった流れを考えています。

 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/2/245fbf5011edc05f5bb3397f0d29ef8bc6cd7e97.png)

日帰りの定義付けの方法として私が思いつく限りでは、  
・「〇〇県であれば××県と△△県」というようなリレーションを作る  
・Locationプロパティを用いて、住んでいる県から〇〇km以内にある県と定義する  
といった方法があり得るのかなと考えております。（後者はAdaloの機能では無理かもしれません）

【質問したいこと】  
②のような機能を実装することは可能でしょうか。

---

<div class="post-metadata">

**Author:** ![kinari](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/kinari/32/6625_2.png) [@kinari](https://www.nocode-faq.com/u/kinari)\
**Post date:** [2022 年 6 月 30 日午前 6:08 UTC](https://www.nocode-faq.com/t/topic/2974/3 "2022-06-30T06:08:05Z")

</div>

> [@adaloman1](#):
>
> ・Locationプロパティを用いて、住んでいる県から〇〇km以内にある県と定義する  
> といった方法があり得るのかなと考えております。（後者はAdaloの機能では無理かもしれません）

ロケーション機能というものがありまして、GoogleAPIを使って、ユーザーの現在位置を取得したり、2つの座標間の距離を計算したりできます。

ただ、直線距離だけで日帰りでいけるかどうかを定義するのは難しそうですね。あと、神奈川県といっても神奈川県のどことの距離を取るかによっても結果が変わっちゃいますしね🤔

マニュアルでリレーションするのも大分大変そうですけど、そのほうが確実な方法だとは思います！

---

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午前 7:26 UTC](https://www.nocode-faq.com/t/topic/2974/4 "2022-06-30T07:26:30Z")

</div>

ご返信ありがとうございます。  
日帰りの定義付はリレーションで行う方向で考えてみようと思います。

ただリレーションしたその後、どうやってランダム性を持たせて表示させるかという部分が完全に行き詰っています。

ドロップダウンで選んだ県から日帰りで行ける（とリレーションされている）県の画像を  
リストで表示させることまではできたのですが、

> **[都道府県をランダムに改](https://previewer.adalo.com/56446222-389b-4b4c-b2c8-e38359f22ab6)**
>
> Built with Adalo

こちらはあくまでリストの1番上だけを表示させてるに過ぎないため、  
ランダムでは全くないですし、①の機能と違って選び直すこともできません。

下記質問への回答からヒントを得て、  
毎回ランダムで変えることのできる抽選用の数字（抽選No）をプロパティで付与し、  
抽選Noで高い順（又は低い順）にソートをかけることで、実質的なランダム性を持たせることができ、選び直すこともできるのではないかと考えましたが、  
1アクションで全ての県の抽選Noをランダマイズする方法が分かりませんでした。

> [@ランダムにデータを抽出する方法が分からない](https://www.nocode-faq.com/t/topic/2962/2):
>
> 表示だけで良ければ、 ListのCostomFilterと、ソートで実装することができます。 具体的には,以下のような方法です。 準備として、 UserDB に No. ・・・固定のID 抽選No ・・毎回ランダムで変わる抽選用の数字 を用意します。 学年ごとのNoでフィルターし、抽選Noでソート 抽選Noは、Counterで開くたびに全…

かなり惜しいところまでいってるような気がするのですが・・力及ばずといった感じです。  
もし何か解決する方法がありましたらご教示いただけますと幸いです。  
何卒よろしくお願い申し上げます。

---

<div class="post-metadata">

**Author:** ![kinari](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/kinari/32/6625_2.png) [@kinari](https://www.nocode-faq.com/u/kinari)\
**Post date:** [2022 年 6 月 30 日午前 8:22 UTC](https://www.nocode-faq.com/t/topic/2974/5 "2022-06-30T08:22:10Z")

</div>

![CleanShot 2022-06-30 at 17.17.09@2x](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/b/b131648419bc129920e7fafbc325aff5d288c3f7.png)  
Random Picker というコンポーネントがありまして、これで解決できるかと！

---

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午前 10:15 UTC](https://www.nocode-faq.com/t/topic/2974/6 "2022-06-30T10:15:27Z")

</div>

申し訳ございません、ヒントを頂きたいです。

ランダムピッカーで解決できるというのは、  
「1アクションで全ての県の抽選Noをランダマイズできない問題をランダムピッカーで解決できる」という意味か、「抽選Noとかややこしいことは考えず、ランダムピッカーの機能だけで、②の機能を実装できる」という意味か、どちらでしょうか？

このアプリを作り始めた際にまず、  
ランダムピッカーを使って画像をランダムに表示させることを考えたのですが、  
ログイン機能を使用しないと難しいという結論に至った結果、現在のような仕様になっております。  
（そのため最初に前提として、ログイン機能は使用しないと記載させていただきました）

前提の認識が大きく誤っている可能性もあるため、  
何かおかしなことを言っていましたらご指摘いただけますと幸いです。

---

<div class="post-metadata">

**Author:** ![kinari](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/kinari/32/6625_2.png) [@kinari](https://www.nocode-faq.com/u/kinari)\
**Post date:** [2022 年 6 月 30 日午前 11:53 UTC](https://www.nocode-faq.com/t/topic/2974/7 "2022-06-30T11:53:23Z")

</div>

作ってみました。一つのページで済まそうとると結構複雑になっちゃいますね💦  
県を選択するページとランダム抽出するページ分けた方がいいかもですが、とりあえず👇からクローンしてみてください！わからないところあればまたご質問くださいー

> **[Random Picker](https://previewer.adalo.com/1a1183eb-b961-4d11-87bd-815f97dc7381)**
>
> Built with Adalo

---

<div class="post-metadata">

**Author:** ![tsubasa](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/tsubasa/32/8670_2.png) [@tsubasa](https://www.nocode-faq.com/u/tsubasa)\
**Post date:** [2022 年 6 月 30 日午後 1:34 UTC](https://www.nocode-faq.com/t/topic/2974/8 "2022-06-30T13:34:50Z")

</div>

> [@adaloman1](#):
>
> 1アクションで全ての県の抽選Noをランダマイズする方法が分かりませんでした。

ここの意図は、このリンク先で説明している

> 抽選No ・・毎回ランダムで変わる抽選用の数字

が変わらなかったということですか？

①CountTimeを1秒に設定する

 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/1/19060be76ed32fafe4af4cef0485265a70eb4388.png)

②CountTimeが0になったら、抽選Noがランダムに 決まる

 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/b/beed49bd9ed7748c3cb6407c20882f4f5cd2d3c4.png)

以降、つねに誰かが、初めて入ってきて、1秒以上滞在した場合に、数字が変わっていく。

という挙動になります。説明の意図間違っていたら申し訳ない💦

---

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午後 2:03 UTC](https://www.nocode-faq.com/t/topic/2974/9 "2022-06-30T14:03:57Z")

</div>

見本まで作っていただきありがとうございます。

クローンを確認しながら見よう見まねで作ってはみたのですが、なかなか上手くいかず、  
自分の中で消化して活用するのに少し時間がかかりそうなので  
不明点等洗い出した後に、改めて伺わせていただければと思います。

よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午後 2:31 UTC](https://www.nocode-faq.com/t/topic/2974/10 "2022-06-30T14:31:27Z")

</div>

ご回答ありがとうございます。

失礼いたしました、私のカウントダウンタイマーの扱い方がなっていなかっただけで  
今やってみたところ実装することができました！

> **[都道府県をランダムに改](https://previewer.adalo.com/56446222-389b-4b4c-b2c8-e38359f22ab6)**
>
> Built with Adalo

ランダム性を持たせるという意味では、百点満点の挙動なのですが  
やはりカウントダウンタイマーを使用する都合上、選び直すたびに画面が遷移してしまうのが少しネックに感じております。

これについてはもうこういうものだと割り切るしかないでしょうか・・？  
それとも私のセンスが無いだけで、画面遷移の回数を減らす余地はありますでしょうか。

---

<div class="post-metadata">

**Author:** ![tsubasa](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/tsubasa/32/8670_2.png) [@tsubasa](https://www.nocode-faq.com/u/tsubasa)\
**Post date:** [2022 年 6 月 30 日午後 3:06 UTC](https://www.nocode-faq.com/t/topic/2974/11 "2022-06-30T15:06:27Z")

</div>

何とかなりそうで、良かったです。

> やはりカウントダウンタイマーを使用する都合上、選び直すたびに画面が遷移してしまうのが少しネックに感じております。

これは、一瞬でてくるカウントダウンタイマーのScreenのことですよね？  
であれば、タイマーのページを専用でつくらなくても、選びなおすのページにタイマーをそのままおけば良いと思います。（すでにランダム表示で表示されたものは、再度フィルターされないので）

 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/7/78affa1372484ea098fc44ac0cb2636147f29370.png)

それで、選びなおすを押した時に、全く同じ構成のページに飛ぶ というのをすればどうでしょうか？

---

<div class="post-metadata">

**Author:** ![adaloman1](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@adaloman1](https://www.nocode-faq.com/u/adaloman1)\
**Post date:** [2022 年 6 月 30 日午後 9:59 UTC](https://www.nocode-faq.com/t/topic/2974/12 "2022-06-30T21:59:18Z")

</div>

> [@tsubasa](#):
>
> （すでにランダム表示で表示されたものは、再度フィルターされないので）

そうだったんですね、ここをちゃんと理解できていませんでした。  
ありがとうございます！！

また行き詰ったら質問させてください。  
ありがとうございました。
