How to Create a Stopwatch/Timer Android App With Delphi For Python?

Delphi is a popular development environment for building Windows and mobile applications. It has a rich set of libraries and tools that make it easy to create cross-platform apps. Delphi for Python is an extension of Delphi that allows you to use supercharge Python to build attractive applications. This tutorial will show you how to create a stopwatch/timer Android app using Delphi for Python.

Why Use Delphi For Python?

Delphi for Python is a set of powerful tools that can benefit Python developers who want to create Graphical User Interfaces (GUIs) quickly and easily. These tools provide cross-platform support, allowing GUIs to work on various devices without writing separate code for each platform. For instance, Delphi for Python offers access to the FireMonkey GUI framework, a powerful and flexible tool for creating GUIs, providing sophisticated and visually appealing user interfaces. 

Additionally, Python developers can use Delphi’s UI design tools to design their GUIs by utilizing the Delphi4PythonExporter tool, which can speed up the development process and ensure the resulting GUIs are functional and visually appealing. Finally, Delphi Community Edition and PythonFMXBuilder are open-source tools ideal for developers who prefer open-source tools whenever possible. Delphi for Python is a great solution for Python developers to streamline the development process and ensure that their applications work well on all platforms.

How to Create a Stopwatch/Timer App For Desktop?

Let’s create a basic timer and stopwatch application for desktop devices! A good approach would be to use the Delphi tools mentioned above. So let’s get started!

What Are the Requirements to Create this App?

To proceed with this tutorial, you will need the latest version of Python, PythonFMXBuilder, Delphi4PythonExporter, Delphi, and any text editor or IDE (PyScripter is recommended) that supports Python.

We’ve got you covered if you don’t have these installed on your device. We recommend checking out this article, “Powerful Python GUI Project Setup”, to help you get started.

You can grab the code for this tutorial from our GitHub repository using the following link: https://github.com/Embarcadero/PythonBlogExamples/tree/main/Time_Widget_App

How to Create its Forms in Delphi CE?

Open Delphi CE and create a blank application by navigating to File > New > Multi-Device Application > Blank Application > Ok. Here we have named our project StopwatchTimerApp.

To understand what each section of the above Delphi IDE means/represents, please go through the free eBook bundle, we have developed. This eBook explains the ideology around Delphi Python EcoSystem, all Python GUI offerings, and much more.

Let’s start by giving our form a name. Right-click on the form and click on QuickEdit. Here we will name our form MainForm with the caption MainMenu.

Next, let’s resize our form. Head to the object inspector, and in the properties tab, search for ClientHeight and ClientWidth. We will set them as 500 and 360, respectively.

We will also rename the source file of our main form to MainMenu.pas to make it easy to keep track of.

As you may have guessed, this is the main form of our app. It will serve as the main screen where users can select the option of a timer or stopwatch. To make it more user-friendly, let us add a label that will greet us with the title of our app. Head over to the standard palette and search for the TLabel component. Next, drag and drop the component into the form.

Now, let’s change the text style to display the title. We will do this using TextSettings. Head over to the Object Inspector and search for TextSettings. Select Font under it and click on the ... to see options allowing you to change the label font, size, and style according to your needs.

Now rename the text of each label by right-clicking on that label and selecting Quick Edit. It is important to follow an intuitive naming convention to name the labels so that it is easier to track them. Here, we named our TLabel component Title with the text “Time Widget App.”

We can change the form’s background color by navigating to the Object Inspector and selecting the form’s fill property.

Finally, we need a way to navigate to the next form, either a timer or a stopwatch. So, go to the Palette and add two buttons using the TButton component.

These buttons will help us navigate to our Stopwatch or Timer screen. So let’s name these buttons appropriately. Moreover, we have changed these button text’s font size and style (as we did for the TLabels above) to make them more prominent. Here we have to use the font style as Segoe UI. We have also aligned the text to the Center, the same as the Title label above, so the text appears symmetric.

After these changes, our form will look much more visually attractive:

Double-click on each button to create an OnClick method in your .pas file corresponding to your .fmx for each button. This will allow you to add different functionality when a button is clicked.

Add at least one comment (//) after each button OnClick method to ensure that each procedure is preserved when we save the Python file. Since we don’t export the run-time implementation using the Delphi4PythonExporter, there is no need to write any run-time implementation code.

Now that we are done with the MainForm of our app let’s create a new form that will display our timer. So right-click on TimerStopwatchApp.exe and select Add New > Multi-Device Form.

This will create a new form named TimerForm and the source file as Timer.pas.

Like our MainForm let’s add some buttons and labels to our TimerForm to make it more visually appealing.

As you can see, we have added two extra labels, the Time label, and the Status label. The Time label will help countdown the time, whereas the Status label will help display different messages to the user.

In addition, we added a TEdit box that will help the user specify the time to set in the Timer app. We also added a Back button that will help us navigate back to the MainForm, and a combo box that will help us load predefined times that the user may have for certain tasks.

Next, we must add a system component called TTimer to the form. So head to the command palette, search for the TTimer component, and add it to your form. This component will enable us to either count up or count down from a selected time by simply enabling or disabling the module.

Here is what our TimerForm looks like:

Lastly, we need to add procedures to our combo box and edit box, that will change the values of the timer when they are changed. To add these procedures, select the object and head to the Events tab in the Object Inspector. Here search for the OnChange event, and add the name of your relevant function. Delphi automatically creates a function you can manipulate to your choosing. Here we are adding a procedure called SetOtherTime for the TEdit Box:

Like our MainForm, double-click on each button on the form to create an OnClick method for each button. Finally, add at least a single comment for each procedure to ensure that the method is preserved when we finally export the Python code.

Now that we have our TimerForm ready, we can create our StopwatchForm. So following the same process as before, we can create a new form and add relevant Labels and buttons to make it more appealing. Moreover, like before, we add a TTimer module that will help us run our stopwatch. Here is what our final form looks like:

Now that our forms are ready, we can also see how our app appears on desktop and Android phones. Switch the Style from Windows to Android to verify this. This will alter how our form appears.

How to Export this App as Python Code?

Now that our forms are ready, we can save our project as a Python script by selecting Tools > Export To Python > Export Current Entire Project.

This will open up the Python Exporter. Here rename your project to StopwatchTimerApp, and select the main form as MainForm. Finally, select the directory of your choosing and click Export:

Delphi will generate a total of 7 files, 4 Python scripts named MainMenu.py, Stopwatch.py, Timer.py, and StopwatchTimerApp.py. The MainMenu, Stopwatch, and Timer python files contain the classes for the individual forms, and the StopwatchTimerApp is used to launch our Delphi app. 

Along with each Python file, Delphi also generates a .pyfmx script containing each form’s visual information.

Let’s take a look at the exported StopwatchTimerApp.py file.

Next, let’s take a look at the contents of MainMenu.py that contains information about our MainForm:

Here are the contents of Timer.py where we will be adding code to run our timer:

Finally, let’s take a look at Stopwatch.py, which we will use to run our stopwatch:

Can I Add Functionality to This App Using Delphi FMX?

Now that our forms are ready, let’s start adding functionality to our forms.

What Should I do in My MainForm?

Let’s start with the MainForm. Go to your Project folder and open up MainMenu.py.

For our MainForm the only thing we need to do is open up the StopwatchForm or the TimerForm using the relevant buttons. To do this, first import the StopwatchForm and TimerForm from the Python files:

Next, navigate to the StopwatchFormButtonClick function and create a new instance of the StopwatchForm with a variable named self.StopwatchWindow. Next, display the new form using the show() method. We can repeat the same approach for the TimerFormButtonClick. Here what our final MainMenu.py looks like this:

How Can I Add Functionality to My StopwatchForm?

Now, let’s take a look at StopwatchForm.

Recall, that the Time label we created in the form was to display the time. So in the __init__ function, we need to initialize the Time label using the .Text property as follows:

Now, let’s take a look start button. The start button should start the stopwatch. We can do this by navigating to the StartClick function and setting the Timer1 object as enabled. We also define the Timer1.Interval as 10 milliseconds. Our StartClick function looks like:

Similarly our pause button should pause our timer. So navigate to the PauseClick function and simply set Timer1.Enabled as False:

Finally, our reset button disables the timer and resets the Time label. We also update the timer tag to 0, which will help us keep track of the timer. Here is what our ResetClick function looks like:

Now, we need to define our Back button. Luckily, with Delphi, we must destroy the current form and simply show the Application.MainForm, which is defined as our MainForm. Our BackClick function looks like:

Finally, we must update our Timer at every interval. To do this, we will define our Timer1Timer function. Start by initializing a variable and adding the Timer1.Tag and the Timer1.Interval to the variable:

Next, we need to calculate the minutes, seconds, and milliseconds in the ElapsedTime variable. We do this using the following code:

Finally, we can display the time elapsed so far using the .Text property of our Time label. We also update the Timer1.Tag to the elapsed time so far. Here is what our Timer1Timer function looks like:

So our final Stopwatch.py file has the following code:

What Should I Add to My Timer Form to Make it Function?

Now that our StopwatchForm is ready, let’s define our final form, i.e., TimerForm. Start by opening Time.py in your project directory and navigating to the __init__ function.

Similar to the StopwatchForm, let’s start by initializing our Time label as “00:00:00” and making our Status label empty:

Next, let’s add a few predefined items into our combo box. These items will define a preset timer for each task:

Now, disable all the buttons and edit boxes in our form. These will remain disabled until the user selects some element task from the combo box:

Finally, define a self.CountdownTime variable to store the time value for our timer. Here is what our final __init__ function looks like:

Next, we define our StartClick, PauseClick, ResetClick, and BackClick functions similar to what we did for the StopwatchForm:

Now, we define our ComboSelected function. Our combo box allows the user to select one of three options, “Brush Teeth“, “Boil Eggs“, or “Other“. If the user selects “Brush Teeth“, a timer of 2 minutes is automatically set. Similarly, if the user selects “Boil Eggs“, a timer of 5 minutes is set. But if the user selects “Other“, we enable the TimeDuration edit box and allow the user to write down the time of his choosing. Here is what our final function looks like:

Next, we define our TimeDuration edit box. If a user wants to define his time, we need to create a function that updates the time for our Timer. Luckily, we defined a function called SetOtherTime when we created our form that precisely does this. 

First, we need to check whether the time input has exactly two colons that give the time in a minute:second:millisecond format:

Next, we extract the total minutes, seconds, and milliseconds from the given time and convert them into milliseconds. We then store it in our Timer1.Tag variable and set all the buttons as enabled. If the user does not enter the correct time in the correct format, we display an error using the Status label. Here is what our final SetOtherTime function looks like:

Finally, we can define the Timer1Timer function exactly how we defined it for our StopwatchForm, with minor changes. Firstly, we need a way to stop our timer because we return in time. To do this, we use an if block that checks whether the ElapsedTime is still greater than 0. If it goes below 0, we display a “Timer Ended!” message in our Status label. We also update Time.Text and disable the Timer1 object. Our Timer1Timer function is as follows:

Here is what our final Timer.py file looks like:

What Results Does Testing This Desktop App Give?

Now that code is ready; we can run our app by executing StopwatchTimerApp.py. Here is what our app looks like:

We can even navigate to the different forms by clicking on each button. Here is what our StopwatchForm looks like:

And here is what our TimerForm looks like:

How to Create a Stopwatch/TimerApp For Android?

Now that we have our time widget application ready, let’s convert this into an Android application.

The Delphi4Python Exporter exports TimerStopwatchApp with initialization logic for a desktop-based application. Therefore, we will use the PythonFMXBuilder to convert it to an Android app. 

So, open FMXBuilder and click Project > New project on the toolbar. Enter the name of the project that you want to build here. Here we define our project as StopwatchTimerApp.

Before we can add our Python files, we need to change some code that will allow us to run our project on Android. Let’s create a new file named StopwatchTimerApp_Android.py and paste the contents of StopwatchTimerApp.py.

Next, add your Python files and other supporting project files you used to build your application. Here we will not be adding StopwatchTimerApp.py as it will only be used to run our desktop application:

Now, right-click on TimerStopwatchApp_Android.py file and set it to the main file. But before we can build an .apk, let’s make important changes to our code. 

First off, Android applications are initialized automatically by Delphi applications. Because the program will be initialized automatically, we don’t need to initialize it or set a title manually. The Application.MainForm doesn’t need to be initialized either but just needs a variable. Lastly, like initialization, we don’t need to launch or destroy the program because Android handles both tasks.

Our StopwatchTimerApp_Android.py looks like:

Save the file with the code changes you’ve just made.

With PythonFMX Builder for Android, you can create an android application package file (.apk) or have it directly installed on your Android phone. To install the app directly on your mobile device, first, connect your android phone to your device and enable USB debugging on your phone. Next, click on the reload button on the top right corner. If your device is connected, you will see it appear on the drop-down menu.

Finally, select your device and click on Run Project:

This will install the app directly on your Android phone and run it.

What Results Does Testing This Android App Give?

Here is what our StopwatchTimerApp looks like on an Android device:

When we click on the Stopwatch or Timer button, we are taken to the next form:

Now we can select the options available in the combo box. Here we select the “Other” option:

Once we select the “Other” option, the Edit box allows us to set the time. We can then Start, Pause, or Reset the Timer.

We can even navigate to the StopwatchForm and Start, Pause, or Reset our Stopwatch.

Do You Want to Create More Apps Like This?

Congratulations on completing this tutorial! We hope you found it helpful to understand how to use Python GUI development tools to create desktop applications. With the help of DelphiFMX and other Delphi tools, you can easily create cross-platform applications that work on various devices, thanks to their user-friendly interface and powerful functionality. Whether you’re a seasoned programmer or just starting with Python, building a stopwatch or timer application is an excellent way to hone your skills and expand your knowledge. 

So, why not download Delphi and start creating your own Python-based Desktop and Android apps today?

What Are Some FAQs About Delphi For Python?

What is Delphi for Python?

Delphi for Python is a tool that allows developers to create Python-based applications using the Delphi programming language. It provides a seamless integration between Delphi and Python, enabling developers to use the powerful features of both languages to create high-performance applications.

What is a time widget Android app?

It is an application that can be used to measure time intervals. It allows users to start and stop a timer and receive alerts when the time is up. These apps are commonly used in sports, cooking, and other activities that require accurate time measurement.

Why use Delphi for Python to create a Stopwatch/Timer Android app?

Delphi for Python provides a powerful and intuitive development environment for creating Android apps. It allows developers to leverage the strengths of both Delphi and Python to create high-performance and feature-rich applications quickly and easily.

What are the basic steps to create a Stopwatch/Timer Android app with Delphi for Python?

The basic steps to create a Stopwatch/Timer Android app with Delphi for Python include creating a new project in Delphi, adding the necessary components and controls, writing the code to implement the timer functionality, and deploying the app to an Android device.

Are there any limitations to creating a Stopwatch/Timer Android app with Delphi for Python?

There are no significant limitations to creating a Stopwatch/Timer Android app with Delphi for Python. However, developers may need to be familiar with Delphi and Python to create a fully functional and feature-rich app. Additionally, some advanced features may require additional third-party libraries or components.