Posts

When developing Flutter applications, we frequently need to handle information that changes over time: the number displayed on a counter, whether the user is logged in or not, items in a shopping cart, the current app theme. This information that can change and needs to be shared across different parts of the application is what we call state. Managing state means controlling this information in an organized way: where it’s stored, how it’s modified, and how widgets are notified when it changes to update the interface. ...

When developing applications, a common need is to preserve simple data between user sessions. SharedPreferences is the ideal solution for storing small amounts of data in key-value format, such as user preferences, application settings, or simple states that need to persist. In this tutorial, we’ll implement data persistence in Flutter’s default counter application, making the counter value persist even after closing and reopening the app. What is SharedPreferences? SharedPreferences is a cross-platform API that allows you to store primitive data types persistently on the device. It works like a key-value dictionary, where you can save and retrieve data of basic types such as strings, integers, booleans, and string lists. ...

Authentication is the gateway to most modern applications. Protecting routes, personalizing the user experience, and ensuring data security are fundamental tasks. Fortunately, Firebase Authentication drastically simplifies this process. In this guide, we will build a simple Flutter application with a login screen (using email and password) and a home screen that can only be accessed after authentication. The focus is to create a solid and easy-to-understand foundation that you can implement in your own projects. ...

The need to store data in the cloud is a fundamental pillar of Internet of Things (IoT) projects. Whether for logging sensor readings, monitoring a device’s state, or creating event logs, having an accessible and scalable database is essential. The ESP32, in its various versions, combined with Google’s Firebase Firestore, forms a powerful and accessible duo for developers and hobbyists alike. In this technical tutorial, we will explore the most lightweight and universal method for sending data from an ESP32 to Firestore: using the native REST API. Instead of relying on heavy Firebase libraries, we will build HTTP requests from scratch. This approach not only saves precious memory and resources on the microcontroller but also deepens the understanding of how web APIs work. ...

In many applications, a calendar is more than just a grid of dates; it’s a scheduling tool, an event planner, or a way to visualize data over time. Although ready-made packages exist, building your own calendar widget in Flutter offers unparalleled control over its appearance, functionality, and business logic. In this tutorial, we will dive deep into the process of creating a monthly calendar widget. We’ll dissect the source code snippet by snippet, explaining the logic behind each part. At the end, we will present the complete, clean files, ready to be copied into your project. ...

We’ve reached the end of our practical journey with the WT32-SC01 Plus! Throughout the last few posts, we’ve learned how to set up the environment, draw on the screen, enable touch, and manipulate widgets. Now, we’ll combine all this knowledge to build the structure of a real application, which almost always involves more than one screen. In this final practical tutorial, we will learn how to create and manage multiple screens in SquareLine Studio and navigate between them using button events. We will create a simple two-screen application, where a button on each screen takes us to the other, demonstrating the basic navigation flow essential for any complex project, such as settings menus, information pages, etc. ...

In the previous post, we brought our interface to life by enabling touch and responding to a button event. Now that we know how to capture user interactions, the next logical step is to make those interactions modify the interface itself. In this tutorial, we will build a slightly more complex and much more practical application: a digital counter. We will create a screen with a number and two buttons, one to increment and one to decrement that number. This example is fundamental because it teaches us how to read from and write to screen widgets, an essential skill for any UI project, whether it’s displaying sensor data, adjusting settings, or any other dynamic application. ...

In the previous posts, we prepared our environment, got the WT32-SC01 Plus screen working, and even displayed our first graphical interface created with SquareLine Studio. However, our screens were still static. It’s time to bring our project to life by enabling the board’s most important feature: the touch screen. In this tutorial, we will transform our static interface into an interactive application. Our goal is to add a button to the screen and, when it’s pressed, execute an action: printing a message to the Serial Monitor. This is the fundamental step for creating any complex application, from calculators to control panels. ...

In the previous post, we took our first major step by writing “Hello World!” directly to the screen of the WT32-SC01 Plus using the LovyanGFX library. This proved that our hardware and basic communication are working. Now, let’s level up and start building real graphical interfaces. In this tutorial, we will introduce two powerful tools that will transform the way we create visual projects: the LVGL library and the SquareLine Studio design tool. Our goal will be to recreate the “Hello World!” message, but this time, the interface will be designed in a visual software and then integrated into our Arduino code. ...

In the first post of this series, we got acquainted with the WT32-SC01 Plus board and its main features. Now, it’s time to get our hands dirty and do what we love most: write code and see something happen on the screen! In this tutorial, we will set up the development environment in the Arduino IDE and create our first program: the classic “Hello World!”. The goal here is to ensure that communication with the display is working perfectly, without the complexity of UI libraries like LVGL. For this, we will use the LovyanGFX library. ...