Mobile application development It is the process of building applications for mobile devices such as smartphones and tablets. Generally, mobile applications are harder to develop than web applications because they have to be designed from scratch, while web development shares common code on different devices.
Each operating system has its own language for encoding Native application (One created with technology specifically used for a specific platform). For example, Android uses Java, while iOS uses Swift. In general, it is best to use specialized technologies for applications that require high performance, such as games or heavy animations. on the contrary, Hybrid applications Use a cross-platform language (i.e. Python) that can run on multiple operating systems.
Mobile application development is highly relevant to AI because it can integrate new technologies into people’s daily lives. Now, LLMs are so popular because they have been deployed into user-friendly apps on your phone and are easily accessible anytime, anywhere.
Through this tutorial, I will explain How to build cross-platform mobile applications with Python,,,,, Take my memory app as an example (link to full code at the end of the article).
set up
I want to use Kivy Frameworkthis is the most commonly used mobile development in the Python community. Kivie is an open source software package for mobile applications, and Kivymd It is using Google’s library Material Design And make use of this framework easier (similar to Bootstrap of Web Dev).
## for development
pip install kivy==2.0.0
pip install kivymd==0.104.2
## for deployment
pip install Cython==0.29.27
pip install kivy-ios==1.2.1The first thing is to create 2 files:
- main.py (must be this name), which contains the Python code for the application, basically the backend
- Components (You can call it differently) will include all Kivie Code for application layout, which you can think of as a frontend
Then, in main.py Files We import the package to initialize an empty application:
from kivymd.app import MDApp
class App(MDApp):
def build(self):
self.theme_cls.theme_style = "Light"
return 0
if __name__ == "__main__":
App().run()Before I start, I will briefly describe the application I am building. This is a simple application that helps remember content: the user inserts a pair of words (i.e. something in English, the equivalent language of another language, or date and historical events related to it). The user can then try to remember the shuffle information to play the game. Actually, I’m using it to remember Chinese vocabulary.
As you can see from the image, I will include:
- Introduction to display the logo
- Can be redirected to the home screen of other screens
- Save words on the screen
- View and delete stored information screens
- Play games on the screen.
So we can write them all in Components document:
To include Kivie In the file in the application, we need to main.py Use the Builder class when the screen class links the screen between two files.
from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.uix.screenmanager import Screen
class App(MDApp):
def build(self):
self.theme_cls.theme_style = "Light"
return Builder.load_file("components.kv")
class IntroScreen(Screen):
pass
class HomeScreen(Screen):
pass
class PlayScreen(Screen):
pass
class SaveScreen(Screen):
pass
class EditScreen(Screen):
pass
if __name__ == "__main__":
App().run()Note that even if the app itself is basic, there is a very tricky feature: DB management through mobile phone. This is why we will also use native Python packages for databases:
import sqlite3Development – Basics
We want to warm up Introduction Screen: It contains only one image logo, some text tags and a button that can be moved to another screen.
I think this is easy because it doesn’t require any python code, which can be done by Components document. The screen changes triggered by the button must be linked to the root like this:
The same is true Home screen: Since it’s just a redirect, it can be done through Kivie Code. You only need to specify that the screen must have 1 icon and 3 buttons.
You may have noticed that there is a “home” icon at the top of the screen. Note that there is a difference between a simple icon and an icon button: the latter is pushable. On this screen, it’s just a simple icon, but on other screens, it will be an icon button that brings you back from any other screen of the app back to the home screen.
When we use icons, we have to provide the label (i.e. “Home” shows a small house). I found this code very useful, just run it and it will display all the icons available.
Development – Advanced
Let’s strengthen the game and pass Save the screen. It must allow the user to save different words for different categories (i.e., to learn multiple languages). This means:
- Select an existing category (i.e. Chinese), so please check the existing category
- Create a new category (i.e. French)
- Two text inputs (i.e. one word and its translation)
- A button to save the table, so write a new row in the database.
The database must be created when you first run the application. We can do this in the main functions of the application. For convenience, I’ll also add another feature that uses any SQL query database you pass.
class App(MDApp):
def query_db(self, q, data=False):
conn = sqlite3.connect("db.db")
db = conn.cursor()
db.execute(q)
if data is True:
lst_tuples_rows = db.fetchall()
conn.commit()
conn.close()
return lst_tuples_rows if data is True else None
def build(self):
self.theme_cls.theme_style = "Light"
q = "CREATE TABLE if not exists SAVED (category text, left
text, right text, unique (category,left,right))"
self.query_db(q)
return Builder.load_file("components.kv")The tricky part is the DB icon, which when pushed, shows all existing categories and allows one to be selected. exist Components File, under the save screen (named “save”), We add an icon button (named “category_dropdown_save”) If pressed, Python will be launched dropdown_save() Features of the main application.
This function is main.py File and return to the drop-down menu so that when the item is pressed, it will be assigned to a named “category”.
The last line of code link category Variable with tags appearing in the front end. Screen Manager with get_screen() And pass ID:
When the user enters the save screen, category The variable should be Invalid Until one is selected. When a person enters and leaves, we can specify the properties of the screen. So I’ll add a function with a blank variable in the screen class.
class SaveScreen(Screen):
def on_enter(self):
App.category = ''After selecting a category, the user can insert additional text inputs that are required to save the form (by pressing a button).
To make sure the function cannot be saved, I will use the dialog if one of the inputs is empty.
from kivymd.uix.dialog import MDDialog
class App(MDApp):
dialog = None
def alert_dialog(self, txt):
if not self.dialog:
self.dialog = MDDialog(text=txt)
self.dialog.open()
self.dialog = None
def save(self):
self.category = self.root.get_screen('save').ids.category.text
if self.category == '' else self.category
left = self.root.get_screen('save').ids.left_input.text
right = self.root.get_screen('save').ids.right_input.text
if "" in [self.category.strip(), left.strip(), right.strip()]:
self.alert_dialog("Fields are required")
else:
q = f"INSERT INTO SAVED VALUES('{self.category}',
'{left}','{right}')"
self.query_db(q)
self.alert_dialog("Saved")
self.root.get_screen('save').ids.left_input.text = ''
self.root.get_screen('save').ids.right_input.text = ''
self.category = ''So far, I’m confident that you can browse the full code and understand what’s going on. The logic of other screens is very similar.
test
You can iOS emulator on MacBookthis can copy the iPhone environment without the need for a physical iOS device.
XCode needs to be installed. First open the terminal and run the following command (the last command takes about 30 minutes):
brew install autoconf automake libtool pkg-config
brew link libtool
toolchain build kivyNow determine your application name and use it to create the repository and open it.Xcodeproj document:
toolchain create yourappname ~/some/path/directory
open yourappname-ios/yourappname.xcodeproj
Finally, if you use iOS and want to test the app on your phone and then publish it in the app store, Apple requires you to pay for the developer account.
in conclusion
This article is a proof tutorial How to design and build cross-platform mobile applications with Python. I’ve used it Kivie To design the user interface, I showed how to make it for iOS devices. Now you can use Python and Kivie.
The complete code of this article: github
Hope you like it! Please feel free to contact me for questions and feedback, or just share your interesting projects.
👉 Let’s connect 👈
(Unless otherwise stated, all images are by the author
