Dashboard - Toggle button

Moderators: adafruit_support_bill, adafruit

Forum rules
If you're posting code, please make sure your code does not include your Adafruit IO Active Key or WiFi network credentials.
Locked
User avatar
veereshsy
 
Posts: 5
Joined: Tue Jul 10, 2018 9:53 am

Dashboard - Toggle button

Post by veereshsy »

Hi There

I am building a precision irrigation system. Already using Toggle button to Power ON/OFF motor on Dashboard as it suits well for motor operation. Now I need same feature to turn ON/OFF solenoid valves , heater coils, fertilizer injector etc. Is there any way we can use our own icons? I also tired the already available adafruit icons they don't serve the purpose as we can change only icons and not the color and there are no toggle like icons.

It would be great if we can get another widget where we can choose the appropriate icons one for ON and OFF or any toggle option.

Thanks
Veeresh

User avatar
brubell
Learn User Page
 
Posts: 2010
Joined: Fri Jul 17, 2015 10:33 pm

Re: Dashboard - Toggle button

Post by brubell »

Hiya veereshsy,
I also tired the already available adafruit icons they don't serve the purpose as we can change only icons and not the color and there are no toggle like icons.
You can change the color of the icon block. Before clicking create, you can edit the properties of the icon block.

Image
There are currently no custom icons within the icon block. You could use the Image block, and set the feed to the image you'd like to display.

User avatar
veereshsy
 
Posts: 5
Joined: Tue Jul 10, 2018 9:53 am

Re: Dashboard - Toggle button

Post by veereshsy »

Hi Brubell
Thank you for the response.
Yes, We can select the color for the icon but not as a feed value.
I need an option of toggling between these icons as I click on it or by other means by changing the feed value..
For example
valveoptions.png
valveoptions.png (6.38 KiB) Viewed 162 times
Any tricks/workarounds to achieve this please let me know.

Regards
Veeresh

User avatar
abachman
 
Posts: 352
Joined: Mon Feb 01, 2010 12:48 pm

Re: Dashboard - Toggle button

Post by abachman »

veereshsy,


You might find the image block useful in this situation. That block type on the dashboard takes in Base64 formatted images and displays them. The only requirement is that if the image data is over 1024 bytes, you have to turn off feed history, which can be done from the feed home page.

Recently we added drag-and-drop image publishing to that block, which should both make it easier to get images into Adafruit IO
and also make it easier to get the Base64 formatted string that Adafruit IO expects. An alternative, if you're on a linux or mac system is to just pipe the image file through the base64 command line utility. On my machine that looks like this:

Code: Select all

$ cat valve-on.png | base64
iVBORw0KGgoAAAANSUhEUgAAAMUAAADFCAMA...
The dashboard block and the base64 command line utility produce exactly the same output, so either should be suitable.

Once you have the base64 data for the image you'd like to publish, you can incorporate it into your script or application and publish it directly to any IO feed.

Just quickly cropping out the the two valve images you posted and running them through pngcrush gives me files under 2KB. I created a couple of feeds, turned off history, put them on the dashboard in an image block (for uploading) and a stream block (for getting the Base64 string output) and made it public here, https://io.adafruit.com/abachman/dashbo ... ge-uploads, if you'd like to take a look.

This is a 100% flexible solution to showing arbitrary icons on IO, but requires getting the base64 data and incorporating it into your project.


- adam b.

Locked
Forum rules
If you're posting code, please make sure your code does not include your Adafruit IO Active Key or WiFi network credentials.

Return to “Internet of Things: Adafruit IO and Wippersnapper”