In this tutorial, we will be learning in detail about the interface of Android Studio. As we know it is officially integrated development environment for building, testing, debugging of android apps. First, we need to learn about its interface so that ultimately while performing the tasks of coding with this we will not face any sort of difficulties and confusions.
In this tutorial, we will not learn about any code but we will learn about the interface of Android Studio. It is the main screen of Android Studio as the prototype of android phone is visible.
Main Screen Android Studio screenshot the android phone area:
Projects that should be written is already there at the left-hand side of the main screen and the name of that side window is ‘Project Explorer’ and from there look for ‘app’ folder and click on the triangle button of it to expand the folders out there. All of our project files will be stored in this single compound location namely ‘Project Explorer’ and inside ‘app’ folder.
If you wish to see what included into our project then simply click on the arrow beside ‘app’ and that will expands to show files namely, ‘manifests’, ‘java’, ‘res’ and ‘gradle scripts’. The first folder is ‘manifest’ and clicks on the arrow beside it and it will open ‘androidmanifest.xml’ which is the manifest file of the project.
Then, when you open ‘java’ folder where all of these java codes are present or which we will be going to write down. The ‘res’ folder is known as resources folder which is going to store all of ours multimedia contents of apps inside of it. The first subfolder of the ‘res’ folder contains ‘drawable’ which will contain all of the images of apps.
This is in a similar to ‘Gallery’ folder of WordPress self-hosted websites where all of these galleries such as images and multimedia are going to stay and for apps, the resource folder of Android Studio is exactly the same.
Inside ‘res’ folder there are some sub-folders. One of is ‘drawable’ folder. If you want to load some images into the android app in the main screen area then it is very easy. Just include the image inside ‘drawable’ folder and it is included inside the Android app which you are currently constructing.
The next subfolder inside the ‘res’ folder is ‘layout’. As the name suggests it will define the layout or the front side of the app. While clicking on the arrow beside ‘layout’ you will now have two files. The first file is ‘activity_main.xml’ is the structure file of the app which is going to decide on the layout of the app. As the name suggests it is a dot XML file. At the last, there is ‘values’ folder inside ‘res’ which is going to define the values that will be included inside the android app here.
The ways to edit your application:
There are two ways you could edit or program your application seen inside the main window of Android Studio. If you design the layout the ‘layout window’ is there in between ‘Project Explorer’ tab and ‘Main screen’ of Android Studio. It basically drags and drops editor and the code is then written inside ‘activity_main.xml’.
This is one of the easy ways to construct the layout of the application. Inside layout tab you will find plain text, radio buttons and other widgets easily and by clicking on it and then bring that to main windows into the app then these layouts can be installed within app easily. Subsequently, the related code will be written inside the coding window.
This is known as ‘Design’ approach and here you will follow these simplest approaches by drag and drop widgets out there and incidentally, this will also write inside ‘content_manifest.xml’ file. The next approach of the similar task is the same as we can add these buttons exactly with the following of text mode of the main windows of Android Studio.
In the ‘text’ mode of the main window, now you have a detailed look of the code inside ‘content_manifest.xml’ file. You will have the codes of all these buttons which you have inserted into the app by using drag and drop process and those codings will be there.
Alternatively if you want the same buttons using the ‘text’ mode then you can simply write those codes which are automatically inserted through drag and drop process and for the sake of understanding just cut those code from the ‘text’ mode of app and widgets and paste it there again and then go to ‘design’ mode and you will find the same widgets are now there and this time with the help of coding.
content_manifest.xml in text mode:
It is obvious that the ‘Drag and Drop’ approach which is easier to understand and complete and build the layout but if you want to move towards complete learning of code and how they work then it is better to write the code and build the application through ‘text’ mode.
In this way, you could understand the practical functioning of XML code which does not need any emulator to understand how they run as all of these should be seen in the ‘Design’ layout of the app.
In the main windows of Android Studio we have the ‘zoom out’ and ‘zoom in’ button which when clicked the android phone prototype which has been there with main windows tend to get bigger or smaller with it.
This is needed when any of the designing insides of layout becomes so small or bigger that it becomes almost impossible to see through it how they work and with it, you can see these XML coding in real time with clarity in picture values.
In the earlier version of Android Studio we have application frames there which tend to minimize the space of android phone inside main windows but with the latest version of Android Studio updates that is now providing the prototype of android phone inside main window of Android studio without any frame so that the visibility space of it is now more increased to make it more comfortable to watch and understand how the layout is working.
So in this new version of Android Studio, you do not have to worry about the presence of ‘Device Frame’ altogether and this time it is already optimized. That is why I have always advised using Android Studio as the integrated development environment as it is from Google and from time to time it updates in accordances with the feedback received from users.
Related Posts:
Getting familiar with Java: And && Or II statements
Java vs Kotlin: Which is the better option for Android App development
Getting familiar with Java: Switch Case, Break and Default statement
