Up next in 10
Getting started with LVGL on STM32 - PART 1 || STM32L496
49 views
Sep 30, 2023
Purchase the Products shown in this video from :: https://controllerstech.store ________________________________________________________________________________________ LVGL PART 2 :::: https://youtu.be/314AZlk_MZc LVGL STM32 Series Playlist :::: https://www.youtube.com/playlist?list=PLfIJKC1ud8ghGES4CUTjHTn_G4gly_atz STM32 Playlist :::: https://www.youtube.com/playlist?list=PLfIJKC1ud8gga7xeUUJ-bRUbeChfTOOBd DOWNLOAD THIS PROJECT FROM :::: https://controllerstech.com/lvgl-on-stm32-part-1/ ________________________________________________________________________________________ ******* SUPPORT US BY DONATING****** https://paypal.me/controllertech *******Join the Membership******* https://www.youtube.com/channel/UCkdqtSMnhYuMsJkyHOxiPZQ/join Join the Discord Server https://discord.gg/D32JE5wKyD
View Video Transcript
0:06
[Music]
0:14
hello and welcome to controllers Tech
0:17
this video is the start of a new series
0:19
on lvgl the light and versatile Graphics
0:23
library and the SDM 32 controllers in
0:27
this series we will first cover how to
0:29
implement the libr with the SDM 32
0:31
controller how to use dma and the SDM 32
0:35
inbuilt GPU and later we will use the G
0:38
to build our
0:39
applications I am going to split the
0:41
getting started video in three different
0:44
parts today's video will'll cover how to
0:47
add the lvgl to the project and how to
0:50
get the display working with the
0:51
simplest possible flushing
0:53
methods in the next video we will add
0:56
the touch interface to our
0:58
project and finally the third video will
1:01
show the use of GPU in the SDM 32
1:05
boards this series will be focused on
1:08
the 2.8 in tfd SBI display which uses
1:12
the I 9341
1:14
controller here is how the display looks
1:17
at the back in today's video I only made
1:21
the connections for the display part the
1:24
touch controller will be covered later
1:26
so I will do the connections in the next
1:29
video itself
1:31
I will show the detailed pin connection
1:33
in a while please note that this video
1:36
focuses on lvgl rather than the display
1:41
you should have a working library for
1:42
the display you are
1:44
using I will only show how to integrate
1:47
the display library with
1:49
lvgl if you have I 9341 based display
1:54
you can use this Library
1:57
itself I am going to use the nucleo 496
2:00
board for this
2:02
series I recently bought this board
2:05
because it has the support for the quad
2:06
SBI FMC
2:09
sdmmc
2:11
Etc I will cover all these peripherals
2:14
and probably you will also see some
2:16
integration with the lvgl and touch
2:19
gfx so a lot more series are going to
2:22
come in the near
2:23
future all right let's start today's
2:26
video and open the lvgl doio
2:30
click on the getting started link here
2:33
open the platform specific tutorials and
2:36
the porting guide in separate
2:39
tabs in the platform specific tutorials
2:42
they have provided the guide for the SDM
2:45
32
2:46
controllers we will follow this guide
2:49
but there are some additional things we
2:51
need from the porting guide
2:53
Also let's download the library
2:56
first by default the link will take you
2:59
to the master Branch but we will
3:01
download the version 8.3 so make sure to
3:04
change it here like I mentioned in the
3:07
beginning we will also build the
3:09
applications using the GUI the lvgl GUI
3:13
Square line Studio currently supports
3:16
the version
3:17
8.3.3 as the newest
3:19
version here I took a screenshot of the
3:23
software this is why we are downloading
3:26
version
3:27
8.3 we will talk about the sine Studio
3:30
later once we start building the
3:33
application all right the download is
3:37
complete rename the folder to
3:40
lvgl now let's create a new project in
3:43
the cube
3:44
ID I am using the nucleo L 496
3:49
board give some name to the project and
3:53
click finish let me clear the pinouts
3:56
and then configure the clock first the
3:59
clock configuration changes based on
4:01
what board you are using so I hope you
4:04
know how to configure it for your board
4:07
let's also enable the serial wire
4:09
debug now we will configure the SBI in
4:12
the full duplex
4:15
mode before we set the pins let's take a
4:19
look at the connection
4:24
again here you can see other than the
4:27
SBI pins we have three more pins CS
4:31
reset and DC I have connected the reset
4:35
and DC to the pd15 pf12 and the Cs pin
4:39
to the
4:40
pa4 these pins must be set as output
4:43
from the
4:44
MCU other pins are the SBI pins mossi
4:48
clock and miso the LCD is powered with 5
4:53
volts from the SDM 32 board itself and
4:56
the LED backlight pin is connected to
4:58
the 3.3 volt s let's configure the pins
5:02
now I am remapping the SBI pins as for
5:05
the connections made on the board and
5:08
now set the Cs reset and DC pins as
5:12
output if you are using this I 9341
5:16
Library make sure you name the pins here
5:20
we will use the SBI with 8bit data size
5:23
and the MSB should be sent first the
5:26
board rate is set to 40 megabits per
5:28
second and I am leaving it to that we
5:32
will also use the dma so enable the dma
5:35
for SBI transmit the mode should be
5:38
normal and data width should be bite in
5:42
the nvic tab enable the SBI
5:45
interrupt that's all the configuration
5:48
we need to make for now click save to
5:50
generate the project in the meantime
5:53
let's take a look at the SDM 32 porting
5:57
guide as mentioned here after creating
6:00
the project we need to copy the lvgl
6:03
folder inside the driver's folder and
6:06
then add the path to the lvgl folder in
6:08
the cc++ build settings so let's open
6:12
the project folder now go to the
6:15
driver's folder and copy the lvgl
6:18
directory here go inside the lvgl
6:21
directory copy the lvgl configuration
6:24
template file and paste it beside the
6:27
lvgl directory now rename the file to
6:30
lvgl
6:33
conference. let's go back to the cube ID
6:36
here the lvgl directory will not show up
6:39
until you refresh the project all right
6:42
we have the directory and the
6:44
configuration file now right click on
6:47
the project and go to properties go to C
6:51
C++ build and then settings here click
6:55
on include paths we will add the lvgl
6:59
direct to this list so slick add choose
7:02
workspace and locate the lvgl folder
7:06
click apply and close to save the
7:11
changes now open the configuration file
7:14
and change this if0 to if1 to enable
7:17
this
7:18
configuration this file contains all the
7:20
configuration needed for the lvgl to
7:23
work for example this is the color depth
7:26
of the display which is set to 16 for
7:29
the GB 565 types the memory size for the
7:33
allocation is set to 48 kiloby but you
7:36
can change it as per your need it needs
7:39
to be greater than 2
7:41
kiloby you can read this file its
7:44
details are mentioned on the lvgl
7:46
porting guide and make changes as per
7:48
the requirement or
7:50
limitations I have enough memory on this
7:52
board so I am leaving everything to
7:55
default now we will include the display
7:58
libraries to our project I have the
8:01
files for I
8:03
9341 and this xpt2046 is the touch
8:07
driver which we will deal with in the
8:09
next video copy the C file in the source
8:12
directory and head a file in the include
8:16
directory I have made few modifications
8:18
to this Library so that it can be used
8:21
with any microcontroller that has the
8:23
SBI peripheral all you need to do is
8:26
change some functions like how the MCU
8:29
sends the data via the SBI the delay
8:32
function and the functions to set and
8:34
reset the respective
8:36
pins if you are using some other
8:38
external display you need to at least
8:41
have two functions for the lvgl to work
8:44
the first function you need to have is
8:47
for setting the window and the second
8:49
function to draw the bit map mostly all
8:52
display libraries have these functions
8:55
so it shouldn't be that hard to
8:57
find I have added one additional
8:59
function here to draw the bit map by
9:02
using the
9:03
dma further in the video I will cover
9:06
the flushing with the dma and without
9:09
the
9:10
dma now we have the display Library so
9:13
we need to connect it to the
9:15
lvgl let's create a new source file and
9:19
name it as LCD controller. C also create
9:23
a header file for the
9:25
same this file will contain the display
9:28
driver for the lvgl and we will connect
9:31
the drivers to the I
9:35
9341 here in the guide they have
9:37
mentioned how to do it but to simplify
9:41
it more we will use a template for it in
9:44
the porting guide click on the display
9:48
interface go towards the bottom of the
9:50
page and here you will find the link to
9:53
the
9:54
template here you can see the templates
9:57
for the display for file system and
10:00
there is one for the input driver
10:02
also before we continue with this make
10:05
sure you choose the correct version of
10:07
the
10:08
lvgl or right now copy the template
10:11
source file in the LCD
10:13
controller also copy the header file in
10:16
the respective
10:22
location let me delete these
10:28
conditions
10:34
all right let's include the LCD
10:36
controller header file here also include
10:39
the main header file and the display
10:42
header file next we need to define the
10:45
display resolution to remove These
10:51
Warnings all right let's understand
10:54
these
10:56
functions we have the LV Port display
10:59
function which initializes the lvgl
11:02
display driver inside this function we
11:05
have the display initialization function
11:08
where we need to initialize our
11:09
connected display let's call the I 9341
11:14
initialization here next we create a
11:17
buffer for drawing the template file
11:19
lists three different methods of doing
11:22
so the first method creates a single
11:25
buffer lvgl will draw the display
11:29
content to this buffer and then write it
11:31
to the display this is the slowest but
11:34
easiest method to flush the content to
11:37
the display the second example uses two
11:40
buffers in this method the lvgl draws
11:44
the content into one buffer while the
11:46
other buffer is being sent to the
11:48
display this method makes the rendering
11:50
and flushing parallel to each other we
11:53
should use the dma while using example
11:56
two the third example uses is two screen
12:00
size buffers and this is used for the
12:02
full refresh this example should only be
12:05
used if you are using a display which is
12:07
attached to the board or is connected in
12:10
parallel mode and not via the serial
12:13
Link in this video we will use the first
12:16
two
12:17
examples I will cover the third example
12:20
in another video where I will use either
12:22
SDM 32 board with an attached LCD or a
12:26
rivy stdm 32 display
12:29
let's start with the first method here
12:33
buffer one is defined with the size of
12:35
10
12:36
rows this means that flushing will take
12:39
place with 10 rows at a
12:41
time next step is to register the
12:44
display
12:45
driver let's define this descriptor as a
12:48
global variable as we would need it for
12:50
the dma call
12:56
back here first the display driver is
13:01
initialized then we set the resolution
13:03
of the
13:04
display set the flush call back set the
13:07
display buffer and finally register the
13:09
display driver the flush callback is
13:13
used to flush the content of the buffer
13:15
to the
13:16
display this is the most important
13:18
function in this file we can simply
13:21
write each pixel at a time or write a
13:24
bunch of rows at once or we can also use
13:26
dma or GPU to send the content to the
13:30
display once the flushing is over we
13:33
should call the LV display flush ready
13:35
function to inform the library that the
13:37
previous operation is over and we are
13:40
ready for another flush in example one
13:43
we are going to flush 10 rows at a time
13:47
let's take a look at the stm32 guide
13:50
again here is an example of how to do
13:53
the
13:54
flushing we will just copy this part
13:57
from here
14:11
basically we will set the drawing region
14:13
first and then calculate the width and
14:16
height of the
14:19
region now we will call the draw bitmap
14:22
function to actually send the data to
14:24
the
14:25
display once the data has been sent call
14:28
the LV display ready function to
14:30
indicate that we are ready for next
14:35
flush all right let's build the project
14:40
now there is an error in the LCD
14:43
controller file it should have been lvgl
14:53
Doh we don't have any errors
14:57
now
14:59
go to the main file and include the lvgl
15:02
header
15:04
file we need to call the timer Handler
15:07
every 5 milliseconds as mentioned in the
15:16
guide also call the LV tick function
15:19
inside the cystic Handler so open the
15:22
interrupt source file and include the
15:25
lvgl header file here now put the l v
15:29
tick function in the cystic Handler in
15:32
the main file include the LCD controller
15:35
header
15:40
file now first initialize the lvgl by
15:44
calling LV in it then initialize the
15:47
display driver this completes the lvgl
15:51
integration with our project now we need
15:54
to display something on the
15:56
LCD I am just copying the test code
15:59
given in the stdm 32 guide let's put it
16:03
here after the initialization is over
16:06
all right let's build and Flash it to
16:08
the
16:14
board here you can see the background
16:17
color has changed and the spinner is
16:19
rotating just fine so we got the lvgl to
16:23
work with this board and the display now
16:26
let's do some Benchmark Tes ing go to
16:30
the lvgl configuration file and search
16:33
for Benchmark it is disabled by default
16:37
so let's enable it by setting this to
16:41
one let's comment out this part and call
16:44
the LV demo Benchmark
16:47
function let's build the code
16:51
now we need to include the Benchmark
16:53
header file also it is located under
16:57
lvgl demo Benchmark all right the code
17:01
builds fine again let's flash it to the
17:12
board I will fast forward this part and
17:15
we will see the results in the
17:27
end
17:40
overall I got 9 FPS with the current
17:44
settings actually this list is quite
17:46
long but in order to scroll it we need
17:49
the touch support now we will use the
17:52
double buffer with the dma and see if
17:54
there is any Improvement I am commenting
17:57
out the example example one and
17:59
including the example two here we have
18:02
the two buffers buffer 1 and buffer 2
18:06
there is enough RAM on this controller
18:08
so I am changing the buffer size to 80
18:11
rows you can read more about these
18:13
buffer modes in the lvgl
18:18
documentation we need to change the
18:20
buffer descriptor in the
18:22
driver this time we are using the buffer
18:25
descriptor 2 inside the display function
18:28
call back instead of sending data
18:31
directly to the display we will use the
18:33
dma for the same make sure to comment
18:36
out the display flush ready function
18:39
here once the dma finishes the transfer
18:42
the SBI transmit call back will be
18:45
called we will write this call back in
18:47
our LCD controller file itself here we
18:51
will call the display flush ready
18:53
function to inform the library that the
18:55
transfer is finished and it can initiate
18:58
a new
18:59
transfer also in the I 9341 file there
19:03
is a function end of draw bitmap in case
19:06
you want to perform some operations on
19:08
the display after drawing the bit map
19:11
you can call the function from here
19:14
itself I am not doing any operations so
19:17
I am commenting it out we should pass
19:21
the address of the display driver
19:22
descriptor
19:27
here
19:29
in the main file we are still performing
19:31
the benchmark
19:33
test let's flash it to the board now I
19:37
will now share the pictures of some
19:38
Benchmark tests I performed which will
19:41
help you understand that using dma does
19:43
improve the performance a little this is
19:46
it for the
19:47
video I hope you understood how to
19:50
integrate lvgl in the stm32
19:53
project in the next video we will
19:56
include the touch driver for this
19:59
display the link to download the code is
20:02
in the description of the video leave
20:05
comments in case of any doubt keep
20:08
watching and have a nice day
20:24
ahead
#Programming
#Software