勝手にClickTips:〇×クイズ問題の実装
今回はスマホアプリでよくある診断やクイズで使える○×クイズの実装方法について解説いたします。超~シンプルに作ったので、参考にどうぞ。
<うごき>
こんな感じです。ナンバーボックスに数字を入れて、ボタンをクリック。正解の数字だった場合、正解のページが表示され、それ以外は不正解のページが表示されます。
<作り方>
実はデータベースも使わず、画面上のエレメントだけでやっています。まず、まったく同じ画像(ボタンでもなんでも大丈夫です、ようは回答をクリックするボタン)を2つ用意して、一つ(仮にA画像)を正解ページにページ移動するようにして、もう一つ(仮にB画像)を不正解のページに移動するようにClickflowを作成します。
画像の表示条件で、ナンバーボックスに正解の数字を入れた時のみA画像を表示、それ以外の時はB画像が表示されるように設定。あとはClickFlowで正解ボタン(A画像)は正解ページへ、不正解ボタン(B画像)は不正解ページへ移動するように設定しておくだけで、完成です。
どうでしょうか?
おそらく、作業時間的には、二つの同じ画像をまったく同じ場所に配置調整するのが一番時間かかります(笑) あと、数字ではなくてもはい、いいえの選択肢でもできるとは思います。シンプルisベスト。
では、また!
以上
0コメント