Question

Color as Attribute

18:38 Jan 09, 2019

How can I set a color value as an attribute?

I have tried something similar to the below but it didnt work out:

attributes:{
  "labelCaption": {
		    "dataValueType": Terrasoft.DataValueType.TEXT,
		    "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
		    "value": "Test"
		   },
 
   "labelColor": {
		    "dataValueType": Terrasoft.DataValueType.COLOR,
		    "type": Terrasoft.ColorEncoding.HEX,
		    "value":"#009900"
		   }
}

Although labelCaption is working fine but labelColor is not

5 comments

Alex_Tim

19:55 Jan 09, 2019

Hello Mohammad,

The code that you provided is working and attribute "labelColor" is storing "#009900". If this behavior is not something that you expected, please specify more accurately what are you trying to achieve.

In case you want to create some custom styles for html elements we recommend to use CSS styles instead: https://academy.bpmonline.com/documents/technic-sdk/7-13/advanced-setti…

Best regards,

Alex

Ryan Farley

20:03 Jan 09, 2019

You can do this by adding a CSS module, then add this module to your page, and then specify the CSS class using the wrapClass element.

See the following for creating a CSS module:

https://community.bpmonline.com/articles/how-add-or-edit-css-style

https://community.bpmonline.com/questions/how-add-custom-style-control-…

Once you created your CSS, simply add the CSS class to the element using wrapClass. For example:

{
	"operation": "insert",
	"name": "PaymentAmount",
	"values": {
		"layout": {
		"colSpan": 12,
		"rowSpan": 1,
		"column": 0,
		"row": 1,
		"layoutName": "Tab01"
	},
	"bindTo": "PaymentAmount",
	"wrapClass": [
		"payment-amount-highlight"
	]},
	"parentName": "Tab00",
	"propertyName": "items",
	"index": 2
}

Ryan

Mohammad Yahfoufi

09:25 Jan 10, 2019

Im trying to set the color and the text to certain values based on some conditions at runtime.. Here is the rest of the code

//In Diff
{
"operation": "insert",
"name": "HeaderLabel2",
"values": {
"itemType": 6,
	"classes": {
		"labelClass": [
			"results-caption"
		]
	},
	"layout": {
		"colSpan": 10,
		"rowSpan": 1,
		"column": 0,
		"row": 0,
		"layoutName": "Header"
		},
	"caption": {
		"bindTo": "labelcaption"
	},
	"styles": {
		"labelStyle": {
			"color":{
				"bindTo": "labelColor"
			} 
		}
	}
},
"parentName": "Header",
"propertyName": "items",
"index": 0
},
 
//In onEntityInitialized method
 
if(//some condition)
  this.set("labelColor","#ff0000");
  this.set("labelcaption", "Message Testing"));

However, as I said before, labelcaption is working fine but lableColor isnt

Ryan Farley

16:38 Jan 10, 2019

Mohammad Yahfoufi,

The response on this post shows you how to change the label color based on conditions:

https://community.bpmonline.com/questions/how-add-custom-style-control-…

Ryan

Mohammad Yahfoufi

17:32 Jan 10, 2019

Ryan Farley,

Thanks! This will work.. But why doing it as an attributes wont work?

Show all comments