Providing information about views

Provide information such as tags, documentation, and icon images for the view in its Overview properties.

• Add one or more tags to the view.
  The low-code designer uses these tags to categorize the view on the palette and within the library. If you do not specify a tag, you can find your view in the Uncategorized category.
• In the Documentation field, provide information about the view that helps people who reuse your view in their own UI pages or views.
  For example, describe the boundary events that your view fires.
• If you want your view to use named boundary events to move to the next step in the action, select Can Fire Boundary Event.
  In an application diagram, you see these boundary events as wires. This diagram also shows the view that fires the boundary event.
• If you want your view to be selectable as a template when someone creates a view, select Use as a Template.
  Tip: Add a content box to your view so that views that are based on the template have an area in which users can drop content.
• If you want pages or views that contain your view to display a label at design time, select Supports a label.
  To have the view access the label value in the runtime environment, switch to Behavior and add the following code as inline JavaScript:

  this.context.options._metadata.label.get("value");

• If you want to improve performance for the view, select Prototype-level event handlers.
  Selecting this option means that the event handlers for the view are in the prototype and not in every instance. The performance gain comes from having one set of the event handlers per view definition instead of having a set per view instance. However, the JavaScript code that you use to create and access variables differs between view instance-level event handlers and prototype-level handlers. For prototype-level event handlers, you must use the this keyword. The following table shows the coding difference for the two levels of event handlers:

  Instance-level event handlers	Prototype-level event handlers
  Define the variable in the inline JavaScript of the view: var myVariable = "123"; Access the variable in the load event handler: if(myvariable == "123") { ... }	Define the variable in the inline JavaScript of the view: this.myVariable = "123"; Access the variable in the load event handler: if(this.myvariable == "123") { ... }

  You can also look at the views for examples of the coding difference.

• You can specify HTML and JavaScript to create and enhance the design-time appearance of your view. For information, see Configuring the design-time appearance of views.