Element Attributes

Overview

In this tutorial, we will see how an element takes the value for its attributes even when they aren't explicitly defined. 

The Attributes

Every element in Jaspersoft Studio has many attributes, defining its graphical appearance and its behavior. These attributes are visible on the property panel.

The attributes are divided into categories. In Figure 1, above, you can see the categories of Appearance, Borders, Image, and Inheritance. Appearance and Borders are shared among many elements and contain the attributes that define the graphical appearance of the elements, such as the width of its borders, the background color, and so on. The Image category is a special one because it is present only for the elements of the type "Image."

In the Properties tab, every element has a unique category. These categories are used as element types. In this tab, there are properties that define each element's behavior, and for this reason, they are specific for every type.

Many times the value of an attribute is undefined, and it has a common default value. This means that the element does not have a specific behavior defined, but gets a behavior from somewhere else. For example, the default value of the attribute "background-color" is undefined in most cases, but when a non-transparent element is added to the designer, we can see that it has a white background. The value of the background color attribute is inherited from a lower level.

There are many levels from where the value can be inherited, the first are the styles.

The Styles

Styles are not a visual element, but a collection of attributes that can be inherited from other elements. The styles can be created and selected from the Outline tab and edited using the Properties tab after the selection.

In Figure 2 there are five styles defined, with the "Subtitle" style selected, and its properties displayed in the Properties tab. In Figure 1, we can see that in the Appearance tab, there is the attribute "Style". here a user can choose one of the defined styles that will be associated with that element. This means that every undefined attribute of the element will inherit its value from the analogous attribute of the style. But, because the style is an element,  it can have some undefined attributes as well as a "Style" attribute that can be used to inherit values from another style.

This defines a hierarchy where an element can inherit attribute values from a style, which in turn can inherit attribute values from another style, and so on until a style that doesn't define a "Style attribute is reached. In addition to this, there is the possibility to set a style as default, using the attribute "Default Style" in the Property tab of the style, in the "Style" category. Only one default style can be defined and must be created by the user if one is to be used. When there is a default style defined, even those that don't use explicitly inherit a style can inherit the attribute's value from the default style. With a such complex hierarchy, there is the possibility that an attribute value could be defined in more styles with different values, and could be confusing to think about which element will use.

Because of this, it is important to follow a simple rule: If an element has an undefined attribute, its value will be taken from the nearest style in the hierarchy with that attribute defined. If it's defined also from a lower style in the hierarchy we will say that the lower value is overridden by a higher one.

Another case is that an attribute is undefined in the whole hierarchy and in this case the value will be inherited from a series of default values defined at the application level. These default attributes are at the lower level of the hierarchy, and they are in the hierarchy of every element. The definition of nearest is strictly dependent on how the hierarchy is seen. At the top level there is the element itself, under it there is the style associated (if there is one), and one after another the styles in the hierarchy. After them there is the default style if it's defined and at last the default values.

Let's see an example, with these elements:

• Styled Text with no forecolor and no transparent value defined that inherit directly from the Style 1
• Style 1 defines the forecolor with the value green and that inherit from Style 2
• Style 2 defines the forecolor with the value red 
• Style 3, marked as the default style, set the transparent value to false
• The default values that define the forecolor to black and set the transparent value to true.

Since the hierarchy is 

http://wiki.jaspersoft.com/download/resources/com.gliffy.integration.confluence:gliffy-macro-key/icons/gliffy-logo-20px.png

In this case, the Styled Text will have the forecolor with the value green because the nearest style with a forecolor with a value is style 1, and it has the value green. So the forecolor in style 2 and in the default values are overridden. The transparent value is inherited instead from style 3 for the same reason, and the value from the default values is overridden.

Conclusion

The inheritance mechanics is very powerful but could be difficult to know from where an attribute is taken when the hierarchy is complex. For this reason, there is a tool that can be used for this purpose, called the inheritance tab, explained in the inheritance tab tutorial.