Introduction to Android Development Using B4A (Basic4Android)

January 4, 2019

This is a brief introduction to Android Development and it's mainly targeted to those who are interested in learning how to develop mobile applications whether in Android or iOS.

The mobile app development field is increasing year by year, and with that also increases the amount of Mobile Developers, there are many programming platforms in which one can develop an application it all depends on how much time a person would like to dedicate to learning a new IDE (Integrated Development Environment). I personally got started with a programming language called App Inventor, i will not go into too much detail about App Inventor as the main focus of this page is how to develop Android Applications with Basic4Android, I am going to say that i have not found another programming tool to develop Android Applications which is as easy as B4A.

 

OK enough of that, let's get right down to the main topic, for those who are entirely new to Android Development, I will list the steps below required to set up your environment on your P.C to get started, those who already have the Android SDK downloaded and Java set up can skip these steps and go directly to the Hello World tutorial.

 

The configuration steps may seems a little confusing if this your first time, but I promise you after everything has been configured writing your first Android Application will be a walk in the park, so please stick with me and if for some reason you get stuck just go over the steps as many time as needed until everything is set up and configured properly.

 

The first thing we need to do is download Java JDK, which is needed as Java is the core engine to interpret the code written after compilation, to download the Java JDK click on this link

 

 

Accept the License Agreement

Select either Windows x86(32 bit) or Windows x64 depending on which Windows version you are running.

Download the file and install on your machine.

 

The next step is to download the Android SDK command line tool and it can be directly downloaded from here once the file has been downloaded unzip it and install it anywhere on your P.C. it is recommended to install it in a folder such as C:/Android.

If you still have not done so go ahead and download the free trial version from B4A or if you prefer buying the full version you can do so as well, install the software by following the wizard instructions.

 

Once the B4A IDE has been downloaded and install we need to go ahead and configure the a few things before getting started.

Go ahead and open B4A and go to Tools/Configure Paths menu 

 

Once in the configure paths window we need to browse to the location where the Java JDK was installed the part normally looks something like this C:\Program Files\Java\jdk1.8.0_171\bin\javac.exe click on the Browse button and point to the C:\Program Files\Java\jdkx.x.x_xxx\bin directory and select the javac.exe file

 

Next click on the Open SDK Manager button and browse to the location where Android SDK was installed, if you put it in your C directory your would have something like C:/Android. we need to go to the tools\bin directory and look for the sdkmanager.bat file, go ahead and click on the on the button with the folder icon and browse to the C:\Android\tools\bin\sdkmanager.bat location, your screen should look like the image below.

 

Once you have pointed to the sdkmanager.bat file, press on the Refresh button and you will start seeing the recommended items to install this items are necessary for the next step as you need to choose which Android version file you want to start developing with, we will go ahead and select the latest version which at the time of writing this tutorial is API version 28 or Android 9, don't worry too much about this for now as we will go into more detail about this as we progress in our tutorials.

For now just click on the Install Selected button to start downloading and installing your Android emulator and Android images.

 

After everything has been downloaded and install go back to the B4A IDE on the Paths Configuration window click on the button next to the android.jar box and browse to the the Android SDK directory C:\Android\platforms\android-xx\ and select the latest android.jar file which should be android-28, the path should look like the image below.

 

Click on the OK button at the bottom of the Paths Configuration window and we are done setting our environment up and are ready to start developing for Android.

If everything was set up and configured properly, then are ready to start writing our first Android application, go ahead and open up the B4A IDE, we will go ahead and describe the different Subs (Functions) of the Main Activity, An Activity is described in Android terms as one screen of the Android app's user interface. In that way an Android activity is very similar to windows in a desktop application. An Android app may contain one or more activities, meaning one or more screens.

We have have 5 Subs or Functions the first one is called Sub Process_Globals and here we can declare variables that can be accessed publicly by other modules or Activities in your application, we also have the Sub Globals where you can declare variables that are only accessible from the module you are working with in this case they can only be accessed from the Main Activity, we then have the Sub Activity_Create(FirstTime As Boolean) which gets called when your application is started and where you would load your layout which would show all the user's interface components such as buttons, labels etc. we also have Sub Activity_Resume which is raised every time your application comes back to the foreground after being paused either by pushing the home button on your device or when a Phone Call comes, and lastly we have Sub Activity_Pause(UserClosed As Boolean) which gets raised when the application is paused by either pressing the home button, turning off the screen etc.

 

There are a few more parts we need to cover, we're almost there, i know you are anxious to get started and show your friends your first Android Application, but we must cover these last few parts before getting started. There are two more sections at the beginning of your Main Activity one is the #Region Project Attributes and the other one is the #Region Activity Attributes, under the Project Attributes you will see: 

#ApplicationLabel: B4A Example

#VersionCode: 1

#VersionName:

#SupportedOrientations: unspecified

#CanInstallToExternalStorage: False

These properties can be changed for example the #ApplicationLabel attribute is where you would write the name of your Application for the sake of this tutorial let's change the B4A Example name to Hello World you can leave the rest of the attributes as they are for now.

The next section is Activity Attributes and you will see the #FullScreen and #IncludeTitle attributes, let's also leave those as they are for now i'm sure you can figure out what these two attributes are used for based on their names.

The next step is to assign a package name to our project, under the Project\Build Configuration menu type in a package name for your project, a package name is a unique identifier for each Application, and the common format is similar to a web address, for example since this is our first project and we have named it Hello World, we can go ahead and type in a package name like com.hello.world you can change it to anything you want as long as it is in the same format.

 

Next we need to go ahead and save our project, click in the File\Save Menu and choose where you want to save your project, give your project a name, for the sake of this tutorial I will name it HelloWorld. 

 

Click Save and now we are ready to start writing some code, I know Finally right?

 

Basic4Android offers a Visual Designer which makes designing the User Interface of your application a lot easier, the Graphic User Interface or (GUI) of your application can also be done in code, but for this tutorial we will go ahead and stick to the Visual Designer.

Go ahead and under the Designer Menu click on the Open Designer option, the Visual Designer will open on a different Window and it should look like this.                                                                                                                      

On the left side you can see the current Variant with a size of 320x480, on the right size you can see the space where we will start adding our User Interface components and on the bottom left corner you can see the General script section, we will cover this in a few moments. For now let's go ahead and add a button by going to Add View menu and select Button, you will see that a button gets added on the right side of the Visual Designer.

 

You can drag on any of the 8 points around the Button to make it any size you'd like, you can also drag it to position the button anywhere on the screen, on the middle top part of the Visual Designer you can see the properties of this Button, let's go ahead and change the name of it, let's rename it from Button1 to btnHelloWorld, you can also see a few more properties for this Button such as the Left, Top, Width and Height Properties, you can try playing with these properties and set the width to 200 and the height to 50, scroll down a little further until you see the Text property and type in Hello World!  this changes the caption on the Button. Your layout should look like this now.

 

Next we need to generate the Events or Functions that will be triggered when the Button is pressed, to do this right click on the Button, you will get a Menu, go ahead and click on the Generate Item and on the Dim btnHelloWorld As Button, this will add the variable declaration to our Sub Globals section in our Main Activity Section, next right click again, Select Generate and Select Click this will create the Sub btnHelloWorld_Click Event in our Main Activity section. Now we need to Save our Layout, Click on the File and Save As menu and give your layout any name, i will name mine main.  

Now back in our Main Activity, we are ready to start writing some code. Your main Activity should now look like this.

 

Notice the highlighted items Private btnHelloWorld As Button and the Sub btnHelloWorld_Click Event, these were added from the visual designer in our previous step. Now all we need to do is load our previously saved Layout in the Sub Activity_Create(FirstTime As Boolean) section, to do this we need to write the following code:

 

 

 

 

 

All this does is load the layout we created with the Button on it, at this point if you were to compile the code and run it on either an Emulator or a real device all you would see is a Button on your screen, if you clicked on the Button nothing would happen because we have not told it to do anything yet. Let get into that right now, before we are able to actually do anything with this project we need to create an Android Emulator so that we can launch our project and be able to see what our screen looks like.

From the Tools Menu Click on the Click on the Run AVD Manager selection

Under Screen Size select the 6" Phone (480 x 854,  scale = 1.0) 

 

Next under the Platform Menu select whichever platform version installed.

 

Click on the Create AVD Button right below the Platform Selection so that we can create our first Emulator.

Once the Emulator has been created click on the start Button to launch the Emulator. If Everything went fine you will see your Android Emulator booting up and after a few seconds you will see a screen like this one.

 

 On the bottom right hand corner of your B4A IDE you will see a button labeled Connect, go ahead and click on the Connect button This will connect your Emulator device to the ADB (Android Debug Bridge) which is a very useful tool to Debug our applications during runtime in case there might be a problem in our code, you should see some Log info on your Logs window once the Emulator is connected.

 

 

If everything is working out fine we can now run the Application and we should see our HelloWorld Button on the Screen, back in our IDE let's change the Compilation Mode from Release to Debug let's compile and run our Project by either pressing F5 or by going to the Project Menu and Select Compile & Run option.

If there are no errors we should now see a screen like the following:

 If you click on the Hello world! button as I mentioned above, nothing will happen because we still have not written any code to do anything useful.

Let's go ahead and add the following code inside our Sub btnHelloWorld_Click Event.

 

 

 

 

 

Let's compile and run our project again by pressing F5. If we press on the Hello World button we should see a message box pop up with the Title My First App and a caption of Hello World!.

Congratulations you have just created your first Android Application, I told you once all the configuration and set up is completed, writing Android applications is very easy.

What I love the most about Basic4Android is the community of Developers who are always there to answer any questions and help in any way they can, if you are eager like I was when I started learning Android Development, you can visit the B4X forums and follow some of the tutorials and examples they have so that you can too become a professional Android Developer.

 

 

Share on Facebook
Share on Twitter
Please reload

Featured Posts

Introduction to Android Development Using B4A (Basic4Android)

January 4, 2019

1/1
Please reload

Recent Posts
Please reload

Search By Tags
Please reload

Follow Us
  • Facebook Classic
  • Twitter Classic
  • Google Classic
WHAT'S UP?
CONTACTS

Tel: 818-385-7561

 

Mail: info@genesisitdevelopments.com

Location: Lake Balboa, Los Angeles CA

  • White Instagram Icon
  • w-facebook
  • Twitter Clean
  • w-googleplus

CURRENT PROJECTS

 

We are currently accepting new projects, give us a call or email us to inquire about our professional services.

 

© 2023 BY GENESIS IT DEVELOPMENT