Python Projects ~ Build Mobile App With Python ~ App Development From Scratch

hello everyone welcome back in our another python project and in this python project we are going to create a complete mobile phone application using python kv

Yes guys in this python project we are going to create this calculator using python.

We can download this application in our mobile phone.

We can install this application and also we can use this application for our regular calculation.

And in this python project we are going to see how to build a complete mobile phone application completely from scratch using python kv.

and if you are a beginner then don't worry guys i will show you every process step by step but before we start our this python project if you guys are new in my channel then please please subscribe like this video and press the bell icon for the future videos and if you guys have any question about this video please let me know in my comment section

okay we are going to create this python application using python kv and if you guys don't know what is kv kv is an open source python library for rapid deployment of applications that make use of innovative user interface such as multi-touch apps and this library is so helpful because it is cross-platform business friendly and gpu accelerated

Now for creating this application you don't need to be a pro.

I will show you every process step by step.

And here is the important thing.

Please guys don't skip this tutorial.

Because if you miss something then your app or your application will not work.

That's why guys pay attention throughout this entire video.

And now together let's create a mobile phone application.

open your favorite code editor in my case i am using pycharm and in your code editor create a project folder or you can say a file directory like this one i have created a file directory name as calculator now simply click write new and then click python file now you have to add a name and my file name will be main dot pi and then type enter

and after creating your project folder and your python file now we have to install kv in our computer and there are many ways to install kv if you want to install kv using your cmd then in your cmd you just have to type pip install kv and then type enter and in a few moments kv will be installed in your computer

and in my case here you can see that i have already installed kv module in our computer now there is another way to install kv and that is just go to the file and then go to setting and then here you will find your project folder name so my project folder name is calculator so just open this folder and here you will find a project interpreter now double click

on this project interpreter.

And here you will find all the installed libraries in your computer.

Now for installing KV in your computer just click this plus icon.

And then here you have to search by KV.

And here you can see that we have a KV module.

Now select this module.

And then simply click on install package.

After clicking on this button, your KV module will be installed in your computer.

Since I have already installed this in my computer, I don't have to install this anymore.

Okay, after successfully installing KV module in our computer, now we have to initialize or you can say we have to add some components from our KV.

And here you can see that I have imported some components from our KV.

Here you can see that from KV.app I am going to import the app module.

And from KV.UIX.box layout I am going to import box layout.

And from our KV.UIX.button I am going to import our buttons.

because in our calculator we have to add so many buttons and from our kv dot uix dot text input input text input okay after importing all the necessary components now we have to start creating our application so for creating our application using kv first we have to define a class so that's why class and then we have to add a class name you can choose any class name you want

and i will be choosing main app and inside our main app parameter we have to call our app which we have imported from our kb.app okay and inside this class we have to define a constructor so def then we have to add a constructor name and it will be build and inside this build parameter we are going to pass our self okay

inside this constructor we have to create some variables and all those variables will be responsible by our self so each time we declare a new variable first we have to add the self okay suppose i want to create a new variable called operators and inside this operators variable i am going to add our all the operators like division multiplication addition etc

and i'm going to add all these operators inside a array so for defining an array just add these brackets first i'm going to add the division then i'm going to add the multiplication then i'm going to add the addition and at last substraction that's it

now here you can see that we have created a new variables which is operators and inside this operators variable I am going to add our all the operators now each time we create a new variable our that variable will be responsible by the self so that's why we have to add self

that's it okay here you can see that we have created a class we have defined a constructor and inside this constructor we have created a variable and inside this class we are going to create few more constructor like this one and after creating all the constructors and functions we have to run this app so for running this app

have to use if double underscore name double equal to double underscore main and our app will be main app then we have to run our app guys here you can see that we have imported some libraries we are creating our application and then we are running our application now let's run this program and see

what we can have as an output now let's go to our run and click run from here and then select main and here you can see that our cavi module is running and here you can see that we have a black screen and inside this black screen we are going to create our application

okay for now close our this application and now inside our this class we have to create our application now let's start creating everything one by one if i run this application

here you can see that we have a black screen and the name of this black screen is main and then we have a default icon here and this default icon is from kv module now suppose you want to change the icon and you want to add a icon by yourself you can do that also so for doing that close our this application just click on the project folder then click right and then click on show in explorer

here you can see that we have a calculator folder open this folder and inside this folder we have to add two images one will be our calculator dot png and another will be calculator splash dot png every time you create a application using kv you have to add two different images here you can see that our first image will be for our icon our app icon

and our second image will be for our opening screen and if i show you the properties of our first image and then if i go to the details remember this dimension here you can see that it is 256 by 256 you have to remember this dimension and if i show you the properties of our second image our opening screen

if i go to the details and here you can see that we have a different dimension 512 by 512 you have to remember this dimension okay now for changing the icon of our screen we just have to call our self then we have to call our icon and here you can see that in our project folder i have two different image one is calculator.png and another one is calculator splash.png

now i'm going to add the calculator dot png that's it now if i run this program and here you can see that beside our main we have our own icon that's it guys okay so after creating our icon and operators now we have to create some more variable so that's why call ourself and the new variable name will be last underscore was underscore operator

and it will be none i'm going to use this operator later on our code but for now leave this operator now let's create another operator self dot last underscore button and it will be also none that's it okay so after creating our all the variables now we have to create another variable which is main layout and for our main layout we have to use our box layout

and inside the box layout we have to use the orientation and it will be vertical for now leave this parameter we are going to discuss about this parameter later on our code after this one let's call our self again

and now we have to create our screen it means if we do any calculation we are going to show those calculation or those result inside a screen so for creating the screen we are going to create a new variable and it will be solution and for creating our solution we are going to need our text input okay so inside our text input first of all i am going to use a background color

the background color will be black and then i'm going to use a font color so that's why it will be foreground color and it will be white that's it inside our text field we are going to use other properties also but for now leave this with our these two properties now let's create our main layout variable and then we are going to add

widget and inside our add widget we have to call our self dot solution that's it it means inside our main layout we are going to pass our self and our solution now let's create our buttons and inside our this buttons variable I am going to add our all the buttons so for adding our all the buttons let's create a array

and we are going to start adding the buttons from the top left and from the top left our first button will be 7 then 8 then 9 then the division operator close our array and then inside this array we have to create another array it means we are going to create nested array it means inside a parent array we can add multiple arrays and it is called nested array

so the second line will be the same just copy this one and then paste it here that's it now this one will be four five six one two three it will be decimal point zero and c now let's change the operator also it will be multiplication addition and a subtraction

okay guys inside our buttons variable we have added our all the buttons now we have to insert our these buttons inside our that black screen so for adding these buttons inside that black screen we have to write a for loop so let's create a for and it will be row in buttons then we have to create a variable and it will be h underscore layout

then we have to call our box layout now for our each of these buttons we are going to create different levels so for creating our those levels we have to create another for loop and it will be level in row now let's create a button variable then call our button and our each of this button name will be according to our level name

so the text will be level then i will use a font size and it will be 30 then i will add a background color and it will be gray now we have to position our these buttons in the center of our button so that's why we have to add position hint

then create a curly braces and inside this curly braces first we have to center from the x so that's why center underscore x and it will be 0.5 then we have to center from the y also and it will be also 0.5 that's it now we have to insert our these buttons inside our h layout so that's why just call our h layout

then add widget and it will be button then we have to insert our this edge layout inside our main layout so that's why simply delete one space and then call our main layout then add widget and it will be edge layout and please guys be careful with our these white spaces if you don't follow these white spaces your program will not run

please follow these white spaces okay now after creating our buttons we have to make these buttons working or you can say we have to make our these buttons functional so every time we press each of these buttons these buttons will run a function so that's why just call our button dot bind

it means if anyone type a button it will run a function so that's why it will be on underscore press then we have to create a function but first we have to call ourself and then we have to add a function name so the function will be on underscore button underscore press here you can see that we have created one function we have to define this function later on our code

okay so after creating our number buttons now we have to make our equal button also working so that's why let's create a variable and it will be equal underscore button and then call our button and inside our button we have to simply copy these properties then paste it here but instead of level it will be equal that's it

after creating our equal button variable now we have to bind this variable with a function so that's why call our equal button then bind this button and if anyone press our equal button it will run a function but first we have to call our self dot and we have to create a new function name and it will be on underscore solution

that's it and then we have to also add this equal button inside our main layout so that's why call our main layout and then add widget and it will be equals button

then we have to return the main layout okay so after creating the layout now we have to create the function we have to make the function working here you can see that we have created two different function one is on button press and another one is on solution now let's work on our own button press function so that's why define our function and inside our this function i'm going to pass our self

and instance now every time if anyone click on our these buttons i want our this button values to be showing in the screen okay in the calculator screen so that's why we have to create a variable and it will be current and every time if anyone press a button we have to show that button values inside inside the screen so that's why call our self dot

and then we have created a solution and the solution will be in text format then we have to create another variable and it will be button underscore text and the button text will be instance dot text that's it now if you guys remember we have a clear button also inside our calculator now we have to make this clear button also working

so that's why let's create a if it means our button text double equal to c it means if anyone type our clear button we have to simply clear our screen and right now our screen is this one and our screen will be empty that's it now suppose in our screen we already have

typed one operator now if anyone wants to type another operator then we cannot add that operator with our first operator it means in our screen if we already have an operator existing then we cannot add other operators so that's why we are going to create a else value and inside this else value we have to create a if value and it will be current

then we have to add another parameter now if you guys remember in the beginning of our application we have created a last was operator variable now call that variable and then call our pattern text also in self dot operators

and it will be return none let me explain you this statement again suppose if we already have a operator inside our screen and then if anyone wants to type another operator after that then we cannot add that second operator with our first operator so that's why if we already have an operator inside our screen and then if anyone types another operator then we cannot

show any operator or anything inside the screen and then we have to add another condition so that's why let's call l if suppose our screen is empty and if anyone wants to type an operator first then we will not show anything inside the screen because first character in the screen should be always a number not an operator okay

that's why we have to implement that statement and it will be current if our current is empty and our button text is a operator then we will not show anything and it will return none

we have to create another condition suppose if our these two condition is not matching if our user is typing a number at the first character also if our user is not typing two operators at once then our these two condition will be false so that's why we have to create another condition to execute and this one will be else and we have to create a new variable

and our new text will be replaced by the current text and the button text then our self dot solution dot text will be our new text okay if our these two condition is not matching that means our this condition will be true

and in our screen we have to create a new variable and inside that new variable we are going to store the current value and the typed button value and we are going to add these two value inside a new variable and this new variable will be stored in our screen after that we have to set or you can say we have to clear our variables so that's why call our self and the last button

will be our button text then call our self again then our last was operator will be the self last button in our self operators that's it guys now here you can see that we have successfully defined our first function which is on button press so after our this function now we have to make our this function working which is on solution so for our this function

let's define that function first and inside this function we are going to pass our self and instance then we have to create a variable which is text and then first we have to call our screen so that's why let's call our self solution and the format will be text then we have to create a condition if text

and inside our this condition everything will be true okay so that's why let's create a new variable and it will be solution and our result will be in a string format so that's why it will be str and then we have to evaluate our answer so that's why we are going to use a building function which is evil and inside this function we have to call ourself dot solution dot text

then our self dot solution dot text will be our final solution that's it guys we have also defined our second function that's it guys now if i run this program and here you can see that we have our calculator here you can see that we have a black screen and then we have our all the buttons now if i type any button here you can see that our that button value is showing in the top left of our screen

and now let's see if our this operators is working or not here you can see that our operators is now working and our c button is also working now let's make some changes here you can see that our this text is too small

i want to increase the size of our this text also i want our this text to be a start from our right side not from the left side so i will make these changes so for making these changes let's go to the top here you can see that in our self dot solution in our text input we have only two properties

i'm going to add more properties inside this parameter and our next value will be multi-line and our multi-line will be false because i don't want our this text

to break down and start from the next line i don't want two or three lines inside of this screen i want only one line so that's why multi line will be false then i want our those text should be a start from the right side so that's why it will be each a line and it will be right now if i run this program and if i type anything here you can see that our those text is now starting from the right side okay

so after this one now i will add a font size and the font size will be 55 now let's run this program again and if i type anything here you can see that we have a bigger text inside our screen now inside our screen here you can see that now anyone can click okay they can select the text they can click the text

also they can delete the text but i don't want to do that i want our this screen to be unclickable it means no one can click no one can select anything from our screen so for disabling that clicking function we will use another property which is read only and it will be true that's it now if i run this program again

if i type anything here you can see that we cannot delete anything from our this screen it means inside our this screen our this value will be constant we cannot change these values by clicking the clear button from our keyboard if we want to clear our this text we have to simply click on our this button

That's it guys.

Here you can see that we have successfully created our calculator using KV.

Now for your better understanding I will recap our this program once again.

In our first portion here you can see that we have imported some necessary components from our KV.

And then we are creating a class which is main app.

And for running our this class we are calling our main function.

And then we are calling our app.

and inside our this class we have some defined constructor and inside this constructor we have to pass the self and inside our constructor we have to write all the variables and all the functions here you can see that self dot icon is for changing the icon of our screen

then we are initializing our operators inside a operators variable and inside our array we have our all the operators and then we are creating two default variable one is our last was operator and another one is last button and both of these values is none then we are creating a main layout and inside this main layout we are creating our box layout and this box layout is having orientation vertical if i run this program

here you can see that our components is now in vertical if i change this to horizontal and if i run this program here you can see that our complete layout of our calculator is now changed everything is now in horizontal but i don't want everyone to be in horizontal i want to change our this layout and it will be vertical now if i run this program

here you can see that our calculator layout is now in vertical position okay so after our vertical now first we have to create our screen our calculator screen and inside this screen we are using a text input and for making our text input a little bit beautiful we are using all of these properties

after creating our text input we are adding our screen inside our main layout and we are adding our these variables as a widget okay after our screen we are creating our buttons and we are creating a nested array for our buttons and inside this nested array we are adding our all the buttons and now inside our calculator we have to add our this buttons so for adding our this button

we have to use a for loop we are using level so for each level we are using our different buttons and for making our these buttons these buttons beautiful we are adding some properties inside our button

then we are making our button functional using a function which is on button press okay so after adding the buttons and after initializing a function now it is time to add those buttons inside our layout after our buttons now we have our equal buttons left so for making our equals button looking good we have also added some properties for our equal button and then we will run a function every time we press on the equal button

and then we are adding our equal button inside our main layout then we are returning our main layout after adding all the components inside our calculator now it is time to make our these functions working so that's why we are defining our that function we are passing our self and instance then we are creating a initial value for our screen and for our button

now if anyone types the c button or you can say clear button i want our screen to be cleared so that's why it will be empty and suppose in our screen we already have a operator and if anyone wants to type another operator after the first operator then we are returning none it means we cannot return anything if an user types two different operators or two operators at one time and after this one we have another condition

if our screen is empty then user cannot type operators as first character and if they do that we are returning none and if our these two function is false it means if we don't have two different operators or two operators in our screen and if we don't have operators as first character

we have our new text and our new text will be combination of our current text and the typed button text and we are going to store our this value inside our screen so after our screen now we have to set the default values for our buttons and operators and after our this function

we have to work on our second function which is on solution and it will pass the self and instance and we have to create a text variable and inside our variable we have to add our screen and inside our this condition everything will be true and our final solution will be in a string value but first we have to evaluate our previous value and then we have to convert that values in string mode

then we have to store our final result inside our screen that's it and after creating our application if i run here you can see that we have a complete working application and this application is working perfectly

that's it this is only a script okay not a functional application it means we cannot install this script in our mobile phone so for installing our this script first we have to convert this script into an working application so for converting this python script into an application we are going to use another python library which is build user so for the further process we are going to use another platform which is called google collab

now if you are a beginner and don't know anything about google collab then don't worry i will provide you the link of this google collab in the description you just have to follow my steps and after following my steps you are going to create your application which you can install in your mobile phone okay there are many reasons behind using the google collab because if your computer is not good enough if your computer configuration is not good enough then you can use google collab

because for this script to app conversion process it takes a lot of space and it needs to install a lot of libraries and if you don't want to install those libraries in your computer then you can use google collab

and the google call up is pretty fast you don't have to install any other libraries for converting your script to an application okay so now let's start the conversation process first here you can see that we have to install our builder and then we have to install our this python version then we have to also install some other libraries okay but first we have to install our this one so for installing our this build user we have to simply click on our this icon

and now here you can see that it is installing our all the requirements okay now it is done here you can see that we have a tick icon and this tick icon is saying that our this process is done after this one we have to run our this command after it is completed run our this command this process is also done scroll down

then run this process and here you can see that they are installing a lot of libraries and that is the main reason why i am using google collab okay this command is also done now scroll down and run this command this one is also done run this one

okay this one is also done now here you can see that we have our main command which is build dozer init after running our this command this process will generate a new file in here okay now let's run this program and it will ask for your confirmation type here and type y and then enter

and here you can see that they are saying file buildozar.spec created it means they generated a new file here you can see that we have our that file if you cannot see this file just click write and then refresh after refresh you will see this file now before we talk about more about this file there is a important thing to do let's go to our project file here you can see that we have two image

now we have to drag this to image and then drop our here and they will send you a reminder just click ok that's it and here you can see that our this two image is now uploaded now in our buildozer.spec file we have to edit this file okay we have to edit some information from this file so that's why just double click this file

and here you can see that we have our app and here is our title so by default it is my application you can change the name and i want to change the title name and it will be calculator okay now after this one just scroll down and in our line 39 here you can see that we have our requirements

and in our requirements here you can see that we have two module given here now we have to make some changes inside the requirements first of all here you can see that we have kv but we have to define the latest version of kv which is 2.0.0 so that's why we have to add double equal then 2.0.0 then add a comma

now i will add another module from cavi which is cavi md then i will add another module which is pillow that's it okay so after adding our all the requirements now scroll down a little bit here you can see that we have free splash of the application it means our opening screen of our application if anyone click the application in our mobile phone then we want to show a opening screen okay

so i have a image for that here you can see that i have a calculator a splash.png now i will simply rename this file and select the full file name copy this and here you can see that we have pre splash file name and this file name is actually with a comment first we have to remove the comment that's it and then here you can see that after as then we have a slash after that slash just remove this thing

then paste the file name which is calculator splash.png okay so after our opening screen now we have our icon of the application and here you have to add a icon image for your application and for that i have a image also which is calculator.png so i will rename this one select the complete text and copy first we have to remove the comment

and after our s we have to add the icon image name that's it so in our this builder.sbc you have to make four changes one is we have to change the icon of our application then we have to add a opening screen for our application then we have to make some changes in our requirements then you have to change the title of your application

after this one just click the close button okay so after editing our buildozer.spec file now let's go to our project folder and from here just drag our main.py file and then drop it here

here you can see that our main.py file is now uploaded now one thing you have to remember your python script should be always named as main.py okay always your python file name should be main.py okay now after this one let's run our final command and this will ask for your confirmation type y and enter

and here you can see that the conversation process is started now they are downloading some files and some libraries so that they can convert your script into an application and this process can take some time basically it takes 10 to 15 minutes to convert that file into an working application

and guys here you can see that finally our process is done and it is saying android packaging done and then they have created a bin folder now open our folder and guys congratulations you just have created a complete working application using python kv now you just have to download this apk file in your computer and then rename this apk file as calculator

And then save this file in your computer.

And guys here you can see that we have successfully downloaded our calculator.apk file in our computer.

Now let's transfer this file in our mobile phone.

And then install it in your mobile phone.

Now if you are installing this file in your mobile phone for the first time.

Then you may need to give some additional access.

Give all of this access.

And then install it in your mobile phone.

After installing it in your mobile phone, you will find a calculator in your mobile phone.

Now open this calculator.

And here you can see that we have our opening screen.

And there you go.

We have our calculator.

And this calculator is completely working.

We can do all of our regular calculation inside our this calculator.

congratulations guys you just have created a complete working application for your mobile phone and step by step completely from scratch and now you can use this calculator for solving your regular calculation that's it guys in this python project we have learned how to create a mobile phone application using python and then we have also learned how to convert a python script into a working mobile phone application

that's it guys i hope you guys learned something new from this tutorial and if you guys really do then please please subscribe like this video and press the bell icon for the future videos and if you guys have any question about this video please let me know in my comment section that's it guys let's see you in our another python project

Thank you.