Color
Development

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
style
styles
Color
colors
7.12
studio

What is the difference between the elements diff

"classes": {

                "wrapperClass": [".."],

                "wrapClassName": [..]

            },

"wrapClassName": [..],

"wrapClass": [..],

You can find out the entire list of styles used for elements?

In particular, it is very necessary set the background color for the lookup!

Like 0

Like

2 comments

Hello Grigoriy,

You can find the descriptions of there properties in the documentation - https://academy.terrasoft.ru/api/jscoreapi/7.12.0/

The 'wrapClassName' is defined in the Terrasoft.enums.ReorderableContainer. 

The 'wrapClass' is defined in the Terrasoft.controls.ControlGroup. It specifies the name of the CSS class for the wrapper element of the control.



If you need to set the background color for the lookup element, you need to:

1. Create a module 

2. Find selector for the element you would like to apply the style

3. Write you custom CSS styles in the LESS tab. Leave the source code for the module empty

4. Create a replacing schema module and include your module with styles step as a dependency

 

If you need to change the style for the element, based on some condition, I believe this article will be helpful for you - https://community.bpmonline.com/questions/how-add-custom-style-control-…

Tetiana Markova, 

Thank you, Tetiana

Show all comments
Color

Hi guys,

I'm wondering how can I change color of the bpm'online system?

File attachments

Like

1 comments

Hi Lucy,

Thank you for the question. This functionality is available starting from 7.5 version. You can change the color of the side panel and text in bpm’online. 

To start the customization, open the system designer by clicking the  button at the top right corner of the application. Then click the [Color customization] link in the [Interface setup] block.

Please, note that you can customize the color only if you have the right to perform the "Access to color customization" system operation (CanManageSectionPanelColorSettings).

[Section panel background] - Main background color of the section panel. The value is saved in the "Section panel background" system setting (SectionPanelBackgroundColor).

[Text in section pane] - Main color of all section headings in the section panel. The value is saved in the "Text in section panel" system setting (SectionPanelFontColor).

[Selected section background] - Background color of the selected section in the section panel. The value

is saved in the "Selected section background" system setting (SectionPanelSelectedBackgroundColor).

[Text in selected section] - Heading color of the selected section in the section panel. The value is

saved in the "Text in selected section" system setting (SectionPanelSelectedFontColor). Thank you.

 

Show all comments

Is there a way to have records of different colors in the list depending on the value of 1 field?

Like 2

Like

3 comments

Hi Baha, 

Here is an example of such functionality for Accounts Section depending on the Accounts Status:

1. Subscribe on PageLoad event:

2. Example of Method that will be highlighting the records:

The backgroundColor can be can receive values from the special lookup created, with the description field filled in the same as color caption.

Good luck!

 

Hi Olly Khome, unfortunatelly I can´t see the pictures as described in your previous post. When I click on the links, I receive the error message "The requested URL was not found on this server."



If possible, could you please post the pictures again? 

Thanks in advance.

Dear Eric,

The screenshots are no longer relevant as they are taken from the outdated system version. Feel free to check the following instructions from our Academy - https://academy.bpmonline.com/documents/technic-sdk/7-11/how-highlight-record-list-color to implement the functionality.

Also, I'd like to let you know that we have already passed the request to add the option to highlight the records in the list based on the condition to the user settings and the functionality should appear in one of the further system releases (no |ETA yet).

Lisa

 

Show all comments