{"id":1119,"date":"2022-07-31T04:42:54","date_gmt":"2022-07-31T04:42:54","guid":{"rendered":"https:\/\/blog.embeddedexpert.io\/?p=1119"},"modified":"2022-07-31T04:48:30","modified_gmt":"2022-07-31T04:48:30","slug":"stm32-and-nextion-display-part-4-led-brightness-control","status":"publish","type":"post","link":"https:\/\/blog.embeddedexpert.io\/?p=1119","title":{"rendered":"STM32 and Nextion Display Part 4: LED Brightness Control"},"content":{"rendered":"\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/m.media-amazon.com\/images\/S\/abs-image-upload-na\/9\/AmazonStores\/ATVPDKIKX0DER\/4551205750cd023df17bdecd5dbbb3ee.w400.h400.jpg\" alt=\"\" \/><\/figure><\/div>\n\n\n\n<p>In the previous guide (<a rel=\"noreferrer noopener\" href=\"https:\/\/blog.embeddedexpert.io\/?p=1105\" data-type=\"URL\" data-id=\"https:\/\/blog.embeddedexpert.io\/?p=1105\" target=\"_blank\">here<\/a>), we took a look how to control two LED using touch toggle switches. In this guide, we shall see how to control LEDs brightness using sliders.<\/p>\n\n\n\n<p>In this guide, we shall cover the following:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>LED PWM driver code.<\/li><li>Nextion code.<\/li><li>STM32F4 code.<\/li><li>Demo.<\/li><\/ul>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. LED PWM Driver Code.<\/h2>\n\n\n\n<p>The LED PWM driver is already covered (<a rel=\"noreferrer noopener\" href=\"https:\/\/blog.embeddedexpert.io\/?p=363\" data-type=\"URL\" data-id=\"https:\/\/blog.embeddedexpert.io\/?p=363\" target=\"_blank\">here<\/a>). However, with minor modification which allows us to set the duty cycle for each LED independently.<\/p>\n\n\n\n<p>LED_PWM.c file<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;clike&quot;,&quot;mime&quot;:&quot;text\/x-csrc&quot;,&quot;theme&quot;:&quot;dracula&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;C&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;c&quot;}\">#include &quot;LED_PWM.h&quot;\n\nvoid LED_PWM_init()\n\t{\n\t\tRCC-&gt;AHB1ENR|=RCC_AHB1ENR_GPIOAEN;\n\t\tGPIOA-&gt;MODER|=(1&lt;&lt;1)|(1&lt;&lt;3);\n\t\tGPIOA-&gt;AFR[0]|=(1&lt;&lt;0)|(1&lt;&lt;4);\n\t\tRCC-&gt;APB1ENR|=RCC_APB1ENR_TIM2EN; \/\/enable clock access to tim2\n\t\tTIM2-&gt;PSC=0; \/\/set prescaller to 0 (no divider)\n\t\tTIM2-&gt;ARR=100; \/\/set the maximum count value\n\t\tTIM2-&gt;CNT=0; \/\/seset the current count\n\t\tTIM2-&gt;CCMR1=(1&lt;&lt;5)|(1&lt;&lt;6)|(1&lt;&lt;13)|(1&lt;&lt;14); \/\/configure the pins as PWM\n\t\tTIM2-&gt;CCER|=0x11; \/\/enbale channel1 and channel2\n\t\tTIM2-&gt;CR1=1; \/\/enable timer\n\t}\n\nvoid Set_duty(LED_Number LED, uint8_t duty )\n\t{\n\tif(duty&gt;100){duty=100;}\n\tswitch (LED)\n\t\t{\n\t\t\tcase LED0: TIM2-&gt;CCR1=duty; break;\n\t\t\tcase LED1: TIM2-&gt;CCR2=duty; break;\n\t\t\tdefault: break;\n\t\t}\n\t}\n\n\n<\/pre><\/div>\n\n\n\n<p>LED_PWM.h<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;clike&quot;,&quot;mime&quot;:&quot;text\/x-csrc&quot;,&quot;theme&quot;:&quot;dracula&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;C&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;c&quot;}\">#ifndef LED_PWM_H_\n#define LED_PWM_H_\n#include &quot;stdint.h&quot;\n#include &quot;stm32f4xx.h&quot;\ntypedef enum\n{\n\tLED0=0,\n\tLED1=1\n\n}LED_Number;\nvoid LED_PWM_init();\nvoid Set_duty(LED_Number LED, uint8_t duty );\n\n#endif \/* LED_PWM_H_ *\/\n<\/pre><\/div>\n\n\n\n<p>For connection, similar to LED control<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2021\/08\/Screen-Shot-2021-08-30-at-8.19.34-AM.png\" alt=\"\" \/><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">2. Nextion Code:<\/h2>\n\n\n\n<p><\/p>\n\n\n\n<p>We start of by adding two text:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"933\" height=\"1024\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-933x1024.png\" alt=\"\" class=\"wp-image-1089\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-933x1024.png 933w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-273x300.png 273w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-768x843.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-1400x1536.png 1400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-1150x1262.png 1150w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-750x823.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-400x439.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01-250x274.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-13-01.png 1524w\" sizes=\"(max-width: 933px) 100vw, 933px\" \/><\/figure>\n\n\n\n<p>Resize the text size according to your screen.<\/p>\n\n\n\n<p>From right side, attribute, note the objname and set txt_maxl to 30:<\/p>\n\n\n\n<p>Then, we need to generate fonts as following:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"983\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-1024x983.png\" alt=\"\" class=\"wp-image-1093\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-1024x983.png 1024w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-300x288.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-768x737.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-1150x1104.png 1150w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-750x720.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-400x384.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38-250x240.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-16-38.png 1198w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Select the type of font you like and give a name to the font:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"878\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44.png\" alt=\"\" class=\"wp-image-1094\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44.png 900w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44-300x293.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44-768x749.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44-750x732.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44-400x390.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-18-44-250x244.png 250w\" sizes=\"(max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n\n\n<p>Press Generate font and save the file<\/p>\n\n\n\n<p>After that, press yes.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"376\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26.png\" alt=\"\" class=\"wp-image-1095\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26.png 960w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26-300x118.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26-768x301.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26-750x294.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26-400x157.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-19-26-250x98.png 250w\" sizes=\"(max-width: 960px) 100vw, 960px\" \/><\/figure>\n\n\n\n<p>Next, we shall add two sliders:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"372\" height=\"1024\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49-372x1024.png\" alt=\"\" class=\"wp-image-1120\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49-372x1024.png 372w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49-109x300.png 109w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49-400x1100.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49-250x688.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-22-49.png 440w\" sizes=\"(max-width: 372px) 100vw, 372px\" \/><\/figure><\/div>\n\n\n\n<p>Resize both slider and texts area according to your screen.<\/p>\n\n\n\n<p>It should be something similar to this:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"839\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-1024x839.png\" alt=\"\" class=\"wp-image-1121\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-1024x839.png 1024w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-300x246.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-768x629.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-750x615.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-400x328.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06-250x205.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-25-06.png 1030w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Now clock on the first slider and check the attribute of each element:<\/p>\n\n\n\n<p> Set val to 0<\/p>\n\n\n\n<p>max val to 100<\/p>\n\n\n\n<p>minval to 0<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"361\" height=\"1024\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16-361x1024.png\" alt=\"\" class=\"wp-image-1122\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16-361x1024.png 361w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16-106x300.png 106w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16-400x1135.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16-250x709.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-27-16.png 432w\" sizes=\"(max-width: 361px) 100vw, 361px\" \/><\/figure><\/div>\n\n\n\n<p>Select the first slider and select Touch Move:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"459\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-1024x459.png\" alt=\"\" class=\"wp-image-1123\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-1024x459.png 1024w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-300x134.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-768x344.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-1536x689.png 1536w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-1150x516.png 1150w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-750x336.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-400x179.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43-250x112.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-29-43.png 1566w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Add the following code:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;clike&quot;,&quot;mime&quot;:&quot;text\/x-csrc&quot;,&quot;theme&quot;:&quot;dracula&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;C&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;c&quot;}\">print &quot;@&quot;\nprint &quot;0&quot;\nprints h0.id,1\nprints h0.val,1\nprint &quot;&amp;&quot;\n<\/pre><\/div>\n\n\n\n<p><\/p>\n\n\n\n<p>For the second silder:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;clike&quot;,&quot;mime&quot;:&quot;text\/x-csrc&quot;,&quot;theme&quot;:&quot;dracula&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;C&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;c&quot;}\">print &quot;@&quot;\nprint &quot;0&quot;\nprints h1.id,1\nprints h1.val,1\nprint &quot;&amp;&quot;\n\n<\/pre><\/div>\n\n\n\n<p>Now, debug the LCD code:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"330\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-1024x330.png\" alt=\"\" class=\"wp-image-1097\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-1024x330.png 1024w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-300x97.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-768x248.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-1150x371.png 1150w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-750x242.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-400x129.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30-250x81.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-24_07-21-30.png 1222w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Move the slider and you shall get something like this:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"791\" src=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-1024x791.png\" alt=\"\" class=\"wp-image-1124\" srcset=\"https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-1024x791.png 1024w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-300x232.png 300w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-768x594.png 768w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-1536x1187.png 1536w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-1150x889.png 1150w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-750x580.png 750w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-400x309.png 400w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37-250x193.png 250w, https:\/\/blog.embeddedexpert.io\/wp-content\/uploads\/2022\/07\/2022-07-31_07-32-37.png 1884w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption>The 5 received bytes as following:<\/figcaption><\/figure>\n\n\n\n<ul class=\"wp-block-list\"><li>Character &#8216;@&#8217;<\/li><li>Character &#8216;0&#8217;<\/li><li>The ID of the slider (0x02 in my case)<\/li><li>Silder Value<\/li><li>0x26 for character &#8216;&amp;&#8217;<\/li><\/ul>\n\n\n\n<p><\/p>\n\n\n\n<p>Now upload the code to nextion.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">3. STM32F4 setup code:<\/h2>\n\n\n\n<p>Inside the <strong>process_data<\/strong> function:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;clike&quot;,&quot;mime&quot;:&quot;text\/x-csrc&quot;,&quot;theme&quot;:&quot;dracula&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;C&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;c&quot;}\">if(NEXTION_BUFF[0]==0x40) \/*Slider *\/\n\t\t{\n  \t\t\tuint8_t pwm_value;\n  \t\t\tchar data_srting[20];\n\t\n\t\t\tif(NEXTION_BUFF[2]==0x02) \/*First slider*\/\n\t\t\t{\n\t\t\t\tpwm_value=NEXTION_BUFF[3];\n\t\t\t\tSet_duty(LED0,pwm_value);\n\t\t\t\tsprintf(data_srting,&quot;LED0 Duty %d&quot;,pwm_value);\n\t\t\t\tnextion_write_text(&quot;t0&quot;,data_srting);\n\n\t\t\t}\n\t\t\tif(NEXTION_BUFF[2]==0x04) \/*First slider*\/\n\t\t\t{\n\t\t\t\tpwm_value=NEXTION_BUFF[3];\n\t\t\t\tSet_duty(LED1,pwm_value);\n\t\t\t\tsprintf(data_srting,&quot;LED1 Duty %d&quot;,pwm_value);\n\t\t\t\tnextion_write_text(&quot;t1&quot;,data_srting);\n\t\t\t}\n\t\t}<\/pre><\/div>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">4. Demo:<\/h2>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"LED Brightness Control Using Nextion Display\" width=\"1170\" height=\"658\" src=\"https:\/\/www.youtube.com\/embed\/YS3dzX3lxp0?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Happy coding \ud83d\ude42 <\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the previous guide (here), we took a look how to control two LED using touch toggle switches. In this guide, we shall see how to control LEDs brightness using sliders. In this guide, we shall cover the following: LED PWM driver code. Nextion code. STM32F4 code. Demo. 1. LED PWM Driver Code. The LED [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,2,19,11,12],"tags":[],"class_list":["post-1119","post","type-post","status-publish","format-standard","hentry","category-data-structures","category-embedded-systems","category-lcd","category-peripheral-drivers","category-stm32"],"_links":{"self":[{"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/posts\/1119"}],"collection":[{"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1119"}],"version-history":[{"count":3,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/posts\/1119\/revisions"}],"predecessor-version":[{"id":1128,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=\/wp\/v2\/posts\/1119\/revisions\/1128"}],"wp:attachment":[{"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1119"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1119"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.embeddedexpert.io\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}