Question

Color as Attribute

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

Like 0

Like

5 comments

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

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

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

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

Ryan Farley,

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

 

Show all comments