Difference between revisions of "Attributes Tab"
Yvonne.milne (Talk | contribs) |
Yvonne.milne (Talk | contribs) |
||
| Line 1: | Line 1: | ||
| − | |||
| − | |||
==The App Inspector== | ==The App Inspector== | ||
The App Inspector is your best friend during development as it provides a complete overview of your App. | The App Inspector is your best friend during development as it provides a complete overview of your App. | ||
| Line 14: | Line 12: | ||
==The Attributes Tab== | ==The Attributes Tab== | ||
| − | + | The Attributes Tab contains the App Attributes for Pages, Sections, FormItems and GridColumns. | |
| + | |||
| + | <div style="height:60px;margin-bottom:5px;padding:5px;border:0px solid orange;border-left:5px solid orange;background:#fff8dc;vertical-align:middle;position:relative;"> | ||
| + | [[File:bm-noteicon.png|top|40px|link=]]<div style="position:absolute;top:3px;margin-bottom;bottom:5px;margin-left:50px;"><b> Pro Tip</b> | ||
| + | If the App Inspector is closed, double-click a UI Element's header or caption to slide in the '''Attributes Dialog'''.<br/> | ||
| + | </div> | ||
| + | <span style="height:6px;"> </span> | ||
| + | </div> | ||
| + | ===Selecting a UI Element=== | ||
[[{{ns:file}}:attributes_tab2.png|left|link={{filepath:attributes_tab2.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab2.png|left|link={{filepath:attributes_tab2.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | ===Selecting an Attribute Category=== | ||
| + | Focus in on a single attribute category: | ||
[[{{ns:file}}:attributes_tab3.png|left|link={{filepath:attributes_tab3.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab3.png|left|link={{filepath:attributes_tab3.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | Or view them all: | ||
[[{{ns:file}}:attributes_tab4.png|left|link={{filepath:attributes_tab4.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab4.png|left|link={{filepath:attributes_tab4.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | ===Selecting an Attribute=== | ||
| + | Scroll through the attributes or search for an attribute by its first letter: | ||
[[{{ns:file}}:attributes_tab5.png|left|link={{filepath:attributes_tab5.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab5.png|left|link={{filepath:attributes_tab5.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| Line 31: | Line 42: | ||
<br clear=all> | <br clear=all> | ||
| + | ===Changing Attributes=== | ||
| + | Most attributes take effect in the Page Builder as you change them: | ||
[[{{ns:file}}:attributes_tab7.png|800px|left|link={{filepath:attributes_tab7.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab7.png|800px|left|link={{filepath:attributes_tab7.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | For some attributes - where the data needs to be reloaded, as in the Section Filter shown below - the '''Apply Changes''' and '''Revert Changes''' buttons are displayed in the actionbar. Click the green tick to '''Apply Changes'''. | ||
[[{{ns:file}}:attributes_tab8.png|left|link={{filepath:attributes_tab8.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab8.png|left|link={{filepath:attributes_tab8.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | ===Actionbar Buttons=== | ||
| + | As shown above, the '''Apply Changes''' and '''Revert Changes''' buttons appear in the actionbar when confirmation is needed to commit a change. | ||
| + | The actionbar has four further buttons: | ||
| + | * '''Toggle Editable''': click this to toggle between locking the attributes and making them editable. | ||
| + | * '''Refresh''': click this to refresh the Attributes panel, e.g. if you manually resize a grid column or edit a formitem caption in the Page Builder. | ||
| + | * '''Undo''': undo attribute changes. | ||
| + | * '''Redo''': redo attribute changes. | ||
| + | |||
[[{{ns:file}}:attributes_tab9.png|left|link={{filepath:attributes_tab9.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab9.png|left|link={{filepath:attributes_tab9.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| + | ===The '...' Button=== | ||
[[{{ns:file}}:attributes_tab10.png|left|link={{filepath:attributes_tab10.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab10.png|left|link={{filepath:attributes_tab10.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
| Line 46: | Line 69: | ||
<br clear=all> | <br clear=all> | ||
| + | ===Dock Tab=== | ||
[[{{ns:file}}:attributes_tab1.png|left|link={{filepath:attributes_tab1.png}}|Attributes Tab]] | [[{{ns:file}}:attributes_tab1.png|left|link={{filepath:attributes_tab1.png}}|Attributes Tab]] | ||
<br clear=all> | <br clear=all> | ||
Revision as of 09:52, 18 December 2017
Contents
The App Inspector
The App Inspector is your best friend during development as it provides a complete overview of your App.
It is organized into Tabs. Each Tab is relevant to a particular workspace. You can double click a Tab to detach it into its own floating window.
Clicking the small icon on the far right of the App Inspector title bar will detach it into its own floating window.
Double clicking the window title bar when it is floating will attach it back into place.
The Attributes Tab
The Attributes Tab contains the App Attributes for Pages, Sections, FormItems and GridColumns.
If the App Inspector is closed, double-click a UI Element's header or caption to slide in the Attributes Dialog.
Selecting a UI Element
Selecting an Attribute Category
Focus in on a single attribute category:
Or view them all:
Selecting an Attribute
Scroll through the attributes or search for an attribute by its first letter:
Changing Attributes
Most attributes take effect in the Page Builder as you change them:
For some attributes - where the data needs to be reloaded, as in the Section Filter shown below - the Apply Changes and Revert Changes buttons are displayed in the actionbar. Click the green tick to Apply Changes.
Actionbar Buttons
As shown above, the Apply Changes and Revert Changes buttons appear in the actionbar when confirmation is needed to commit a change. The actionbar has four further buttons:
- Toggle Editable: click this to toggle between locking the attributes and making them editable.
- Refresh: click this to refresh the Attributes panel, e.g. if you manually resize a grid column or edit a formitem caption in the Page Builder.
- Undo: undo attribute changes.
- Redo: redo attribute changes.
The '...' Button
Dock Tab
