Triggering a Check Box

May 21, 2012

I selected  the freeform question and picked "Pick Many". I added a little check box on the corner so that wehn the user clicks the shape they know when it is picked. I triggered it to be selected when they click on the shape, but I can not figure out how to to deselect the check box when I click the shape.

Normal

Selected

Deslected.

Joshua

6 Replies
Phil Mayor

I would remove the checkbox and just add an image of a tick or an outline on the shape. 

You can change the state of the check box to unselected (normal), but I just think this is bad UI design to use a check box.  You are giving the user an object that they have preconceptions on how it should work but are using it differently.

David Burton

Joshua,

One way to create a toggle effect is to use a variable and use this variable in a condition to check what state the check box should display. I threw together a brief outline for this setup below.

1. Create a variable with the following format by selecting the X on the trigger panel.

Name: Check

Type: Numeric

Value: 0

2. Now add a trigger to your shape that increments the 'Check' variable by 1 when clicked.

Trigger Wizard when your shape is selected:

Action: Adjust variable

Variable: Check

Operation : + Add

Value: Value 1

When: User clicks

Object: (Your Shape)

3. Now we need to add some slide triggers (Add trigger with nothing selected) to toggle the check box state.

Trigger Wizard:

Action: Change state of 

On Object: Button 1 - "Check Box 1" (or any object with states)

To State: Selected

When: Variable changes

Variable: Check

On Condition (Green Plus to add Condition):

     AND/OR: And

     List:: Variables

     If: Check

     Operator: == Equal to

     Value: 1

4. Duplicate the above trigger by selecting the copy then paste icons from the Triggers Panel. Once duplicated, just change the following statements:

To State: Normal

On Condition: If check is equal to 2.00

5. Finally, add one last slide trigger (Add trigger with nothing selected) to reset the Check variable back to 0.

Trigger Wizard:

Action: Adjust variable

Variable: Check

Operation : = Assignment

Value: Value 0

When: Variable changes

Variable: Check

On Condition (Green Plus to add Condition):

     AND/OR: And

     List:: Variables

     If: Check

     Operator: == Equal to

     Value: 2

The above steps or the attached story file below is just one example of how to setup a toggle type switch.  I hope this helps!

ToggleTrigger.story

This discussion is closed. You can start a new discussion or contact Articulate Support.