Android control color RGB LED using HC-05 Bluetooth with Arduino(Part II)
You probably have seen my first part of Arduino hardware setup tutorial. If you haven't please visit here: My previous Arduino (Part I tutorial).After few weeks of struggling with MIT App Inventor 2, I finally completed my second generation of Color LED Controller V2.0 App.
Basically, 2nd generation of Android APP shows a color RGB wheel on the display and you might pick any color on the display to wirelessly change the RGB color accordingly. With glide/drag capability built in the App, you may glide your finger through the color wheel to see RGB LED changes color gradually.
For the Arduino part, all the code stays the same. Yes, I haven't modified a single line of code in the Arduino.
Please watch the video below to see how it works! :)
Here are the App coding screenshot for your reference:
************************************************************
0) Sorry blog readers....here are the two missing global variable blocks.... :-)
*************************************************************
1) App Inventor 2 screen initialisation code.
2) Android to HC-05 Bluetooth connection code.
3) The button to turn on/off LED
4) Code for touch on the color wheel to change LED color
5) Code for Glide/Drag finger across the color wheel to see the color change accordingly
In App Inventor, the color code string after [Split Color] will be something like "(255 255 255 255)". What I need in Arduino is only R, G B, so I have to remove last 255.
*** The last 255 is a string in color code and it will be 255 all the time***
For easier string processing, I replace " "(space) with a "." (dot).
Then, I send each color code string to Arduino as "255.255.255)"
In side Arduino, I could split R, G, and B easily with the "."(dot) and use ending ")"(parenthesis) to check if the color code is complete or not.
==*==*==*====*====*====*====*====*====*====*====*====*====*====*==
After you put all these codes into MIT App Inventor 2, you should able to build the code on your PC/Mac to generate an Android .APK to place on your Android phone to test it out with Arduino.
Please do not ask me to post the original code here for you to download. If I do so, no one would download my App from Android Play Store! ;)
If you don't want to create this App yourself, please Download this App here!
Happy coding!!
Stonez
--------------------------------------------------------------------------------------------------------------------
Part II - Android HC-05 藍芽連線控制彩色 RGB LED
基本上第二代的設計是一個可以任君挑選顏色RGB調色盤。你可以點選你想要的顏色或是用手指滑過螢幕上的任一個顏色,應用程式會透過藍芽把顏色代碼送變 Arduino 來改變 RGB LED 燈泡的顏色。
Arduino 程式碼的部分是維持跟之前一樣,一行程式碼都不用更改就能使用了。
MIT App Inventor 的程式代碼如下:
1) App Inventor 2 Screen1 初始化設定:
2) Android 連結到 Arduino + HC-05 藍芽模組程式碼:
3) 這組程式碼是用來開關 RGB LED
4) 這組程式碼是用來回應點選的顏色並改變 LED 顏色
5) 這組程式碼是用來控制滑過螢幕並即時改變其顏色
只要按照以上程式碼輸入MIT App Inventor 2後,你就應該可以做成一個APK檔案。
Sorry, 我不會把原始檔整會貼在這裡,所以請你動手做做看吧!!
如果不想動手做,那請從 Play Store 下載吧!
Stonez
excellent contribution friend uses a lot of information but the images are not loading properly, greetings and hope you can solve the problem thanks
ReplyDeleteHi LUIS,
ReplyDeleteAre all the images showed up properly for you?
Stonez
thank you very much for your help, I would like to know as well as I do to define the colorpicked and previouscolor that are global variables, if I can help I would greatly appreciate it.
ReplyDeleteBenjamin Vallet & Luis Carlos, it looks like there are some codes missing... let me check it out and get back to you!
DeleteSorry for the delay, please set these variables as below:
Deleteinitialize global: ColorPicked to “7”
initialize global PreviousColor to “p”
I've added the missing global variables back to the blog.
DeleteCheck them out!
hello, can you say how do you define global variables color picked and previous color?
ReplyDeletethanks for the answer.
Benjamin Vallet & Luis Carlos, it looks like there are some codes missing... let me check it out and get back to you!
DeleteSorry for the delay, please set these variables as below:
Deleteinitialize global: ColorPicked to “7”
initialize global PreviousColor to “p”
hello cordial greeting, thanks for answering to our questions but I have one more, have realized the whole part of the programming in the appinventor but to the moment to prove the part of the code RGB it me appears 255 that it should not appear also appears between parentheses and not separated by points, not that I am doing bad
ReplyDeleteWell, in App Inventor, the color code string after [Split Color] will be something like "(255 255 255 255)". What I need in Arduino is only R, G B, so I have to remove last 255.
ReplyDelete*** The last 255 is a string in color code and it will be 255 all the time***
For easier string processing, I replace " "(space) with a "." (dot).
Then, I send each color code string to Arduino as "255.255.255)"
In side Arduino coding, I split R, G, and B easily with the "."(dot) and use ending ")"(parenthesis) to check if the color code is complete or not.
I hope this helps!
great thanks for your help, really it served me very much to be able to develop the project. your help was very valuable
DeleteThank u very very much for sharing this project.
ReplyDeleteIve been doing this all by myself... but i had so many problems when programming the arduino. I couldnt find a way to read this list "split color" and i was doing it using the command Serial.parseInt() but it only reads separate the data by commas. Is there any possibility that i could do this program without using the library u used?
And then again! THANKS. Sry for my english.
I am not sure about this, but if Serial.parseInt() only read separate data by commas, then you should just replace "."(dot) with a "," (comma).
DeleteLook at AI2 blocks step (6), about in the middle part, there's command blocks
***My code was***
Replace all text
Segment " " (space)
Replacement "." (dot)
***Your code should be***
Replace all text
Segment " " (space)
Replacement "," (comma)
Then, it should work!
hi. i need you help please.
ReplyDeletei have a proble,. when i want to replace " "(space) with a "." (dot).
Then i get this: example: 255 255 255 i get .2.5.5..2.5.5..2.5.5
example 2: 150 40 10 i get .1.5.0..4.0..1.0
it's like the numbers were separated.
help me please
First, count how long is the string you are spliting. You r example string "255 255 255" does not have any space between "255". I really do not understand why it becomes "2.5.5".
DeleteSave your code and send it to me and let me take a look.
Stonez
Hi Stonez are you still active ?? i am getting this same error can you help me please ??
Deletei found the way.. first i replaced space " " with "." then 2.5.5. .2.5.5. .2.5.5 next i replaced ". ." with "," then 2.5.5,2.5.5,2.5.5 next i replaced again "." with space" "
ReplyDeletethen 255,255,255
;) thanks for you time
Glad that works for your!!
DeleteThis comment has been removed by the author.
Deletehello
ReplyDeletea taste to greet it again had not written again because for questions of work I had to leave the project, but now when I have more time great I have recaptured it.
I have had several problems at the time of obtaining the code rgb to send it to the arduino, have tried to modify the blocks of appinventor and have come across with a big problem. already to the moment to give me the code rgb he does not place me separated by dot or for commas the replaced one gives of the following form 255 255 255 " " with one "." and nevertheless a form does not even give them.
I would like to have your mail to send to you a few images so that he observes her and be able to help me
Hi Luis, leave your email here. I will try to reply your questions.
DeleteStonez
luiscarlosmunoz19@gmail.com
Deleteamigo podemia me ajudar com o aplicativo?
ReplyDeleteI really appreciate your article. I am an industrial designer, and I just started trying to learn app development and arduino programing. Unfortunately, when I tried to recreate your code in App Inventor, I ran into a few problems. You call for a global variable called "ColorPicked" but I don't see where you initialize it. I also am not sure what element "Status" is tied to. I tried creating a notification called "Status", but it does not allow me to set it to text like you can. Is there any way you could export and upload the AIA file? Also, I can't find your arduino code. I looked under both part 1 and part 2. Thanks.
ReplyDeleteP.S. If I hear back from you, and if you don't mind, I'd like to pick your brain on the best way to implement additional functionality (i.e. incorporating a slider and servo control, creating programmed color shows that run on a timer, etc.)
Arduino code is in Tutorial Part I.
DeleteIn App Inventor2:
initialize global: ColorPicked to “7”
initialize global PreviousColor to “p”
I've added the missing global variable back to this post.
DeleteCheck them out.
I saw your last part of the post saying you will not upload your AIA file. I would be happy to email you a copy of my AIA file, if you want to see what I am doing wrong.
ReplyDeleteThanks.
Hi Stonez,
ReplyDeleteWorks great, but i don't know how to make a own app in Appinventor. It would be very helpful if you could point me in a direction where i can find more info about connecting to BTdevices.
Ok looked at the screen shots how to make the connection code and it works fine now...
DeleteKeep up the good work.
Hi Andries,
DeleteGlad that worked for you!
ReplyDeletegreat info i got it half working now will be done soon,
i made a very simple color picker without xy and without bluetooth for beginners to learn
https://www.youtube.com/watch?v=x98nZ2w_2qY&feature=youtu.be
mail me for aia code pleiadianrecords2@gmail.com
give me .aia file of that application er.alpesh.mangukia@gmail.com
ReplyDeleteSorry, you will have to make the .aia file yourself...
Deletewhat is global colour picked and how add..in mit app
ReplyDeleteyou must define them...
Deletelook up in the comment
Hi All,
DeleteI've added the missing global variables back to the blog.
Check them out! :)
Hello
ReplyDeleteThis Project seems amazing!
Can You please send me The .aia file here ?
And where Can i find The circle Image where i click for change The color
emipeponino@hotmail.it
No. You will have to make the .aia file yourself. This is part of learning... As for the circle image, I just found it using Google Search with Keywords "circle hue image"
DeleteWould be nice if you could get this to work using wifi and the ESP8266.
ReplyDeleteI know...I am current studying ESP8266 module. See if I could make it work!
DeleteHi Stonez
ReplyDeletethanks for this code and your hard work.
i have been trying to build the code up myself but cannot seem to get the code split part right i have copied your example exactly but my splits always look like this
.2.5.5..0..1.0.0. .. or .0..2.5.4..1.0.5.. please help..
regards
Dan
Dan, this is really weird...Please ensure you use exactly the code without modification, no extra space and common or dot.
Deletealso a clue is that my code splits look correctl when i have press the disconnect button
ReplyDeleteexample (255 0 155 255) and (11 254 1 255)
RGB = "0.0.0)" ; //Send OFF string to turn light off
DeleteIn the Arduino code, "0.0.0)"; is the instruction to turn light off.
Please make sure you are sending exactly the code from AppInventor.
Hi Stonez,
ReplyDeleteIs it possible to connect the system by using W2812S LED tri color? Will it work the same in the arduino IDE and the Android app as well? My email is kfkh1811@gmail.com, thanks
Hi KJ,
DeleteI think you can, but the whole strip of LED would be the same color only.
W2812S has so many LED and you got to have FASTLED library inside Arduino compiled. Also, on the AppInventor APP, different command has to be created to give WS2812S LED strip different styles of colors and lighting effects.
See the lighting effects below.
http://stonez56.blogspot.tw/2015/06/test-arduino-and-w2812b-led-strip.html
Dear Mr. Stonez,
ReplyDeleteplease where is arduino code for this App.
It's in the Tutorial part I. Grab it here:
Deletehttp://stonez56.blogspot.tw/2014/09/arduino-android-led.html
請問 調色盤是怎麼做的
ReplyDelete調色盤是在Google上找來的
Deleteto call "send BT message" hwat i have to do?
ReplyDeleteNot sure exact what you would like to do, but in this App, just get RGB color respectively and call the Send BT Command block.
DeleteHello, When i turn on the Arduino there is no led on. Thats ok! I click on/off still ok, it turns on and off as it should. When i click the Colorpicker it also picks colors only when i click red i get green and when i click green i get red.
ReplyDeleteAlso when i clicked the color picker the RGB does not turn off. It just gos from white light to the last color it was in.
I believe your issue can be fixed by reading tutorial part 1.
DeleteHere is the quote:
"
Common Anode connect to 5V.
Note: if you bought common anode LED, then this pin must connect to VCC 5V. If you bought common cathode LED, then this pin must connect to GND"
Let me know if your issues is solved or not.
This comment has been removed by the author.
DeleteHello, The app works but i just got one weird thing. It is reversed... So when i press green it becomes purple. When i Press purple it becomes green, When i press red it will be blue, When i press blue it becomes red. when i press yellow it becomes dark blue, when i press dark blue it becomes yellow. So everything is mirrored.
DeleteAny clue why?
When i change RGB = ""; to RGB = " "; it almost works right.
Delete}else{
Light_RGB_LED();
RGB_Previous = RGB;
}
RGB = "";
RGB_Completed = false;
}
}
I use the KY-016 RGB Led module by the way.
DeletePlease, what is the x,y xcurrent, ycurrent initialize global ?
ReplyDeleteCurrentX and CurrentY are automatically received in the Dragged event blocks.
DeleteX and Y are received in the TouchDown event blocks.
Hi Stonez.
ReplyDeleteHope you're doing fine.
I have a problem with my app. Hope you could help me out.
My Arduino code apparently can't find the ")" when I drag down the finger through the color wheel. So the bluetooth is recieveing something like "200,244,60,100,25,236..." with no end. (I used a comma instead the dot) Do u have any idea why this is happening?
Thanks a lot.
Look at the place where AI2 process the string. Longest string should have 4 numbers with and ending ")". The string in your code definitely too long, "200,244,60,100,25,236...".
Deletehi,
ReplyDeleteyou have any app tutorial for IOS devices?
I wish I can come up and iOS version for this, but I don't know how to program this for iOS.
DeleteDear Sir,
ReplyDeletewhat is SendBTCommand ??? How can i add it in my apps,,please help me
No, "SendBTCommand" is a procedure I made myself.
DeleteYou need to add "BluetoothClient" from the left menu into the App.
After doing this, you will find "BluetoothClien1" to send text.
Look at the "SendBTCommand" for details of how to implement it.
Sir i could not get SendBTCommand in the bluetoothclient1 list what I should i have to do please sir I
Deleteneed your help
I get it from the procedure list, if any on having complexity on SendBTCommand see procedure and give the the "SendBTCommand" or what ever you want the you will get it.
Delete我可以請教您問題嗎?
ReplyDelete在我按下Canvas的時候我的X,Y,RGB不見了只留下數值,
而且只有X,Y會做數值變化RGB只會呈現(255 255 255 255)或是(255 255 255 0)的狀態
還有請問Status的功用是?
1. 如果你只是按到空白的地方,它的數值就會是 (255 255 255 255).
Delete2. Status 只是顯示 BT 有沒有連線成功而已,沒有其它用途。
抱歉我是初學者,我完整的照您的程式碼編寫可是還是出現幾個問題需要您的幫助
ReplyDelete1.canvas的圖片無法顯示
2.textbox的內容只剩純數字沒有原本的x.y.rgb
3.global定義p和7的原因是甚麼呢
1. 先加入一張 Canvas, 再加入一個 color wheel imageSprit 放到Canvas上。
ReplyDelete2. 應是程式有誤
3. 只是先給一個定義值,細節我要回去看code
我可以請您幫我看我的程式碼嗎?我照您的程式打仍然有錯誤。
Delete如果無法完成,請到 Google Playstore 下載我的 App 使用。
DeleteHi,
ReplyDeleteGreat job. Thanks for your sharing.
Your app is very close to my purpose. I need to control a led strip (WS2811) via HC-05 bluetooth module. But beside ability of change color, I need to add a button to make a random effection on the led strip.
Can you add this button or share your code to me: duongtronghue@gmail.com; Thanks in advance.
Regards,
Hue
Hi Saytinh,
DeleteFor WS2811, I have a tutorial with demo code in that page.
http://stonez56.blogspot.tw/2015/06/test-arduino-and-w2812b-led-strip.html
Basically, I use FASTLED library to light up the LED stripe.
Sorry, I'm too busy to do this. You should be able to add a button to that APP to do that job.
It is ok.
DeleteIs it possible to give me MIT code so that I can add the button by myself. Very appreciated if you could do that. Thanks
Sorry, as I said in the beginning, please download my free APP from Google Play Store.
Deletehi stonez
ReplyDeletethis is nc project. iwant to make the aia file, but i'm really rookie in this thing. if u dont mind, could u give me the designer screenshot? atleast the component screenshot please? thx before.
Sorry, as I said in the beginning, please download my free APP from Google Play Store.
DeleteYes, I downloaded many times. First time, it does not meet my requirement and I had to remove the app and looking for another apps but got nothing. Finally, I just downloaded your app again.
ReplyDeleteI'm glad that it worked out for you! :)
DeleteNot really. But if you can share your code. It's would be ideal.
DeleteHi! stonez
ReplyDeleteThanks for your sharing. But i don't know how to make a app in Appinventor2.
I want to look at the 'Designer' part of the app.
Help me!!!!
Can you Please send me a modified mobile application with output string as L_1_3_ValueofRed\nL_2_3_ValueofBlue\nL_3_3_ValueofGreen\n
ReplyDeleteHy Stonez, i got a problem. When i use your program, The text is .255.255.255. How can i fix it?
ReplyDeleteSorry, it's hard to help with the information you provided here.
DeleteHello Stonez! When I attempt to run the application on a Samsung S4, it hangs after 30 or so seconds. Is there a copy of version one that I can try? Thanks!
ReplyDeleteHi Nate, quite few people have ran into this issue. Let me post the older version .apk on this blog over the weekend, so whomever need this can give the older version a try.
DeleteStonez
Hello Stonez! You can give an APC file
ReplyDeleteYou can email sanik15@mail.ru
What's APC file? All Arduino code were provided on this Tutorial.
DeleteHello, I tried following your guide but my led's never get powered up. I isolated a diagnostics of the bt comm's first and all was ok. I isolated the glowing of the leds with a fader program and all is ok. With your program, the LED's don't light up.
ReplyDeleteCan you help?
Sorry, it's hard to help with the few descriptions you provided.
DeleteDo you mean my App won't light up LED at all?
Hello Stonez,
ReplyDeleteI have some question, I've installed your app and uploaded your code to my arduino. Now I want to use a rgb led strip that connects to 12V and to red, green and blue. How do I make it work? It should simply work r I have to do some circuitry with transistors?
Thanks.
Sorry, I haven't try this APP with LED strip yet, but I think it won't be too hard. Let me find a time to test this out.
DeleteHi Stonez,
ReplyDeleteplease share .aia file for this app.
my mail id: kjp.pee@gmail.com
Thanks for sharing your project, i am student i just trying to do your project again, i did not understand about the displaying info of X,Y & RGB is that you choose label
ReplyDeleteX, Y = the position you currently touch.
DeleteR,G,B=Shows you the R.G.B color composition to mixed to color you see.
hi Stonez;
ReplyDeleteColorCode how do I add ??help me
Sorry, I can't understand your question.
Deletebro, can i have the one with slider? please can you email me here ismaelstampede@gmail.com. i want also the blocks for the slider i can't finish it please bro thanks
ReplyDeletei want to have the slider blocks on MIT App
ReplyDeletewhat is SendBTComand?
ReplyDelete"SendBTCommand" (Send BlueTooth Command) is a procedure I made myself in AppInventer.
DeleteYou need to add "BluetoothClient" from the left menu into the App.
After doing this, you will find "BluetoothClien1" to send text.
Look at the "SendBTCommand" for details of how to implement it.
can you send me code of this project for arduino uno with 500 to 2000 rgb led for my entire room i love to do this but i have zero knowledge about itplz help me out
ReplyDeleteHi,
DeleteI think the proper solution for you might be W2812S LED strips.
See the lighting effects below.
http://stonez56.blogspot.tw/2015/06/test-arduino-and-w2812b-led-strip.html
Hello, After the app sends the RGB color it sends it again as all 0's
ReplyDeleteHi
ReplyDeleteHow about when I drag my finger to change color, it does not change it, but until the finger is resolved, take the last RGB value, check the data that the Bluetooth sends and they are correct, I would help . thanks ..
what is the SendBTcommand for? what block will i use? canvas, bluetooth?
ReplyDeleteSendBTCommand is used to send Bluetooth commands to Arduino from your smartphone. It's a procedure, so you need to create a procedure from AI2 first.
Deletesee this document to know how to do it:
http://ai2.appinventor.mit.edu/reference/blocks/procedures.html