見出し画像

【Adalo】ログインを使わないで乱数をインプットに入力する方法を考えてみた

(なぜこれを書いたか)
ある方から「ボタンを押すと乱数が発生し、その乱数に対応した画像が表示されるアプリをAdaloで作りたい」という相談を受けました。但し、ログインはしないでやりたいという条件が付いていました。

ログイン無しだとなかなか名案が思い付かなかったのですが、最終的に以下のようなやり方でアプリを作りました。ログイン無しでアプリを作りたいという要望は他にもありそうなので備忘録として文書に残しておくことにしました。

普通はこう考えると思います。ボタンを押して乱数を発生させ、それをuserデータベースに転送し、その乱数をインプットで読み込む。画像を表示したリストをインプットの値でフィルターをかけて1個の画像に絞り込む。

結局、乱数を保持しておく場所としてuserデータベースが必要となり、そのためにログインシステムが必要となってくるわけです。(別にユーザーのメールアドレスが知りたいわけじゃないです)

今回は、こうしました。1行だけデータを持つデータベースを作り、このDBに紐づいたカスタムリストの中にボタンを設け、ボタンを押すとこのDBをUpdate出来るようにしました。こうすることでuserデータベースと同じような使い方が出来るようにしました。

1.こんなイメージのアプリを作りたい

要望を受けたのはこんなイメージのアプリです。ボタンを押すと画像が次々とランダムに切り替わります。

とりあえず以下のようなサンプルアプリを作りました。
ドーナツ4種類の画像を用意し、ボタンを押すと画像がランダムに切り替わっていきます。ボタンの下にインプットを設け、ここにボタンを押す度に発生する乱数が表示されます。

2.データベースを用意した(2種類)

ドーナツの画像が入ったデータベースとボタンを押すと乱数がUpdateできるデータベースを作りました。

①ドーナツのDB
DBを構成するプロパティとして「Number(数字)」、「製品名」、「写真」の3つを用意しました。これをカスタムリストに表示して乱数の番号で1つに絞り込むという考えです。

②乱数を保持しておくDB「乱数」を作る
今回ドーナツが4種類あるので、ボタンを押したときに乱数(1~4)が発生し、この乱数DBのRandomNoに数字が転送されて来ます。

3.1行だけのカスタムリストを作る

①カスタムリストにボタンを配置する
Home画面にカスタムリストを作り、「乱数」DBと紐づけます。カスタムリストにボタンを配置し、これを押すと乱数DBがUpdate出来るようにします。

②ボタンを押したときのAction(Update)の設定
ボタンを押すと「乱数」DBのRandomNoというプロパティがUpdateされるようにします。乱数はランダム関数RAND(1,4)で作りました。(1,2,3,4のいずれかの整数が発生します)

4.インプットを配置し、乱数を表示させる

Home画面のボタンの下の方にインプットを設け、ここに乱数を表示します。乱数は「乱数」DBに入っているのでそこから持って来ます。

ここがこのアプリの一番のポイントで、userデータベースでない一般のDBからデータを持ってくるときは通常一つの値を取得することは出来ません。ただ、今回作った「乱数」DBはデータが1行しか入っておらず、しかもRandomNoというプロパティしかないので乱数を取得することは容易です。

下記画面のようにRandomNoというプロパティの最大値でも最小値でも平均でもなんでもいいので設定しておきます(データが一つしか存在しないので最大値でも最小値でも平均値でもどれを選んでも同じ値を選んだことになります)ここではとりあえずMaxmum(最大値)を選んでおきました。

インプットにはMaxmum RandomNoが入るように設定しました。(乱数DBのRandomNoプロパティのうち最大値が入る、という意味です。1個しかデータが無いので最大値と言う表現に意味は無いですけど)

以上の設定で一応動くアプリは出来ますが、使ってみると細かい設定が必要なことが分かりました。

5.アプリの細かな微調整

①画像が切り替わるときにレイアウトが崩れる
・・・画像切り替え時にカスタムリストが消えて、ボタンの位置も上に瞬間ずれてしまう。これはカスタムリストを固定することで解決します。左ツールバーのEdit Stylesで一番上の固定(Fixed)の部分を初期設定のNone→Topに変更してやります。

②画像の上下が少し切り取られてしまう
画像の切り取りをなくしフルに画像表示できるように設定します。(Don'tCropを選択)

以上の手順で完成です。1行だけのデータベースを作ってuserDBと同じような動きをさせましたが、思いつくのに結構時間がかかりました。もしかしたら別の解決方法があるかもしれません。もし別の方法が有ったら教えて欲しいです。

(過去の投稿はこちら)
https://note.com/mucho3/n/n632515d056d1


この記事が気に入ったらサポートをしてみませんか?