Skip to content

14. Interface and application programming

Group assignment:

  • Compare as many tool options as possible

To see our group assignment click here

Individual assignment:

  • Write an application that interfaces a user with input and/or output device(s) on a board that you made.

APPLICATION PROGRAMMING

For this week, we decided to develop an application for our final project. For this we used FLUTTERFLOW and flutter framework on VScode sofware, a free online website.

To get started, we’ll open flutterflow, register and start building our application interface as shown below.

After our registration we are ready to create our project. On the left we have the menu for work organization and profile. To start our project, we’ll click on the right as shown in the image.

We now need to name our project, and we’re ready to continue.

We can choose the colors for our application and then continue

After creating our different pages we can see the interconnections you have made the back-end programming on VScode with the flutter framework.

COMMUNICATION

For communication, we used the http protocol. To do this, we’re using the arduiuno IDE and library software we’ve already installed for previous projects. Please follow the steps in the images below:

Now we need to copy the link of our application in its place.

To complete the connection, we need to set the reference of our wi-fi access point.

  • HTTP Request Configuration
AsyncHTTPSRequest request;

An instance of the AsyncHTTPSRequest class is created to handle asynchronous HTTP requests.

  • Definition of the Request Callback Function
void requestCB(void *optParm, AsyncHTTPSRequest *request, int readyState)
{
  //...
}

This function is called whenever the state of the request changes. It receives three parameters: an optional pointer, a pointer to the AsyncHTTPSRequest object, and the current state of the request.

  • Sending the Request
void sendRequest(float temp)
{
  //...
}

This function constructs the request URL based on the measured temperature and sends the HTTP GET request to the remote server.

  • Processing the Response

In the requestCB callback function, the server’s response is parsed. If the response code is 200, it means the request was successful. Otherwise, an error is reported.

  • Integration into the Main Loop
void loop()
{
  //...
}

In the main loop, when the temperature variable is true, the temperature is measured, and an HTTP request is sent to transmit it to the remote server.

How the module acts on application data

  • 1 : When the application is open and a shot is taken on the module, the new data can be seen directly on the home page. To see the details of the shot, the user must click on “see more” (voir plus) where it says recent constant shots(prise de constante recentes).

  • 2 : For the moment, our modukle only acts on temperature because it’s the only sensor at our disposal.

  • 3 : And now it’s able to see the temperature taken.

other examples

  • 28°C for this temperature taken

  • 33°C for this temperature taken

  • 32°C for this temperature taken

MOVIE

Assamblage box

FILES

Last update: November 3, 2024