BLYNK
HOME       📲 GETTING STARTED       📗 DOCS       ❓HELP CENTER       👉 SKETCH BUILDER

Device Tiles - documentation

#1

I’m trying to create a nice, one page Blynk project for my whole house automation.
I currently have tabs for heating, lighting, security, etc…

I’m assuming most people make use of the Device Tile widget?
I’ve heard rumblings of a Blynk ‘dashboard’ maybe being released this month too…

At the moment I don’t find using the widget overly intuitive. https://docs.blynk.cc/#widgets-interface-device-tiles

This is what I am doing:

Click “add template” and select the top one (there’s only three).
Name it as “Lounge”
Select devices - only one to choose from which is my project name “Node Red test”
Select pin V10 (currently reading temperature from a BME280)
Seemingly nothing else to fill in, all three boxes at the top are identical. Can’t see where to configure more.
Click back arrow
Click back and play button
Tile shows “Node red test” as heading, temp, and 23.1 underneath (correct temp coming from pin V10).
If I stop the sketch and press on the tile, it takes me to a blank project page.
If I go to settings and add new template, this time the “Node Red test” cannot be selected from “select devices”.

All in all rather confusing for me :confused:

0 Likes

#2

I didn’t ‘get’ device tiles when I first tried them and thought they were fairly pointless.
Then a few tweaks were made to them and I decided to try again, and this time I really liked them. I don’t think it was because of the changes made, more that I hadn’t used them correctly before.

They only really make sense if you have multiple devices in the same project. The other thing you may not have realised is that a long press will take you to a second screen.

I have multiple lights in my living room, all of which are controlled via BigTimers, but I have controls in Blynk that allow manual override, colour controls for some of the lights as they are LED strips, and also have online status indicators.
A traditional layout would probably be to put each light on a separate tab, with the relevant controls and indicators. That would mean going from tab to tab to turn each light on and off.

The Tiles approach would be to have one Device per tile with an on/off switch on the front of the tile, then the relevant ‘advanced’ controls for that device on the second screen which is accessed with a long press.

This gives you the on/off switches for all the lights on separate tiles that are all grouped together. The long-press advanced controls for each device (which can be different for each device if you wish) allows you to access the stuff that you don’t need most of the time.

Does this help?

Pete.

1 Like

#3

Thank you Pete, that does make much more sense now (apologies for delay replying - life!)

I suppose the clue was in the name “Device” tile! If I understand correctly, each tile can only represent one physical device, and a shortcut for one action of that device can be linked to the tile. A long press opens up a new page for that device which can contain any number of widgets.

Maybe it’s time for the documentation to be updated, that simple explanation made things so much easier to understand.

What is confusing is why do three icons appear at the top of the page? (lightbulbs in my screenshot below). They are not selectable.

If you have multiple readings from one device (e.g. temp/humidity/pressure from a BME280), I guess the device tile is not the widget to select for showing them all on the front screen.

0 Likes

#4

I don’t understand that either, but once configured to work with a switch mine only then show two icons:

No, you can add multiple devices to a tile, but each device can only be added to one tile.

Yes, it seems that there can only be one widget linked to the front tile. If you wanted to display info like Temperature and Humidity on a single tile then you might have to get creative with concatenating the values into a single string and displaying them in a value widget. The detail screen that’s accessed with a long press could have separate displays for the Temp and Humidity and a Superchart history display.

Here’s a screenshot of my living room lights control using device tiles:


In the screenshot only one of the lights is on green), but tapping the tile will toggle the on/off status of each light.
A long press takes you to the enhanced controls/info for the light, which can be different for each device. In this case the light is an LED strip, so has different controls to one that is a simple on/off device:

Pete.

1 Like

#5

I realised it’s to do with the number of columns selected on the slider in the initial setup page.

Overall it’s not the most intuitive widget, but I will persist - thanks Pete :slight_smile:

PS can I ask about your LED setup, looks like you are using a Wemos D1 mini. Something like this? :https://www.instructables.com/id/WiFi-Controlled-LED-Strip-With-BLYNK/

0 Likes

#6

That makes sense!

I’m currently using a Wemos D1 Mini with a Circuit that’s basically the same as this:

I made some custom circuit boards that look like this:

However, I’m now probably going to use this type of device in future:

They are cheap and you can keep the Magichome firmware and use one of the MagichomeUFO nodes in Node-Red to control it.

You can also hack these devices to run your own MQTT firmware if you wish, as I described here:

Pete.

1 Like

#7

Ooh a new toy! I’ll be ordering one of those, thanks Pete! I might post on your original thread if there’s any questions to keep it tidy…

Really appreciate you sharing your projects freely! I’ll try not to make my house a clone of yours, maybe a few different cushions or something :laughing:

0 Likes

#8

Just make sure you order the correct type of controller - RGB, RGBW, RGBWW.

Mine are very basic RGB strips, so RGB Wi-Fi is what I use (there are Bluetooth versions too, but they are no good for what you want).

You might need your other half to develop an elephant obsession…


at the last count we had over 100 in the living room!

:elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant::elephant:

Pete.

2 Likes

#9

:see_no_evil::see_no_evil::see_no_evil::see_no_evil::see_no_evil::see_no_evil:
:see_no_evil::see_no_evil::see_no_evil::see_no_evil::see_no_evil::see_no_evil:

1 Like

#10

Can I ask which nodes you are using Pete?

I’ve tried https://flows.nodered.org/node/node-red-contrib-magichome-controller but I’m getting unpredictable results.

Here is the flow:

[{"id":"e6f30b9d.e6f0e8","type":"MagicHome","z":"8bb23b43.f1a468","name":"TV RGB lights","server":"69d1b800.953898","x":480,"y":180,"wires":[["6ca018ea.da0e38"]]},{"id":"37acee0a.bbe3a2","type":"inject","z":"8bb23b43.f1a468","name":"ON","topic":"","payload":"true","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":90,"y":300,"wires":[["5227b36e.42645c"]]},{"id":"f52adcd7.f34c5","type":"inject","z":"8bb23b43.f1a468","name":"OFF","topic":"","payload":"false","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":90,"y":360,"wires":[["5227b36e.42645c"]]},{"id":"6ca018ea.da0e38","type":"debug","z":"8bb23b43.f1a468","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":710,"y":180,"wires":[]},{"id":"3ab14e07.e86872","type":"debug","z":"8bb23b43.f1a468","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":590,"y":360,"wires":[]},{"id":"5227b36e.42645c","type":"change","z":"8bb23b43.f1a468","name":"","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.power","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":290,"y":300,"wires":[["3ab14e07.e86872","e6f30b9d.e6f0e8"]]},{"id":"1472ba25.10e7e6","type":"inject","z":"8bb23b43.f1a468","name":"","topic":"","payload":"{ \"red\":255, \"green\":0, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":130,"y":140,"wires":[["1ba3f3c5.72d34c"]]},{"id":"1ba3f3c5.72d34c","type":"change","z":"8bb23b43.f1a468","name":"","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.color","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":330,"y":120,"wires":[["e6f30b9d.e6f0e8"]]},{"id":"95ebfa92.6d91f8","type":"inject","z":"8bb23b43.f1a468","name":"","topic":"","payload":"{ \"red\":0, \"green\":255, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":110,"y":80,"wires":[["1ba3f3c5.72d34c"]]},{"id":"69d1b800.953898","type":"MagicHome-config","z":"","name":"RGB","host":"192.168.1.214","interval":10}]

And here is what I purchased : LINK

Thank you :smile:

0 Likes

#11

I’m using this node:

You need to install the app on a phone to configure the LED controller then you can connect to it from Node-Red.

Pete.

2 Likes

#12

Thank you! :blush:

0 Likes

#13

Many hours later I think I have it working :smile: My lack of understanding of javascript is letting me down I think, converting values mainly. Still converting payloads/objects is confusing.

Here is what works for me, just on/off for now. Changing colours works only the first time, then I have to redeploy as it stops working…

[{"id":"37acee0a.bbe3a2","type":"inject","z":"8bb23b43.f1a468","name":"ON","topic":"","payload":"true","payloadType":"bool","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":250,"y":240,"wires":[["5227b36e.42645c"]]},{"id":"f52adcd7.f34c5","type":"inject","z":"8bb23b43.f1a468","name":"OFF","topic":"","payload":"false","payloadType":"bool","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":250,"y":300,"wires":[["5227b36e.42645c"]]},{"id":"3ab14e07.e86872","type":"debug","z":"8bb23b43.f1a468","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":1030,"y":280,"wires":[]},{"id":"5227b36e.42645c","type":"change","z":"8bb23b43.f1a468","name":"Power","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.power","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":550,"y":281,"wires":[["870e3ede.1062"]]},{"id":"870e3ede.1062","type":"MagicHome","z":"8bb23b43.f1a468","name":"","server":"69d1b800.953898","x":830,"y":280,"wires":[["3ab14e07.e86872"]]},{"id":"99ff57a2.c2e868","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":255, \"blue\":255 }","topic":"","payload":"{ \"red\":255, \"green\":255, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":280,"y":420,"wires":[["8af9dad9.d84d58"]]},{"id":"8af9dad9.d84d58","type":"change","z":"8bb23b43.f1a468","name":"Colour","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.color","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":610,"y":380,"wires":[["870e3ede.1062","be8c2425.526538"]]},{"id":"22d41c78.7b24c4","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":255, \"blue\":0 }","topic":"","payload":"{ \"red\":255, \"green\":255, \"blue\":0 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":280,"y":500,"wires":[["8af9dad9.d84d58"]]},{"id":"631ba16e.16c86","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":0, \"blue\":255 }","topic":"","payload":"{ \"red\":255, \"green\":0, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":280,"y":460,"wires":[["8af9dad9.d84d58"]]},{"id":"be8c2425.526538","type":"debug","z":"8bb23b43.f1a468","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":1030,"y":380,"wires":[]},{"id":"850cdafb.3932a8","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":0, \"blue\":0 }","topic":"","payload":"{ \"red\":255, \"green\":0, \"blue\":0 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":270,"y":540,"wires":[["8af9dad9.d84d58"]]},{"id":"cc84f1c.cde7b1","type":"blynk-ws-in-write","z":"8bb23b43.f1a468","name":"Write Pin V3","pin":"3","pin_all":0,"client":"2400f3e3.50c3fc","x":150,"y":100,"wires":[["f922489.c6c9ab8"]]},{"id":"f922489.c6c9ab8","type":"change","z":"8bb23b43.f1a468","name":"","rules":[{"t":"change","p":"payload","pt":"msg","from":"1","fromt":"str","to":"true","tot":"bool"},{"t":"change","p":"payload","pt":"msg","from":"0","fromt":"str","to":"false","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":380,"y":160,"wires":[["5227b36e.42645c"]]},{"id":"69d1b800.953898","type":"MagicHome-config","z":"","name":"RGB","host":"192.168.1.214","interval":10},{"id":"2400f3e3.50c3fc","type":"blynk-ws-client","z":"","name":"Blynk (Node Red Test)","path":"wss://blynk-cloud.com/websockets","key":"544bdd5b51684576b02d8a19780d778d","dbg_all":false,"dbg_read":false,"dbg_write":false,"dbg_notify":false,"dbg_mail":false,"dbg_prop":false,"dbg_sync":false,"dbg_bridge":false,"dbg_low":false,"dbg_pins":"","multi_cmd":false,"proxy_type":"no","proxy_url":"","enabled":true}]

Note this does not ‘dress’ the button on Blynk if injected, I tried for a while to convert the JSON object output from the Magichome node into a 0/1 value but failed, for now… :blush:

0 Likes

#14

I’m in Spain at the moment and I only have one Pi set up, which is my production system.
I have a rule that I never import flows into this system - just in case - so I’d need to clone my SD card and import it into that, which I won’t get chance to do for two or three days.

Pete.

1 Like

#15

Shame you’re in Spain, you’re missing out on all the rain we’re having! :smile:

Please don’t go to too much trouble, I am muddling my way through. I managed to write a function to convert part of the msg object into a 1/0, and the flow is working apart from the colour changing mucking things up.

I will attach the flow below but no worries if you don’t get around to looking!

Next I am going to look at the zeRGBa widget and see how that works!
Cheers

[{"id":"37acee0a.bbe3a2","type":"inject","z":"8bb23b43.f1a468","name":"boolean true","topic":"","payload":"true","payloadType":"bool","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":240,"wires":[["5227b36e.42645c"]]},{"id":"f52adcd7.f34c5","type":"inject","z":"8bb23b43.f1a468","name":"boolean false","topic":"","payload":"false","payloadType":"bool","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":280,"wires":[["5227b36e.42645c"]]},{"id":"3ab14e07.e86872","type":"debug","z":"8bb23b43.f1a468","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":990,"y":260,"wires":[]},{"id":"5227b36e.42645c","type":"change","z":"8bb23b43.f1a468","name":"Power","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.power","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":570,"y":260,"wires":[["870e3ede.1062"]]},{"id":"870e3ede.1062","type":"MagicHome","z":"8bb23b43.f1a468","name":"","server":"69d1b800.953898","x":790,"y":260,"wires":[["3ab14e07.e86872","265e4617.a11caa"]]},{"id":"99ff57a2.c2e868","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":255, \"blue\":255 }","topic":"","payload":"{ \"red\":255, \"green\":255, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":240,"y":400,"wires":[["8af9dad9.d84d58"]]},{"id":"8af9dad9.d84d58","type":"change","z":"8bb23b43.f1a468","name":"Colour","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.color","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":570,"y":360,"wires":[["870e3ede.1062","be8c2425.526538"]]},{"id":"22d41c78.7b24c4","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":255, \"blue\":0 }","topic":"","payload":"{ \"red\":255, \"green\":255, \"blue\":0 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":240,"y":480,"wires":[["8af9dad9.d84d58"]]},{"id":"631ba16e.16c86","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":0, \"blue\":255 }","topic":"","payload":"{ \"red\":255, \"green\":0, \"blue\":255 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":240,"y":440,"wires":[["8af9dad9.d84d58"]]},{"id":"be8c2425.526538","type":"debug","z":"8bb23b43.f1a468","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":1010,"y":360,"wires":[]},{"id":"850cdafb.3932a8","type":"inject","z":"8bb23b43.f1a468","name":"{ \"red\":255, \"green\":0, \"blue\":0 }","topic":"","payload":"{ \"red\":255, \"green\":0, \"blue\":0 }","payloadType":"json","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":520,"wires":[["8af9dad9.d84d58"]]},{"id":"cc84f1c.cde7b1","type":"blynk-ws-in-write","z":"8bb23b43.f1a468","name":"Write Pin V3","pin":"3","pin_all":0,"client":"2400f3e3.50c3fc","x":110,"y":120,"wires":[["f922489.c6c9ab8"]]},{"id":"f922489.c6c9ab8","type":"change","z":"8bb23b43.f1a468","name":"","rules":[{"t":"change","p":"payload","pt":"msg","from":"1","fromt":"str","to":"true","tot":"bool"},{"t":"change","p":"payload","pt":"msg","from":"0","fromt":"str","to":"false","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":120,"wires":[["5227b36e.42645c"]]},{"id":"265e4617.a11caa","type":"function","z":"8bb23b43.f1a468","name":"Convert to 1/0","func":"//function to convert power on/off to 1 or 0\nvar power;\nvar topic=msg.payload.power;\n\nif (topic==\"on\")\n{\n    power=1;\n}\n\nelse\n\n{\n    power =0;\n}\n\nmsg.payload=power;\nreturn msg;","outputs":1,"noerr":0,"x":740,"y":120,"wires":[["7945125d.c2c72c","52fe627.109cc9c"]]},{"id":"7945125d.c2c72c","type":"debug","z":"8bb23b43.f1a468","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":980,"y":120,"wires":[]},{"id":"52fe627.109cc9c","type":"blynk-ws-out-write","z":"8bb23b43.f1a468","name":"Write to pin V3","pin":"3","pinmode":0,"client":"2400f3e3.50c3fc","x":1000,"y":60,"wires":[]},{"id":"69d1b800.953898","type":"MagicHome-config","z":"","name":"RGB","host":"192.168.1.215","interval":10},{"id":"2400f3e3.50c3fc","type":"blynk-ws-client","z":"","name":"Blynk (Node Red Test)","path":"wss://blynk-cloud.com/websockets","key":"544bdd5b51684576b02d8a19780d778d","dbg_all":false,"dbg_read":false,"dbg_write":false,"dbg_notify":false,"dbg_mail":false,"dbg_prop":false,"dbg_sync":false,"dbg_bridge":false,"dbg_low":false,"dbg_pins":"","multi_cmd":false,"proxy_type":"no","proxy_url":"","enabled":true}]

The function I wrote to convert msg.payload.power “on” or “off” to 1 or 0:

//function to convert power on/off to 1 or 0
var power;
var topic=msg.payload.power;

if (topic=="on")
{
    power=1;
}

else

{
    power =0;
}

msg.payload=power;
return msg;
0 Likes

#16

There’s an easier way to change ‘on’ to 1 etc, using a Change node.

You might want to take a look at this thread, it’s stuff that was split-off from the Home Automation thread because it made it a bit confusing for people to follow:

Pete.

1 Like