Kodular is a drag and drop app builder based on the MIT App Inventor.
You don’t need to learn coding to build apps with Kodular.
Kodular has great features, you can customize apps as you like.
You can share your doubts, projects, or suggestions related to Kodular.
The Community is very active, so you can get quick responses to your doubts.
Sign Up / Sign In to
You have 4 sign-up methods
• Account with email and password
(You will receive a confirmation email)
This means you are creating a Kodular account with these sign-up methods.
You can use the same account to login to the Kodular Community.
Creator’s Home Page
You can see all your projects on the Home Page.
Click on a project to open.
Click on create project.
Give your new project a name.
• Project names must start with a letter and can contain only letters, numbers, and underscores.
Click on “Next”.
Configure your project.
This configuration is optional. You can change these settings later.
Click on “Finish”.
You can import a project file from your computer to the Creator.
The project file format is the AIA file. (.aia)
You can sort projects for convenience.
You can save the project file to your computer (AIA file)
Click on save icon
Click on the delete icon and enter the project name for confirmation and click on delete.
Understanding App Programming In Kodular
Apps will have screens, so you can switch to different screens.
Screen1 is the base screen that opens when the app is opened.
You can create screens.
For example, Sign Up screen and Home screen, etc.
Screens have Designer part and Blocks Part.
Here you design the User Interface (UI)
Drag and Drop components you need like Button and Label to the screen.
And you can edit component properties. For example, setting Button color to blue.
Drag and drop blocks and join them.
When something happens, do something
When Button1 Click
Set Label Text “Hello, this is my first app”
You can say design is the body and the blocks-part is the brain.
You can upload and use files in the app like images.
You can import extensions.
For example, a Flashlight extension to turn the flashlight on/off.
Drag and Drop components from the Palette.
You can use the search feature to find components quickly.
Components are categorized.
You can also import extensions from your computer.
Go to the last category “Extensions” to import extensions.
You can find extensions here (Free/Paid)
Extensions Directory, (By @Taifun)
Drag and Drop components to the screen
You can preview how it looks for other screen resolutions.
Here you can manage components (including extensions)
Edit their names.
Here you can edit component properties.
App properties are included in Screen1 properties like App Name etc.
Drag blocks to the blocks editor
Documentation for built-in blocks.
Documentation for all components.
Types of component blocks
There are mainly 3 types of component blocks. (also for extensions)
They are Events, Methods, and Properties.
You can make something happens when an event occurs.
Some events return properties, for example, the location changed event returns latitude and longitude, etc.
There are 2 types of Functions, Do Function and Get Function.
- Do Function
- Do Function (With Parameters)
- Get Function
- Get Function (With Parameters)
There are 2 types of Property blocks.
- Set Property
- Get Property
Warnings and Errors
Here you can see the number of warnings and errors in your blocks.
You can navigate to blocks with warnings or errors by clicking on the arrows.
You can add blocks to Backpack.
Right-click on a block and select the “Add to Backpack” option.
You can access blocks added to BackPack even in other projects.
Drag blocks to delete icon to delete blocks.
Click Backspace/Delete key to delete blocks.
Click on plus/minus to zoom-in/zoom-out.
You can download this project file (AIA) and import it to the Kodular Creator.
Speech2Text.aia (1.7 KB)
You can download this APK file and install the app on your mobile.
Speech2Text.apk (5.2 MB)
You can add, copy and remove screens
Switch screens in the project.
Click on “Add Screen” and enter the name for the new screen.
Click on Create.
You can copy the current screen.
Duplicating the current screen.
Give a name for the screen.
Click on “Copy”
Click on Remove screen.
Enter the name of the screen for confirmation.
Blocks for switching screens
App properties are included in Screen1 properties
Like: App Name, App Icon, etc.
Guys, I’m not advertising you anything; I just want to share what I’ve learned about building apps using Kodular. So, in order for you to continue learning more, I created a video for absolute beginners to understand the basics (components) of kodular.
If you want to learn Kodular, you can watch this video: Kodular tutorial for beginners in English | Full tutorial by Ajmal - YouTube