Making our first Simple Interest Calculator in Kodular.

 

Welcome back, we are now going to start our first project tutorial in Kodular "Interest Calculator". So,let's directly get into it.

Uses of Interest Calculator:

A interest calculator is used to calculate interest on some principal. Calculating interest in simple calculator is not easy but if we have just to enter Principal,rate and time(per year)then it would be so easy.Therefore, we are going to make a simple interest calculator to understand the simplest concept of Kodular made apps. Here, we are going to use Simple Interest and rate for per annum.

How to make Simple Interest calculator:

1. Create a new project and set Name for your calculator:

2. Now configure Settings for your project and give package name for your Project:

3. Now you will be on your main screen (Screen1)Project Page.Set your colors for your status bar, accent colors and configure your settings for your Screen1. You can also set the title invisible and write something about screen 1 in About screen option. Also set align horizontal and align vertical to center.

4. Make design and UI for accepting information from user:

How to Design UI:

1. Drag and drop a Label and write name of your calculator for this label text.(Note: The text can be changed from the label text option in the Properties option of label.

2. Now add a space element  under the Calculator Name label As seen in the above image to make it good looking.

3. Now again add a label and set text as Principal and add a text box from UI option in the sidebar. Textbox can be dragged from sidebar, it is located in the last 2nd option in UI options.

4. Repeat this and add two more textbox and labels for Getting input from user for rate and time for getting amount after adding interest.

5.After completing the above steps now add a button which on click will show the result.

6.Now add a horizontal arrangement and set it's default horizontal and vertical align to center and add two label as shown in above image.(Note:Horizontal arrangement will be in Layouts option.)

Now rename the components so that we could easily differentiate between components.

After you have renamed the components we are going to work on the block section.So, just click on the blocks button available on right corner and you will on the blocks editor section.

Blocks Editing:

We have to set blocks like this:

 Steps in Berief for arranging Blocks:

1.Click on The button which you used to show answer on click. Get the block button _ .click and drag it to the viewer.

2. Click on the label on which you want to show the Answer. Drag the block "Set _(Name of label) .text to " and drop on the Block when button _ click to attach block with it.

This will do that when you click on the button it will set the label text to=

3. Now click on the math option given in built in blocks. Find the addition block and drag and drop the block and attach the set label_  .text to with it.

4.Then,click on the the Text box where you will get the principal amount from user and drag and drop the "Text box. text " to attach with the first blank option addition block.

5.Then,again click on Math and drag and drop two blocks which are multiply and divide two numbers.

6.Set the multiply block in the second blank box in addition and click on the gears option available on multiply block and add a block in it.

7.Now set the blocks as shown in picture and you are all done.

Export this project and download it to your android mobile phone and use your calculator to get  simple interest amount, Just joking....

You guys have successfully made your first calculator app in kodular.

That was for today's article keep connected with Learn web to learn more about Kodular app making......

Happy Koding....