Difference between revisions of "Android Studio"

From Grundy
Jump to navigation Jump to search
 
Line 51: Line 51:
  
 
[[File:Android4.png|center|600px|caption|link=]]
 
[[File:Android4.png|center|600px|caption|link=]]
 +
 +
  
 
:Select a suitable device→ Next → Check your API level → Next → Name your Device→ Finish.
 
:Select a suitable device→ Next → Check your API level → Next → Name your Device→ Finish.
Line 65: Line 67:
  
 
[[File:Android2.png|center|600px|caption|link=]]
 
[[File:Android2.png|center|600px|caption|link=]]
 +
 +
  
 
Java File is where you work on the Backend Part.  
 
Java File is where you work on the Backend Part.  
Line 76: Line 80:
 
==Let us build our first app: A CALCULATOR==
 
==Let us build our first app: A CALCULATOR==
  
Building the interface:
+
===Building the interface===
  
 
Here is the  XML File:(Refer to picture below)
 
Here is the  XML File:(Refer to picture below)
Line 90: Line 94:
  
 
[[File:Android_5.png|center|600px|caption|link=]]
 
[[File:Android_5.png|center|600px|caption|link=]]
 +
 +
 +
 +
In XML, you can use various layouts. The most common ones are: RELATIVE and CONSTRAINT(Default)
 +
 +
We will use the constraint layout for our app.
 +
 +
:Go to the XML Design File
 +
:Drag and drop a button from the Palette.
 +
 +
We will have to constrain it from all the four sides to fix its position.
 +
[[File:Android6.png|center|600px|caption|link=]]
 +
 +
 +
 +
 +
We have constrained the button from all the four sides( you just need to drag the button to a side from the center) , Also I have changed the button text to 9 (refer to pink rectangle) and assigned an id to the button The green rhombus:(Here btn9).
 +
 +
Similarly add other buttons, rename them and assign an ID.
 +
[[File:Android7.png|center|600px|caption|link=]]
 +
 +
 +
 +
Sometimes, there is this warning which says “Hard-coded Text”. You may ignore it for now.
 +
(Incase you want to resolve this, you need to define your string in the string.xml file(res→ values→ string.xml)
 +
 +
:Read about it here [https://stackoverflow.com/questions/34130513/how-to-solve-this-issue-of-hardcoded-string/34130992 Hard Coded String]
 +
 +
 +
Also as you can see,there are  two large yellow rectangles in the design view.
 +
Those are the two text views I have added.
 +
One for the control : (Id= tvcontrol) and another for result(Id= tvresult)
 +
:*tvcontol- basically to show the computation
 +
:*tvresult- to show the computed result.
 +
Our XML file is complete.
 +
 +
 +
===Working on the Java file===
 +
 +
First of all, we declare all the variables that we need.
 +
[[File:Android8.png|center|600px|caption|link=]]
 +
 +
For the buttons part, you can also use arrays. But here for simplicity we will define them separately. We will have to define actions(add/sub…) and two values(the first has been initialized with null) and ofcourse the two text views(info and result).
 +
 +
Next,
 +
As the user clicks on a button we need to read that button and update info.
 +
 +
First of all, we will have to set up ids. I have declared a function and made a function call to the same
 +
 +
[[File:Android9.png|center|600px|caption|link=]]
 +
 +
::::::::::::::::::::::Declared function setupUIViews
 +
::::::::::::::::::::::Again, an array would have been a savior to such an ugly code.
 +
 +
 +
[[File:Android10.png|center|600px|caption|link=]]
 +
:::::::::::::::::::::Calling the function setupUIViews()
 +
 +
 +
 +
 +
 +
Also, we have written the onSetClickListener function for all our buttons:
 +
 +
:*For the buttons corresponding to numbers 0 to 9:
 +
When a user clicks on a particular button, this functional code is executed and the info is updated accordingly.
 +
 +
:*For the buttons corresponding to the operators(+,-,*,/,=):
 +
We need to compute according to the chosen operator, update info and result.We will use a compute()  function and update the action according to the operator.
 +
 +
Refer to the figure below.
 +
 +
:*For the clear button:
 +
If our info is not null:
 +
We need to update info. We will have to delete the last character of the info(or in other words display the string upto (size-1)
 +
 +
If the result has already been computed:
 +
We need to set text in result and info to be null
 +
 +
 +
[[File:Android11.png|center|600px|caption|link=]]
 +
 +
 +
 +
 +
Did we miss something? Ofcourse,  we haven’t declared the COMPUTE function:
 +
For the Compute function, we need to calculate our result according to the action, we will use Switch-Case for that.
 +
 +
Wait, but there is a catch. We will have to check whether the first value is not null. If it is null, we will have to accept val1 otherwise we will accept val2 and proceed to calculation.
 +
 +
 +
[[File:Android12.png|center|600px|caption|link=]]
 +
 +
Now, what I have done  is updated val1, you might be wondering why?
 +
Right?
 +
 +
Suppose you want to calculate : 12*9-79
 +
 +
:*If you don’t update val1, and rather return the result , you won’t be able to perform a multi-step calculation, or rather your result will be 12*9 and - 79 will have no significance.
 +
 +
But updating val1 will result in val1 becoming 108 after the first step, and then the next step continues.
 +
 +
Well, our code is ready. You may now  run your app  on your virtual device.
 +
 +
[[File:Android13.png|center|600px|caption|link=]]
 +
 +
 +
===Building the APK file===
 +
 +
From the Menu Bar-
 +
Build--> Build Bundle(s)/APK(s)--> Build APK(s)
 +
 +
Your APK file is built and stored in your local disk:
 +
 +
In Android Studio Projects→ Under Your Project Name→ App → Build→ Output→ APK→ Debug→ app-debug.apk
 +
 +
This is your required APK file. You can rename it, install it and send it to your friends.
 +
 +
Congratulations on Building Your First App.

Latest revision as of 20:48, 17 May 2020

Android studio is a framework that includes every tool necessary to develop Android apps and games. Technically, it is an official IDE (Integrated Development Environment) for facilitating app and game development

Let us begin this journey of developing Apps and Games:

Downloading Android Studio

Download latest version of Android Studio Here

Starting A Project

  • File→ New→ New Project
caption

Choose an activity as desired. For beginners, let us start by creating an empty activity. Next, you assign a name to your application, and choose a language. Generally, codes are written in two languages: Java and Kotlin. You can choose any of the two. For this tutorial we will follow Java.

Minimum SDK: Here is where you decide to make a trade off. Choosing the version of API vs the target devices.

Well,

  • API 16(Jelly Bean): Supported by 99.8% devices
  • And API 26(Oreo): Supported by 60.8%devices

If you use older versions,your app may miss out on many of the “modern” features and If you use the latest versions , as you might have guessed, your app will not be supported by many devices.

Personally, I recommend using an API 23 version but of course it totally depends on what tasks you want your apps to perform.

And Finally The Finish Option. Your Project is Loaded.

caption

This is what the screen looks like(For an empty Activity)

Creating a Virtual Device

Well, once you start working on a project, you would want to run your app on every step. Android Studio has its built in Emulator wherein you can create virtual devices and run your apps on them. Alternatively, you can use external emulators like Genymotion Download Genymotion. Also you can connect your own device and run your apps using the Developer Mode. Read about this here

Here is how you can create a virtual device using Android In-Built Emulator:

  • Launch AVD Manager(An Option on the Upper Right Corner)

A window similar to this will Pop Up. I have already created a virtual device, yours might be empty.

  • Go to the option-” Create Virtual Device”
caption


caption


Select a suitable device→ Next → Check your API level → Next → Name your Device→ Finish.

Your Virtual Device is All Set.

Working On the Project

When you create an activity, you see two files on the screen-

  • A Java File(Main Activity.Java)
  • An XML File(activty_main.Xml)


caption


Java File is where you work on the Backend Part.

Here, you write codes and methods for every single feature.

XML File is basically the Frontend Part. You have two options:

Either you can add features manually by writing codes.

"Alternatively you can drag and drop features and change their attributes.

Let us build our first app: A CALCULATOR

Building the interface

Here is the XML File:(Refer to picture below)

  • The yellow circle- The option gives you a choice to view your design and/or your blueprint.

A blueprint is basically the wireframe of your design.

  • The purple rectangle- This is the section from where you can switch to design and/or text of an XML file. As mentioned, you can either add features by writing codes or drag and drop. For writing codes, we use the text section and for drag/drop, the design section.
  • The red Palette- List of options from which you can pick up features
  • The green rhombus: Attributes corresponding to each feature will be displayed here.
caption


In XML, you can use various layouts. The most common ones are: RELATIVE and CONSTRAINT(Default)

We will use the constraint layout for our app.

Go to the XML Design File
Drag and drop a button from the Palette.

We will have to constrain it from all the four sides to fix its position.

caption



We have constrained the button from all the four sides( you just need to drag the button to a side from the center) , Also I have changed the button text to 9 (refer to pink rectangle) and assigned an id to the button The green rhombus:(Here btn9).

Similarly add other buttons, rename them and assign an ID.

caption


Sometimes, there is this warning which says “Hard-coded Text”. You may ignore it for now. (Incase you want to resolve this, you need to define your string in the string.xml file(res→ values→ string.xml)

Read about it here Hard Coded String


Also as you can see,there are two large yellow rectangles in the design view. Those are the two text views I have added. One for the control : (Id= tvcontrol) and another for result(Id= tvresult)

  • tvcontol- basically to show the computation
  • tvresult- to show the computed result.

Our XML file is complete.


Working on the Java file

First of all, we declare all the variables that we need.

caption

For the buttons part, you can also use arrays. But here for simplicity we will define them separately. We will have to define actions(add/sub…) and two values(the first has been initialized with null) and ofcourse the two text views(info and result).

Next, As the user clicks on a button we need to read that button and update info.

First of all, we will have to set up ids. I have declared a function and made a function call to the same

caption
Declared function setupUIViews
Again, an array would have been a savior to such an ugly code.


caption
Calling the function setupUIViews()



Also, we have written the onSetClickListener function for all our buttons:

  • For the buttons corresponding to numbers 0 to 9:

When a user clicks on a particular button, this functional code is executed and the info is updated accordingly.

  • For the buttons corresponding to the operators(+,-,*,/,=):

We need to compute according to the chosen operator, update info and result.We will use a compute() function and update the action according to the operator.

Refer to the figure below.

  • For the clear button:

If our info is not null: We need to update info. We will have to delete the last character of the info(or in other words display the string upto (size-1)

If the result has already been computed: We need to set text in result and info to be null


caption



Did we miss something? Ofcourse, we haven’t declared the COMPUTE function: For the Compute function, we need to calculate our result according to the action, we will use Switch-Case for that.

Wait, but there is a catch. We will have to check whether the first value is not null. If it is null, we will have to accept val1 otherwise we will accept val2 and proceed to calculation.


caption

Now, what I have done is updated val1, you might be wondering why? Right?

Suppose you want to calculate : 12*9-79

  • If you don’t update val1, and rather return the result , you won’t be able to perform a multi-step calculation, or rather your result will be 12*9 and - 79 will have no significance.

But updating val1 will result in val1 becoming 108 after the first step, and then the next step continues.

Well, our code is ready. You may now run your app on your virtual device.

caption


Building the APK file

From the Menu Bar- Build--> Build Bundle(s)/APK(s)--> Build APK(s)

Your APK file is built and stored in your local disk:

In Android Studio Projects→ Under Your Project Name→ App → Build→ Output→ APK→ Debug→ app-debug.apk

This is your required APK file. You can rename it, install it and send it to your friends.

Congratulations on Building Your First App.