Tutorial on how to write code with Nextion and Arduino

@A prompt “TOUCH HERE TO READ” on t1 box. When you press on t1, which covers all of the display, the touch event is going to print the first four lines, from the values we have sented, doing the following:

1. xstr 15,22,390,30,0,BLACK,34784,0,1,1,va0.txt  
2. xstr 15,22+30,390,30,0,BLACK,34784,0,1,1,va1.txt  
3. xstr 15,22+60,390,30,0,BLUE,34784,0,1,1,va2.txt  
4. xstr 15,22+90,390,30,0,BLUE,34784,0,1,1,va3.txt

We are using the < xstr > command that Prints text on the Nextion device using defined area for text rendering
usage: xstr ,,,,,,,,,,

We start to print with < xstr >, at 15 < x > and 22 < y > coordinates for the first line, and for the other three, we add 30 pixels to < y > coordinate from the last line’s < y > coordinate

@By pressing button b1, we print to the serial in hex form: < printh 23 03 4c 04 > and we also print one byte of the variable with: < prints cnt.val,1 >.
prints ,
is either component attribute, variable or Constant
is either 0 (all) or a number to limit the bytes to send

The result of < printh 23 03 4c 04 > and < prints cnt.val,1 > is the value: < #3L4Y > (where there is a “Y”, it is the value of the cnt variable each time). In hex: 0x23 0x02 0x50 0x01
is a counter egual to the number of the text array Line that we want to store into the Nextion's variable < nextion_var > for this example < va4 >.
According to our protocol, we have the command group “Line” (<#> <nextion_var> ). We send the two bytes, < nextion_var > and < cnt > to the void sending_text(byte cnt, byte nextion_var).
We are now waiting for the Arduino to send the array line that is equal to cnt value and store it to va4.
With the Release Event of b1 we change the values of the variables according to the above table at the introduction of this page(first_example) and we print them again.
The result is that we print a new line at the bottom and the other 3 lines go up a level.
At the release event of b2, the opposite things happen.

CODE SAMPLE FROM .HMI FILE

CODE SAMPLE FROM .ino FILE

/* < case 0x4C: > (0x4c = ‘L’) IF there is a matching with 'L' then we have the command group "Line" according to the protocol
                 * We are waiting 2 more bytes from the <nextion_var> and the <cnt>... (<#> <len> <cmd> <nextion_var> <cnt>)
                 * <nextion_var> is the Number of the variable on Nextion that we want to write
                 * <cnt> is the number of the text array Line that we want to store into Nextion's variable
                 * From Nextion we have sent < printh 23 04 4C 04 xx > where 04, in this example, the <nextion_var> and xx the <cnt>
                 * Same as the above, we are going to read the next 2 bytes as <uint8_t> and direct send them to
                 * < sending_text () > function as parameters to the local variables of the function 
                 * < sending_text(byte nextion_var, byte cnt) > that will be created on startup of the Function
                 */


void sending_text(byte cnt, byte nextion_var){

        /*From the Function < Nextion_serial_listen () > and <case 'L'> we have send the 2 bytes <nextion_var> and <cnt>
         * directly to this Function and run the function with the command <sending_text((uint8_t)Nextion.read(),(uint8_t)Nextion.read());> .
         * In this function we create 2 Byte local variables  and we assign the read bytes from case 'L' as their values 
         */
         
        /* From Nextion each time we press the <up> or <down> scrolling button we raise the variable on Nextion <cnt> by one cnt++ or decrease it by one cnt--
         *In this function we want to store the line from the text array that we ask with <cnt> to the variable va4 on Nextion
         * va4 is for this example we can write on every var that we will sent throw the <nextion_var>
         * the command for Nextion : va4.txt="text from the <cnt> Line of char text text[cnt]"
         */
    if(cnt < ARRAY_ROWS){
    
         Nextion.print("va");
         Nextion.print(nextion_var);
         Nextion.print(".txt=\"");
         Nextion.print(text[cnt]);
         Nextion.print("\"");
         NextionEndCommand();
    }
}


CODE SAMPLE FROM .HMI FILE

@< tm0 > is a timer with a setted time delay 300ms. It is enabled through < b1> press event and disabled by < b1 > release event. Every 300ms, it triggers the < click > command.
In the timer’s event, we write: click b1,0 click b1,1
<< click , >
is component’s .id or .objname attribute of component to refresh
1 to trigger Press Event, 0 to trigger Release Event.

The result of this is that when we hold down the < b1 > button, the text will scroll down continusly.
The same thing happens with < b0 >, only the text scrolls up continusly by < tm1 >.