Put color in your life (and in your IoT devices) with the Color Picker Widget
Are you planning to throw an epic party, IoT style? Then control your RGB lights with the Color Picker Widget! If you are not a party animal and you just want to visualize the output of your color sensor, then display the RGB data to the Color Picker Widget!
HOLD YOUR HORSES! To get started with your first awesome project with this widget, start off by reading the Introduction. You’ll understand what Meeo is all about. If you already read it, then let us proceed 🤘.
If you have chosen to add this awesome widget from the Widget Menu, you can give a specific name to your widget by typing on the “Name” field. You do not need to type anything on the “Channel” field for now because anything you type on the “Name” field is reflected on the “Channel” field (everything is in small caps and each word is separated with a dash sign “-”). If you really want to have a specific channel for your widget, then you can type the channel name you want. In case you are wondering what is the difference between the “Name” and “Channel” field, the first field lets you give a cool name to your widget. The second field is used as a channel for your devices to subscribe to or to publish data on. If you are happy with the name of your widget, you can now click/press the “Save” button.
Color Widget Information
In order for your device to connect to your widget, you need to know the widget’s information. To access this, each widget has an “Option” icon on the top right corner. Click/press the icon and you will see the Widget Information Box as shown on the image below:
The Widget Information Box holds the most important information of a widget; the topic. If you would notice, the topic is separated by a “/”. The phrase on the left is called the namespace while the phrase on the right is called the channel (remember the “Channel” field?). You should take note of these because it is needed by the Meeo Arduino Library.
Color Widget Data
The Color Widget controls is based on HSL (Hue, Saturation and Lightness). The widget features two controls to change the HSL value. The first control (the slider) changes the Hue. The second control (the white dot) changes the Saturation and Lightness. The Color Widget converts the HSL value to RGB. The RGB value is described as rgb(red value, green value, blue value).
When you subscribe to the “Channel” of the Color Widget, the expected data that you will receive when you change the color is always like this: <red value>,<green value>,<blue value>. As an example, let’s say that on the Color Widget the rgb value is: rgb(0, 255, 18). The data that you will receive is: 0,255,18.
You can also publish or send data to the Color Widget! Make sure that you send the correct format: “red value, green value, blue value”. As an example, a red color should be: 255,0,0. This will change the color on the Color Widget.
Time to party!
Now that you know the intricacies of the Color Picker Widget, you can now change the colors of your lights! It’s time to throw that awesome psychedelic party you have always wanted! 😂 Work hard, play hard! 😎🤘
