Trend Icon
Last updated
Last updated
Squirrel 1.12 introduced a “Quick Set-up” tab on many property panels. The properties described on this page are available on the “All Properties” tab of the property panel. For more details on “Quick Set-Up” properties see this article
The Trend Icon is a visualization component that can be used to immediately display an upward, downward, or steady trend based on a value above or below 0.
Select Trend Icon from the Data Visualization category of the component library. Move the mouse over the canvas and click to add a trend icon to your project:
The Trend Icon properties consist of GENERAL, STYLING, and DYNAMIC VISIBILITY drawers. This guide will not describe the dynamic visibility properties as these are generic to each visible component; a separate guide and tutorial on dynamic visibility can be found here.
Trend value - an input property that is bound to the spreadsheet. This is the value that determines the trend icon displayed, ranging from Negative (below zero), Zero and Positive (above 0)
Icon set - a dropdown to select the icon set that is displayed on the component.
These properties apply to the styling options for the Trend Icon
Positive
Positive Icon Color - an input property to set the Positive Icon color
Opacity - an input to adjust the opacity of the Positive Icon color
Positive Background - an input property to set the Positive Icon background color
Opacity - an input to adjust the opacity of the Positive Icon opacity color
Zero
Zero Icon Color - an input property to set the Zero Icon color
Opacity - an input to adjust the opacity of the Zero Icon color
Zero Background - an input property to set the Zero Icon background color
Opacity - an input to adjust the opacity of the Zero Icon opacity color
Negative
Negative Icon Color - an input property to set the Negative Icon color
Opacity - an input to adjust the opacity of the Negative Icon color
Negative Background - an input property to set the Negative Icon background color
Opacity - an input to adjust the opacity of the Negative Icon opacity color
If the 'face' or 'check/exclamation/cross' options are selected, then Corner properties are added to each of the styling sub-drawers.
Corners – This property determines the corner radius of the Rectangle component border. Use the slider to amend this property, or type a numerical value into the property field.
Individual Corners - selected this property to apply different radii to each of the component's corners. Each of these individual inputs can be manually edited or bound to the spreadsheet.
