{"id":186,"date":"2016-05-05T08:18:53","date_gmt":"2016-05-05T08:18:53","guid":{"rendered":"http:\/\/justanotherelectronicsblog.com\/?p=186"},"modified":"2016-05-05T08:18:53","modified_gmt":"2016-05-05T08:18:53","slug":"quick-gui-for-mbed-projects-part-2","status":"publish","type":"post","link":"https:\/\/justanotherelectronicsblog.com\/?p=186","title":{"rendered":"Quick GUI for MBED projects, part 2"},"content":{"rendered":"<p>The previous post I explained the code for the dear ImGui part of the GUI. In this part the code for the serial connection will be discussed.<\/p>\n<p>This code is made up of 2 parts, the MBED code and the PC side code. The MBED code will be discussed first. The MBED code uses the excellent MODSERIAL library. The MBED code after stripping away the initialization and such looks like this:<\/p>\n<p><!--more--><\/p>\n<pre class=\"lang:c decode:true\">#define MESSAGE_BUFFER_SIZE 32\r\n\r\nvolatile bool messageReceived = false;\r\nchar messageBufferIncoming[MESSAGE_BUFFER_SIZE];\r\nchar messageBufferOutgoing[MESSAGE_BUFFER_SIZE];\r\n \r\nvoid messageReceive(MODSERIAL_IRQ_INFO *q) \r\n{\r\n    MODSERIAL *sys = q-&gt;serial;\r\n    sys-&gt;move(messageBufferIncoming, MESSAGE_BUFFER_SIZE);\r\n    messageReceived = true;\r\n}\r\n \r\nvoid adcread()\r\n{\r\n    uint16_t adc1, adc2;\r\n    adc1 = ain1.read_u16();\r\n    adc2 = ain2.read_u16();\r\n    sprintf(messageBufferOutgoing,\"A%02u%02u\\n\",adc1\/656,adc2\/656);\r\n    pc.puts(messageBufferOutgoing);\r\n}\r\n \r\nvoid ioread()\r\n{\r\n    messageBufferOutgoing[0] = 'I';\r\n    messageBufferOutgoing[1] = dips1 + 48;\r\n    messageBufferOutgoing[2] = dips2 + 48;\r\n    messageBufferOutgoing[3] = dips3 + 48;\r\n    messageBufferOutgoing[4] = dips4 + 48;\r\n    messageBufferOutgoing[5] = dips5 + 48;\r\n    messageBufferOutgoing[6] = dips6 + 48;\r\n    messageBufferOutgoing[7] = dips7 + 48;\r\n    messageBufferOutgoing[8] = dips8 + 48;\r\n    messageBufferOutgoing[9] = '\\n';\r\n    messageBufferOutgoing[10] = NULL;\r\n    pc.puts(messageBufferOutgoing);\r\n}\r\n \r\nint main() \r\n{\r\n    pc.baud(115200);\r\n    pc.attach(&amp;messageReceive, MODSERIAL::RxAutoDetect);\r\n    pc.autoDetectChar('\\n');\r\n    \r\n    adctimer.attach(&amp;adcread, 0.025);\r\n    iotimer.attach(&amp;ioread, 0.25);\r\n     \r\n    while(1) \r\n    {\r\n        while(messageReceived)\r\n        {\r\n            if(messageBufferIncoming[0] == 'L')\r\n            {\r\n                led1 = messageBufferIncoming[1] - 48;\r\n                led2 = messageBufferIncoming[2] - 48;\r\n                led3 = messageBufferIncoming[3] - 48;\r\n                led4 = messageBufferIncoming[4] - 48;\r\n                led5 = messageBufferIncoming[5] - 48;\r\n                led6 = messageBufferIncoming[6] - 48;\r\n                led7 = messageBufferIncoming[7] - 48;\r\n                led8 = messageBufferIncoming[8] - 48;\r\n            }\r\n            else if(messageBufferIncoming[0] == 'D')\r\n            {\r\n                float dacval = (float)(messageBufferIncoming[3] - 48)\/10.0;\r\n                dacval += (float)(messageBufferIncoming[4] - 48)\/100.0;\r\n                aout = dacval;\r\n            }\r\n            messageReceived = false;\r\n        }    \r\n    }\r\n}<\/pre>\n<p>The full code can be found on my <a href=\"https:\/\/github.com\/riktw\/Dear_ImGui_MBED\">Github<\/a>.<\/p>\n<p>The MBED sends a few strings to the PC, for an ADC value: &#8220;A1234\\n&#8221;, in this case ADC1 has the value 12 and ADC2 has the value of 34. The ADC range is 00 to 99 and always is 2 digits. The IO pins are send as following: &#8220;I00110101\\n&#8221;. Every 0 or 1 is the value of an IO pin. The PC side sends 2 strings back. The DAC value (&#8220;D12\\n&#8221;, range of 00 to 99) and the selected LED&#8217;s (&#8220;L00001111\\n&#8221;), works the same as the IO pins.)<\/p>\n<p>The MBED code sets up MODSERIAL so it will make messageReceived high when an end of line &#8220;\\n&#8221; character is received. In the main loop the MBED constantly checks if messageReceived is high and if so it decodes the message and sets the LEDs and DAC accordingly. 2 timer interrupts are initialized, one for the ADC and one for the IO pins. Every time these timer interrupts trigger the MBED sends the IO and ADC values to the PC side.<\/p>\n<p>The PC code shown below are snippets from the code as all the ImGui related code has been explained in the previous blog post.<\/p>\n<p>The serial port is opened with:<\/p>\n<pre class=\"lang:c decode:true \">serial::Serial my_serial(\"\/dev\/ttyACM0\", 115200, serial::Timeout::simpleTimeout(1000));\r\n<\/pre>\n<p>Open port ttyACM0 at 115200 BAUD with a timeout of 1000ms. The port has to be changed to the correct port when running this code obviously.<\/p>\n<p>The code to read in lines and do something with them is as follows:<\/p>\n<pre class=\"lang:c decode:true \">\tint count = my_serial.readline(buffer, 100, \"\\n\");\r\n\tif((count &gt;= 1) &amp;&amp; (buffer[0] == 'A'))\r\n\t{\r\n\t\tadc1arr[counter] = ((buffer[1]-48) * 10) + (buffer[2]-48);\r\n\t\tadc2arr[counter] = ((buffer[3]-48) * 10) + (buffer[4]-48);\r\n\t\tcounter++;\r\n\t\tif(counter &gt;= 100)\r\n\t\t\tcounter = 0;\r\n\t}\r\n\telse if((count &gt;= 1) &amp;&amp; (buffer[0] == 'I'))\r\n\t{\r\n\t\tinput[0] = buffer[1] - 48;\r\n\t\tinput[1] = buffer[2] - 48;\r\n\t\tinput[2] = buffer[3] - 48;\r\n\t\tinput[3] = buffer[4] - 48;\r\n\t\tinput[4] = buffer[5] - 48;\r\n\t\tinput[5] = buffer[6] - 48;\r\n\t\tinput[6] = buffer[7] - 48;\r\n\t\tinput[7] = buffer[8] - 48;\r\n\t}<\/pre>\n<p>my_serial.readline(buffer, 100, &#8220;\\n&#8221;); reads a line that ends with a &#8220;\\n&#8221; character and places it in the buffer. It returns the amount of bytes read in. If there is 1 byte or more and the first byte is an A it&#8217;s ADC data, first byte an I means it&#8217;s IO pin data. The received data then gets decoded accordingly.<\/p>\n<p>The LEDs and DAC values are send using the following code:<\/p>\n<pre class=\"lang:c decode:true \">\tstatic int ledsold;\r\n\tint leds = led[0] + (led[1] &lt;&lt; 1) + (led[2] &lt;&lt; 2) + (led[3] &lt;&lt; 3)  + (led[4] &lt;&lt; 4) + (led[5] &lt;&lt; 5) + (led[6] &lt;&lt; 6) + (led[7] &lt;&lt; 7);\r\n\tif(ledsold != leds)\r\n\t{\r\n\t\tledsold = leds;\r\n\t\tstring test_string;\r\n\t\ttest_string = \"L\";\r\n\t\tfor(int i = 0; i &lt; 8; i++)\r\n\t\t{\r\n\t\t\tif(led[i] == true)\r\n\t\t\t\ttest_string += \"1\";\r\n\t\t\telse\r\n\t\t\t\ttest_string += \"0\";\r\n\t\t}\r\n\t\ttest_string += \"\\n\";\r\n\t\tsize_t bytes_wrote = my_serial.write(test_string);\r\n\t\tcout &lt;&lt; \"Bytes wrote: \" &lt;&lt; bytes_wrote &lt;&lt; endl;\r\n\t}\r\n\r\n\r\n\tImGui::SliderInt(\"DAC value\", &amp;tint, 0, 100);\r\n\tif(tintold != tint)\r\n\t{\r\n\t\ttintold = tint;\r\n\t\tfloat tfloat = (float)tint\/100.0;\r\n\t\tif(tfloat &gt; 1.0)\r\n\t\t\ttfloat = 1.0;\r\n\t\tstring dacstring = \"D\";\r\n\t\tstd::ostringstream buff;\r\n\t\tbuff &lt;&lt; std::setprecision(2) &lt;&lt; tfloat;\r\n\t\tdacstring += buff.str();\r\n\t\tdacstring += \"\\n\";\r\n\t\tsize_t bytes_wrote = my_serial.write(dacstring);\r\n\t\tcout &lt;&lt; \"Bytes wrote: \" &lt;&lt; bytes_wrote &lt;&lt; endl;\r\n\t}<\/pre>\n<p>The actual part that sends data to the MBED is very simple, gather all the data in a string and send it using my_serial.write(); For the LEDs first all the separate LED values are combined in a single integer. If this integer is different from the last value it will send the new value, else it will do nothing. If a new value has to be send all the LED values are placed in an string and send to the MBED.<\/p>\n<p>the DAC code works in a similar way. The integer value of the DAC gets converted a few times before it&#8217;s placed in a string and send to the MBED but the principle is the same as the LEDs.<\/p>\n<p>The full code can be found on my <a href=\"https:\/\/github.com\/riktw\/Dear_ImGui_MBED\">Github<\/a> page. It uses <a href=\"https:\/\/github.com\/ocornut\/imgui\">Dear ImGui<\/a> and <a href=\"https:\/\/github.com\/wjwwood\/serial\">Serial<\/a>, so the requirements for those two libraries should be installed, which I think is only OpenGL on a Linux system. But more info can be found on their github pages. In the end these two libraries make it fairly simple to create a fully C++ based GUI for any microcontroller with a serial port, be it an Arduino or a Raspberry pi. I hope these two posts can help others getting started with these two libraries and if there are any questions, feel free to contact me :)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The previous post I explained the code for the dear ImGui part of the GUI. In this part the code for the serial connection will be discussed. This code is made up of 2 parts, the MBED code and the PC side code. The MBED code will be discussed first. The MBED code uses the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-186","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Quick GUI for MBED projects, part 2 - jaeblog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/justanotherelectronicsblog.com\/?p=186\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Quick GUI for MBED projects, part 2 - jaeblog\" \/>\n<meta property=\"og:description\" content=\"The previous post I explained the code for the dear ImGui part of the GUI. In this part the code for the serial connection will be discussed. This code is made up of 2 parts, the MBED code and the PC side code. The MBED code will be discussed first. The MBED code uses the [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/justanotherelectronicsblog.com\/?p=186\" \/>\n<meta property=\"og:site_name\" content=\"jaeblog\" \/>\n<meta property=\"article:published_time\" content=\"2016-05-05T08:18:53+00:00\" \/>\n<meta name=\"author\" content=\"riktw\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"riktw\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186\"},\"author\":{\"name\":\"riktw\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/#\\\/schema\\\/person\\\/d77e39721321c4a472b49909a8f1982b\"},\"headline\":\"Quick GUI for MBED projects, part 2\",\"datePublished\":\"2016-05-05T08:18:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186\"},\"wordCount\":615,\"commentCount\":0,\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186\",\"url\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186\",\"name\":\"Quick GUI for MBED projects, part 2 - jaeblog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/#website\"},\"datePublished\":\"2016-05-05T08:18:53+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/#\\\/schema\\\/person\\\/d77e39721321c4a472b49909a8f1982b\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?p=186#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Quick GUI for MBED projects, part 2\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/#website\",\"url\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/\",\"name\":\"jaeblog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/#\\\/schema\\\/person\\\/d77e39721321c4a472b49909a8f1982b\",\"name\":\"riktw\",\"url\":\"https:\\\/\\\/justanotherelectronicsblog.com\\\/?author=1\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Quick GUI for MBED projects, part 2 - jaeblog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/justanotherelectronicsblog.com\/?p=186","og_locale":"en_US","og_type":"article","og_title":"Quick GUI for MBED projects, part 2 - jaeblog","og_description":"The previous post I explained the code for the dear ImGui part of the GUI. In this part the code for the serial connection will be discussed. This code is made up of 2 parts, the MBED code and the PC side code. The MBED code will be discussed first. The MBED code uses the [&hellip;]","og_url":"https:\/\/justanotherelectronicsblog.com\/?p=186","og_site_name":"jaeblog","article_published_time":"2016-05-05T08:18:53+00:00","author":"riktw","twitter_card":"summary_large_image","twitter_misc":{"Written by":"riktw","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/justanotherelectronicsblog.com\/?p=186#article","isPartOf":{"@id":"https:\/\/justanotherelectronicsblog.com\/?p=186"},"author":{"name":"riktw","@id":"https:\/\/justanotherelectronicsblog.com\/#\/schema\/person\/d77e39721321c4a472b49909a8f1982b"},"headline":"Quick GUI for MBED projects, part 2","datePublished":"2016-05-05T08:18:53+00:00","mainEntityOfPage":{"@id":"https:\/\/justanotherelectronicsblog.com\/?p=186"},"wordCount":615,"commentCount":0,"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/justanotherelectronicsblog.com\/?p=186#respond"]}]},{"@type":"WebPage","@id":"https:\/\/justanotherelectronicsblog.com\/?p=186","url":"https:\/\/justanotherelectronicsblog.com\/?p=186","name":"Quick GUI for MBED projects, part 2 - jaeblog","isPartOf":{"@id":"https:\/\/justanotherelectronicsblog.com\/#website"},"datePublished":"2016-05-05T08:18:53+00:00","author":{"@id":"https:\/\/justanotherelectronicsblog.com\/#\/schema\/person\/d77e39721321c4a472b49909a8f1982b"},"breadcrumb":{"@id":"https:\/\/justanotherelectronicsblog.com\/?p=186#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/justanotherelectronicsblog.com\/?p=186"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/justanotherelectronicsblog.com\/?p=186#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/justanotherelectronicsblog.com\/"},{"@type":"ListItem","position":2,"name":"Quick GUI for MBED projects, part 2"}]},{"@type":"WebSite","@id":"https:\/\/justanotherelectronicsblog.com\/#website","url":"https:\/\/justanotherelectronicsblog.com\/","name":"jaeblog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/justanotherelectronicsblog.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/justanotherelectronicsblog.com\/#\/schema\/person\/d77e39721321c4a472b49909a8f1982b","name":"riktw","url":"https:\/\/justanotherelectronicsblog.com\/?author=1"}]}},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/posts\/186","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=186"}],"version-history":[{"count":5,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/posts\/186\/revisions"}],"predecessor-version":[{"id":192,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=\/wp\/v2\/posts\/186\/revisions\/192"}],"wp:attachment":[{"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=186"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=186"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/justanotherelectronicsblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=186"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}