Hi Almida,
don’t know how to set category images but for background you have to design different styles. Names habe to be “style1”, “style2”,…
<!-- Style for errors (severity: 100...199) -->
<Style id="style1" xsi:type="widgets.brease.AlarmListStyle"
textColor="#FFFFFF"
backColor="rgba(255,0,0,0)"
/>
In ContentEditor set something like following for styleConfiguration of your AlarmList:
[[{"styleNbr":1,"alarmState":5,"logicalOperator":"and","severity":[{"useState":true,"value":100,"conditionType":">="},{"useState":true,"value":200,"conditionType":"<"}]},
{"styleNbr":2,"alarmState":5,"logicalOperator":"and","severity":[{"useState":true,"value":200,"conditionType":">="},{"useState":true,"value":300,"conditionType":"<"}]},
{"styleNbr":3,"alarmState":5,"logicalOperator":"and","severity":[{"useState":true,"value":300,"conditionType":">="},{"useState":true,"value":400,"conditionType":"<"}]},
{"styleNbr":4,"alarmState":5,"logicalOperator":"or","severity":[{"useState":true,"value":400,"conditionType":">="},{"useState":true,"value":100,"conditionType":"<"}]}];
If alarm instance has severity 100…199 it will be shown in style1, if severity is 200…299 in style2 and so on.
Hope, that helps ypu
Sincerly Simon