Hi I'm trying to figure out and I made some experiments but no success, I can only visualize text on msg.payload without changes.
I have NR v4.0.5 and usng Dashboard v1
Which properties I can add to msg to change size and colour? Possible also the change background color?
Thank you
My guess is you are talking about something on the dashboard. Problem is you haven’t mentioned if you are using dashboard 1 or dashboard 2.
Knowing the dashboard you use will be the first step in getting help.
It would also be helpful if you could let us know what version of NR you are running and provide a short flow showing the issue.
1 Like
You're perfectly right, I apologize, I've added infos on the first post.
Just simple flow, inject, function, label. By now I'm driving label using a simple
msg={payload: "Text to display"} ;
return msg;
Thans for your kind reply!
Since you have a simple flow, please export the flow and paste it to a reply.
I don't want to mess the layout of dashboard adding a label/test, so I won't deply the new example flow
[
{
"id": "957f322b0f50ece9",
"type": "tab",
"label": "Flow 2",
"disabled": false,
"info": "",
"env": []
},
{
"id": "70dfe6fecb1503a9",
"type": "ui_text",
"z": "957f322b0f50ece9",
"group": "",
"order": 0,
"width": 0,
"height": 0,
"name": "",
"label": "",
"format": "{{msg.payload}}",
"layout": "row-spread",
"className": "",
"style": false,
"font": "",
"fontSize": 16,
"color": "#000000",
"x": 550,
"y": 380,
"wires": []
},
{
"id": "da6026b8b23a7e53",
"type": "inject",
"z": "957f322b0f50ece9",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "",
"payloadType": "date",
"x": 160,
"y": 380,
"wires": [
[
"e8cb035376e6b6b1"
]
]
},
{
"id": "e8cb035376e6b6b1",
"type": "function",
"z": "957f322b0f50ece9",
"name": "function 1",
"func": "msg={payload: \"Text to display\"} ;\nreturn msg;",
"outputs": 1,
"timeout": 0,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 360,
"y": 380,
"wires": [
[
"70dfe6fecb1503a9"
]
]
}
]
may please somebody helps with this? Thank you!
Sorry I’ve taken so long to reply but I had to deal with grandkids this morning and mowing my daughter’s lawn and our own lawn.
You could take a look at using the template node.
Note dashboard 1 is no longer supported so you might want to install dashboard 2:
@flowfuse/node-red-dashboard
Thank you for reply, by the time I've focursed on changing colors of background and text, using maiuscles or not..
to do this it's necessary to specify an incoming message on the desidered option field, for example on background I specified {{msg.background}} then I inject msg.background as string "black"
I’m not sure what you are saying, what does: using maiuscles or not.. mean?
See Getting Started | Node-RED Dashboard 2.0 for docs and links to video tutorials for Dashboard 2.0 (@flowfuse/node-red-dashboard)
I recommend watching this playlist: Node-RED Essentials. The videos are done by the developers of node-red. They're nice & short and to the point. You will understand a whole lot more in about 1 hour. A small investment for a lot of gain.
Sorry for my english, it means CAPITAL LETTERS 
I'm sure v2 has lot of improvements then v1, ansyway I'm not planning to rebuild all dashboard for increasing only the font..
so it's enogh for me to kno that in v1 is not possibile to change the font by an input message, so I can only play with colors and capital letters to improve visibility. Is that right?
In the end I've created a function with delay node, that changes colors every second, so I've made the button blinking
Did you try html?( Add to the text
`font size=3 with < and > around it)
(Or font colour=red)
1 Like
thanks for help, can you write exactly how should be the message object the change font size?
You mean somehow send the text (which is contained to msg.payload) with html code?
something like this?
msg={payload:" <font size="8">TextOfButton</font>"};
EDIT: yes it works, thank you! There is only one disadvantage, the text shows all in capital letters, that's strange
Add a debug node showing what you are sending to the text node and show us what it says.
1 Like
Not sure if this will work in your situation - try it and see.
I use a ui-template node (not connected to anything) with this inside it so text in all my buttons appears in normal case.
Note: It needs to be linked to the appropriate Group of widgets on Dashboard 1.
<style>
button{
text-transform: none !important;
}
</style>
1 Like
Thank you mates, as I wrote up (maybe you just read the first post) I've already found a solution
it is sending msg={payload:" <font size="5">TextOfButton</font>"}; where 3 is the origina Dashboard size, 4 and 5 are the maximum available size, above using 6,7,8 result on cropped text into button
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
