Editing a Design State

Learn how to edit a design state in Storyboard Designer.

Master/State Context

Once a Design State is added to the application, a new button will appear at the bottom of the Storyboard Editor. This is the Master/State context selector. This button is responsible for determining what information is shown in the Properties View and Variables View, as well as how changes will be applied to the model.

master_state_editor_button.png

This button also shows up in the Storyboard workbench toolbar.

master_state_toolbar_button.png

Master Context and State Context can be thought of as Global and Local contexts.

  • When in Master Context, changes made in the Storyboard Editor, Properties View or Variables View will affect the global state, the regular Screen and all Design States that do not specifically override a value will inherit the change.

  • When in State Context, changes made in the Storyboard Editor, Properties View or Variables View will affect only the currently selected Design State. The exception to this is changes made to elements on the regular Screen will still be propagated to all Design States that do not specifically override the value, since changes to the regular Screen will always be global.

Storyboard Editor

Changes made to model objects in a Design State will automatically add the changes to the Design State. Changes to internal model object attributes such as x, y, width, height and hidden can be made directly through drag and drop operations as is typical when working with the Storyboard editor. The primary difference with the introduction of Design States is depening on your current Context Mode the changes will either be applied globally or locally.

Keep in mind that additions and deletions are always global operations.

Properties View

When in State Context the title at the top of the Properties View will be green and marked with a Design State icon. All properties that are changed in a Design State will be highlighted green and styled in bold text.

design_state_properties.png

When in State Context, changing a property that does not have a variable bound to it will open the following dialog:

design_state_no_variable_bound.png

The purpose for this dialog is that Design States can only change properties that can be changed at runtime, in the case of render extensions, only properties with variables bound may be changed at runtime.

  • If the change is intended to be a global change, then the user will select Switch to Master Context.

  • If the user actually wants to remain in State Context and change the specific Design State, then creating a new variable will allow changes to be made specifically to the selected model object in the context of the current Design State.

Variables View

When in State Context, variables that are changed in a Design State will be styled in bold in the Variables View.

variables_view_design_state.png
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

0 comments

Article is closed for comments.