このチュートリアルでは、ユーザーに少なくとも2つを選択させる条件付きロジックのあるチェックリストを作成します。
デザインの設定
- 手続きを続行させるために、少なくとも2つのボックスにチェックを入れるようユーザーに促すメッセージを含むテキスト要素を作成します。
- ラベル付きのチェックボックスを作成します。左側のクイックツールのform(フォーム)から、チェックボックス要素を選択し、⌥ を押しながら選択項目の右下に表示されたハンドルをドラッグします。ドラッグで必要な数の要素を作成します。
- エラーメッセージのテキスト要素を作成します。ここでのメッセージ内容として、
*次のページに進むには、少なくとも2つ選択する必要があります。*
と設定します。レイヤーパネルの名前横にある目のアイコンをクリックし、このエラーメッセージを非表示にします。
- テキスト要素「Submit」を追加します:クイックツールからボックスを選択し(または B を押す)、フォーム画面の下部分に長方形を描きます。
sf1_smaller.mov
チェックボックスの状態(State)を作成する
(※任意の作業となります。)
チェックボックスの状態を作成します:チェックされていない状態(Base)とチェックされた状態。
- チェックボックスとテキストラベルを選択し、トップバーにある Add State をクリックします。チェックされていない状態(Base)が自動的に作成されます。
- 2つ目の状態(Checked)を作成し、Enter を押します。
- チェックされた状態で、キャンバス画面右側のプロパティパネル(Propaties Panel)にある「CHECKBOX」で、チェックボックスのオプションを
Checked
に設定します。
- この作業を配置したすべてのチェックボックス要素で繰り返す。
sf2_smaller.mp4
チェックボックスに変数を割り当てる
ここでは、チェックボックスがクリックされた回数を記録するcount変数を作成します。
- クイックツールパネルの下部にある変数($)をクリックし、+ New Variables を選択して変数を追加します。次に、変数名を「Count」とし、デフォルト値「0」を代入して、Enterを押します。
- 最初のオプションにインタラクションを追加するために、プロパティパネルの上部にある Interactions または + をクリックします。