Servo motor control using LCD display interface with STM32 Dev Board

Servo motor control using LCD display interface with STM32 Dev Board

This project’s aim is to design a display interface for controlling a Servo motor. The Servo angle or position is changed either by dragging or pressing the button on the LCD display interface. The interface is built on a 4.3-inch touch display and programmed using an STM32 development board.

Components Required

STONE 4.3-inch serial screen
STONE 4.3-inch serial screen

The serial screen is a type of screen that is controlled by the serial port. This screen saves a lot of time as it requires no programming and is perfect for those who use microcontrollers in designing the UI. By using this screen, you can get some common spaces through simple settings and there is no need to write the code for the UI implementation.

  • Stm32 development board (atomic f103 development board)
STM32 dev board
STM32 dev board
MG995 TowerPro Servo Motor

Designing the GUI

First of all, the interface of the serial port screen is designed. You can design a picture of the same using paint or any other similar tool. For each key effect, a particular image should be designed. For example, here I have designed separate display pictures for the separate key effect:

Original designed display picture
Original display picture

 

Picture displayed after a button press
The picture displayed after a button press

 

The original image is displayed when the screen is turned ON. In other words, it is the foreground display picture. Whereas the second picture with the corresponding position is displayed when the +ve or -ve position buttons are pressed.

This project is made by using hand to hand connections. The display, microcontroller board, and stepper motor are connected together by using jumper wires. To make this project more reliable, sturdy, and permanent, I suggest you use a custom made PCB board from PCBWay. They provide high-quality PCBs at a very low price.

To know more about how to order through PCBWay and their process, you can read –High quality and low-cost PCBs at your doorstep through PCBWay!

 

Step 1: Downloading the GUI design software

To design the GUI, download this free GUI design software from the link given below: https://www.stoneitech.com/support/download

Step 2: Create a New Project

After installing the software, open it, and create a new project. Since the resolution of the display screen is 480×272 px, select this resolution in the project details. I want to use the screen horizontally, so all other options are set to default.

Create a New project
Create a New project

 

Step 3: Add relevant images in the project

Add the designed picture you want to use in the GUI. The picture name must start with a number, although there are no special requirements for the specified number. The size of the picture should be consistent with your screen resolution, otherwise, it will prompt an error.

Here I have added the two pictures, the default or foreground display picture is named as number 2.  For this, I changed the screen settings inside the startup picture display. In this setting, the startup display picture corresponds to picture number 2.

 

Add the designed Picture
Add the designed Picture

 

Modify boot page numbering
Modify boot page numbering

 

Step 4: Add Icon Images

If your project has different types of image files, you need to create several .ico folders to store different types of icon images.

 

Add Icons
Add Icons

 

Step 5: Add a touch button area

On the right side of the interface, there is a hotkey area where you need to modify the storage address and the adjustment method. For the same operation or function of the -ve side, the storage address is made the same as the + address.

Adding a keypress area
Adding a keypress area

 

Step 6: Add a Sliding Control

Under the variable configuration column, select the slider scale. In the right column, modify the slider file and slider icon properties that you want to display over the image.

Adjust the size of the slider scale control so that it fits your scale value. But keep in mind that the icon may exceed the lower scale. So, you can control the slider scale control by adjusting the size of the slider scale control. Or adjust the offset of X coordinate to align it, try to generate a project to debug it to see if the position is suitable.

There are other properties of the sliding scale control that need to be modified: the stored address corresponds to the +ve and -ve address and the minimum and maximum scale corresponding to the scale bar at the bottom.

 

Add Sliding Control
Add Sliding Control

 

Step 7: Add drag and drop adjustment area

In the touch configuration toolbar drop-down menu, select the drag adjustment to place over the picture. Now adjusts it to the appropriate size and modify its properties. The storage address is still consistent with the above but the maximum and minimum value range needs to be adjusted.

Add drag to adjust the touch area
Add drag to adjust the touch area

 

Step 8: Adding Data Variables

Add a data variable and the data should be stored at the same address as above. This is mainly to display the data and to better observe the changes in the data.

After completing this step, you can download or run the simulation test. If there are no problems with the design of the serial screen, move on to write the microcontroller program.

 

Finished GUI
Finished GUI

 

Writing Program for the STM32 Microcontroller

I used STM32cube IDE software to write the program for the board. But before that, the configuration setting should be selected for STM32, and I’ll give a brief description of the configuration here.

  • Open tim2 ch1 channel output PWM wave. The minimum adjustment is 1us for accuracy. The servo adjustment is 0° – 270° corresponding to the pulse of 0.5ms-2.5ms. After the configuration is complete, select the output frequency of 100K PWM wave.
Configuring PWM Output
Configuring PWM Output

 

  • Open the serial port 1. Here I used the DMA, mainly a matter of habit, there is this more advanced configuration on the use of it. Get used to the future of the project also helps ah! The images given below are the screenshot of the configuration information.  And after the completion of the configuration, you can generate code.
Configuring Serial Port
Configuring Serial Port

After the configuration is completed, you have to add the code. All you have to do is add the array and the serial port receives the completion flag data.

Here we add our code to turn on the idle interrupt and DMA receive before while(1).

Adding the post-receive code handler

a) On PWM Output, Idle Interrupt, DMA Receive Code

HAL_TIM_PWM_Start(&htim2,TIM_CHANNEL_1);

HAL_UART_Receive_DMA(&huart1,buff,20);

__HAL_UART_ENABLE_IT(&huart1,UART_IT_IDLE);

 

b) Add its own receive code to the receive interrupt of serial port 1 and update the flag bits.

if(__HAL_UART_GET_FLAG(&huart1,UART_FLAG_IDLE)==SET)

{

__HAL_UART_CLEAR_IDLEFLAG(&huart1);

UART_CLEAR_IDLEFLAG(&huart1); HAL_UART_DMAStop(&huart1);




//HAL_UART_Transmit_DMA(&huart1,rx_buff,temp);

HAL_UART_Receive_DMA(&huart1,buff,20); //HAL_UART_Receive_DMA(&huart1,buff,20);

USART1_RX_STA=1;//receive completion flag

}

 

c) In a regular project, the serial port processing function should be handled separately. But we don’t do it here because our function is relatively simple.

if(USART1_RX_STA==1)

{

USART1_RX_STA=0;

if ((buff[0]==0xa5)&&(buff[1]==0x5a))

{

data=(uint16_t)(buff[7]<<8|buff[8])*15/2+500;

__HAL_TIM_SET_COMPARE(&htim2,TIM_CHANNEL_1,data);//Modify the PWM duty cycle.

}

memset(buff,0,20);

}

 

After the completion of the entire project, compile and download the code to the board. It should be noted that the screen communication connections are of 232 and TTL types. My board is not connected to 232, so it is directly connected to the IO port. Here on the screen, there are J17 solder joints that need to be welded open.

TTL selection of solder joints
TTL selection of solder joints

Once the connections are made, switch on the board and start playing!

The displayed GUI on powering the Board
Displayed GUI on powering the Board

 

Drag the icon to move the servo
Drag the icon to move the servo

 

Effect of Key press
Effect of the Keypress

Through the motor +ve/-ve or dragging the slider, the data display box data is changed, while the servo will also follow the rotation of its angle.

And the project is complete. The entire UI design is based on the picture. The MCU development was relatively simple as the serial port is used which greatly reduces the burden on the developers.

Leave a Reply

Your email address will not be published. Required fields are marked *