FLProg + Nextion HMI. Lesson 3

In previous lessons ( lesson 1 , lesson 2 ), I explained how to draw the interface of the Nextion HMI panel, how to control the panel with the Arduino. In this tutorial, I’ll show you how to solve the inverse problem — control the Arduino board using the Nextion HMI panel.
In the lesson, we will expand the project of the previous lesson, add fan control, which will turn on when the temperature exceeds the specified limit, and turn off when the temperature drops below the second limit. The settings will be set from the panel and stored in the non-volatile memory of the Arduino controller. In addition, we will make a light switch on the panel (two-way) and a button with which we will turn on the flashlight (for example, to give a signal to aliens).

Modified scheme from the last lesson. The lantern, the light and the fan will mimic the LEDs.


Also the project of the panel is improved. Added two pages. In addition, the font loaded in the panel has been replaced. The project for the panel is in the archive, a link to which is given at the end of the article. In the comments to the past lesson, I was quite rightly scolded for the lack of design talent. I completely agree with this, so the new pages have no design, pure functionality.
Consider new pages.
')
Management page (“page3”, ID = 3).


Consider the items on the page.

1. Just text fields. Nothing interesting.
2. Field display setpoint fan on. As I already wrote, the panel does not know how to work with fractional numbers. Therefore, these are text fields. The row for display will be prepared on arduinka. Item Parameters
   
   Since the value in this field will be sent from the controller, we make it global (the “vscope” attribute is set to “global”). Clicking on this field will open the value edit page. Therefore, the following code is recorded in the “Touch Press Event” event.
   
   When you click on an element, first in the editable value field on page 4 we enter the current value.
   

   page4.evtemp.txt=onV.txt 

   
   Then in the variable that stores the identifier of the editable field on page 4, enter the identifier of the field that was clicked.
   

    page4.varN.val=0 

   
   Well, go to the edit value page.
   

    page page4 

   
   
   
3. Field display setting off the fan. Almost identical to the previous field. Item Parameters
   
   The code in the event “Touch Press Event”.
   
   In this code, the difference from the previous one is only in the field identifier.
   

    page4.varN.val=1 

   
   
   
4. Button back. Copied from the last lesson. Item Parameters
   
   The code in the event “Touch Press Event”.
   
   
   
5. Two-position switch (“Dual-state button”) - light control.
   Item Parameters
   
   The state value of this element will be read from the controller, therefore the global element (the “vscope” attribute and the value “global”). As the background display mode, the picture mode is selected (the “sta” attribute is set to “image”). Pictures are set in the attributes “pic0” for state 0 and “pic1” for state 1.
   
   
6. Button (“Button”) - turn on the flashlight. Item Parameters
   
   We will stop here in more detail. We will monitor the button presses from the controller to control the lamp. Unfortunately, in Arduino it is impossible to set an interrupt to receive a byte from the UART (at least by means of standards). Therefore, we had to implement memorization of the fact of pressing and releasing the button using two variables (7 and 8). We will not directly apply to the button, so it can be done both locally and globally (I made it global just in case). The following code is written in the button click handler (“Touch Press Event”).
   
   And in the button release handler (“Touch Release Event”) such.
   
   We need these variables in the click tracking block in the FLProg project.
   
   

Edit value window (“page4”, ID = 4).

Consider what is included in it.

1. Editable value field. Item Parameters
   
   The value of this field will be read from the controller, accordingly we make it global (the “vscope” attribute is set to “global”).
   
   
2. Value entry buttons. All these buttons are almost identical, and differ in the inscription and code in the event handler “Touch Press Event”. When you click on one of these buttons, the corresponding symbol is added to the current value of the editable value field.
   
   The code in the event “Touch Press Event” for each of the buttons.

   “0”
   

    evtemp.txt=evtemp.txt+"0" 

   
   "one"
   

    evtemp.txt=evtemp.txt+"1" 

   
   “2”
   

    evtemp.txt=evtemp.txt+"2" 

   
   “3”
   

    evtemp.txt=evtemp.txt+"3" 

   
   "four"
   

    evtemp.txt=evtemp.txt+"4" 

   
   "five"
   

    evtemp.txt=evtemp.txt+"5" 

   
   “6”
   

    evtemp.txt=evtemp.txt+"6" 

   
   “7”
   

    evtemp.txt=evtemp.txt+"7" 

   
   "eight"
   

    evtemp.txt=evtemp.txt+"8" 

   
   "9"
   

    evtemp.txt=evtemp.txt+"9" 

   
   “.”
   

    evtemp.txt=evtemp.txt+"." 

   
   
   
   
3. Button to clear the field. Pressing it deletes the field value.
   The code in the event “Touch Press Event”
   

    evtemp.txt="" 

   
   
4. Button to delete the last character.
   The code in the event “Touch Press Event”
   

    evtemp.txt=evtemp.txt-1 

   
   This is not a documented feature. It removes the last character in the string. I spied it on one of the videos on the manufacturer's website. In general, I did not find almost any information on working with strings on the panel.
   
   
5. Button to finish editing the value.
   Pressing this button will be tracked on the controller, so two variables are created for it (“endPress” and “endRel”) and the code is written in the event handlers.
   The code in the event “Touch Press Event”
   

    page4.endPress.val=1 

   
   The code in the event “Touch Release Event”
   

    page4.endRel.val=1 

   
   
   
6. Cancel button. By pressing this button, we simply return to the control page.
   The code in the event “Touch Press Event”
   

    page page3 

   
   
   

With the panel finished, go to the FLProg program. It also uses the project from the last lesson a little modified. The project file is in the archive, the link to which is given at the end of the post.
As in the last lesson, I will show the finished circuit boards and tell what is happening in them.
Fee 7 - "Lantern Management"



Everything is simple here. Block B46 - “Tracking Clicks” (library of elements, folder “Nextion HMI Panel”). At its output, it has a value corresponding to the state of the monitored button or another element of the having the “Touch Press Event” and “Touch Release Event” on the panel. This value is directly recorded in the exit tied to the lamp. The block is parameterized using the block editor.



In the block editor, you need to select a panel, and then create a new page and write the necessary elements on it. How to do this, I told in the previous lesson.



You should get this picture.



As a pressing variable, select the variable to which we write the unit in the “Touch Press Event” button, and as the release variable, the variable from the “Touch Release Event” button.

Fee 8 - "Control of the light."



Same very simple fee. Here we read the switch position using block B47 - “Get Parameter” (element library -> Nextion HMI Panel folder -> Elements folder). This value is then sent directly to the output block tied to the lighting. The block is parameterized using the block editor.



To reduce the load on the controller, we will make a request for the state of the switch once a second.

Board 9 - "The end of the editing parameters."
On this board, we will process the click on the "Finish" button on the edit options page.



With the help of block B48 - “Tracking of clicks” (library of elements, folder “Nextion HMI Panel”) we determine the moment of clicking. In the editor of this block, we will create page 4 and fill it with elements of interest to us.



And configure the block.



Using block 49 - “Rtrig” (library of elements, “Triggers” folder), select the leading edge of the signal that the “Done” button is clicked and write to the “Editing end” variable.
Also on this front, we read the value of the variable that stores the identifier of the editable field using the block B54 - “Get Parameter” (element library -> Nextion HMI Panel folder -> Elements folder). Block settings.



The resulting value is set to the variable "Editable field number".
And for the same impulse, we will directly read the new value from the text field using the B50 block - - “Get Parameter” (element library -> Nextion HMI Panel folder -> Elements folder). Block settings.



We transform a new value from a string into a number in the Float format using block B51 - “String Conversion” (library of elements, “Type Conversion” folder). Block settings.



Multiply the number by 10 using the block B52 - “MUL (*)” (library of elements, “Mathematics” folder), change the type to Integer using the block B53 - “Convert Float to Integer” (library of elements, “Conversion of types” folder) and put in the variable "New value".

Fee 10 - "Processing the results of editing values"



Using the block B55 - “Comparator” (library of elements, folder “Comparison”) we determine which field was edited and, depending on the result, write the value from the variable “New value” by impulse in the variable “Editing end” to one of two variables, in the “fan off setting x10” or in the “fan on setting x10”. Also for the same impulse, we give the panel command to go to the control page using the B58 block “Go to page” (library of elements, folder “Nextion HMI Panel” -> “Page” folder). Block settings.



Fee 11 - “Writing setting values ​​to the panel and EEProm”



With the help of block 59 - “Number change detector” (library of elements, folder “Basic elements”) we determine the fact of changing the value of the variable “Fan activation setting x10”. At the output of the block, a short pulse is formed at the moment of changing the value at the input “Value”. This impulse records the value to the non-volatile memory of the controller. This is done with the help of block B65 - “Recording in EEPROM” (library of elements, folder “EEPROM”). The block is configured using the block editor.



Before writing a variable in the EEPROM, you need to create it there. To do this, click the "Create" button in the block editor. The variable creation window opens.



In it we set the name of the variable and its type. After pressing the button, the block is ready to be bound to this variable.



Also, by the signal of a variable change, its value is divided into a constant of type Float equal to 10 with the help of block 61 - “DIV (/)” (library of elements, folder “Mathematics”), turns into a string with the help of block B62 - “String conversion” (library of elements, folder “type conversion”), and is sent to the panel in the appropriate field using block B63 - “Set Parameter” (library of elements, folder “Nextion HMI Panel” -> Elements folder). Settings of this unit.



The logic of the variable control “Setting the fan off x10” is similar, the settings of the blocks are as follows.

Block b65.



Block B68.



Now we will ensure reading the settings from the EEPROM at the time of the controller start. To do this, we insert a new board at the very top of the project in order for the circuit located on it to be executed in the first place. To do this, select the first plan and press the button "Insert board before the selected one".



Let's call the new board “Reading settings from EEPROM”.

Fee 1.



Using the block B72 - “Rtrig” (library of elements, folder “Triggers”) we create one short impulse when the controller is turned on. According to this impulse, the values ​​read from the non-volatile memory are recorded into the variables “Setting the fan on x10” and “Setting the fan x10 off”. This happens with the help of blocks B71 and B73 - “Reading from EEPROM” (library of elements, “EEPROM” folder). Blocks are parameterized using the block editor.



Parameters block B71.



The selection of a readable variable in the EEPROM is made by pressing the “Select” button. The variable selection window opens.



Block B73 parameters.



Well, the last board in the project.

Fee 12. "Fan control"



If the current temperature exceeds the setpoint “Fan on setpoint x10”, this will detect the comparison unit B69 and set trigger B70 to state 1, and when the temperature drops below set point setpoint fan off switch x10, it will be detected by block B71, which sets trigger B70 to state 0. The state of the trigger is fed to the output unit associated with the fan.

Archive with source code of projects.

Video demonstration