introduction to android studio - eitp.gov.hk · let’s code. go to mainactivity •first, we go to...

40
Introduction to Android Studio

Upload: others

Post on 08-Oct-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Introduction to Android Studio

Page 2: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Android StudioThe Official IDE for Android• Android Studio provides the fastest tools for building apps on every

type of Android device.

• World-class code editing, debugging, performance tooling, a flexible build system, and an instant build/deploy system all allow you to focus on building unique and high quality apps.

https://developer.android.com/studio/index.html

Download Link:

Page 3: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Instant Run

• Push code and resource changes to your app running on a device or emulator and see the changes instantly come to life.

• Instant Run dramatically speeds up your edit, build, and run cycles, keeping you "in the flow."

Page 4: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Intelligent code editor

• Write better code, work faster, and be more productive with an intelligent code editor that helps you each step of the way.

• Android Studio is built on IntelliJ and is capable of advanced code completion, refactoring, and code analysis.

Page 5: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Develop for all Android devices

• Target multiple form factors with a single project to easily share code among your different versions of your app.

• Android Studio provides a unified environment to develop apps for Android phones, tablets, Android Wear, Android TV, and Android Auto.

Page 6: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Building Your First AppAfter you've installed the Android SDK, start with this class to learn the basics about Android app development.

Creating an Android Project

In Android Studio, create a new project:

If you don't have a project opened, in the Welcome to Android Studio window, click Start a new Android Studio project.

If you have a project opened, select File > New Project.

In the New Project screen, enter the following values:

Application Name: ”Math App"

Company Domain: "example.com"

Android Studio fills in the package name and project location for you, but you can edit these if you'd like. Click Next.

Page 7: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

• In the Target Android Devices screen• Select API16: Android 4.1 (Jelly Bean)

Page 8: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

• In the Add an Activity to Mobile screen• select Basic Activity and click Next.

Page 9: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Keep defaults setting and click Finish

Page 10: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it
Page 11: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

SDK Manager

• Click SDK Manager on upper tool bar

• Make sure Android 4.1 (Jelly Bean) is clicked and installed.

Page 12: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Your Virtual Devices – AVD Manager

Make sure you have a AVD created.

If not, click Create Virtual Devices. Choose Nexus5 4.95”

Page 13: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

System Image

• Select Marshmallow 23 x86 • For Android 6.0

When finish, close and back to

main windows.

Page 14: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

• On your left side.• res = Resourse

• Activity_main.xml = user interface, items ..

Page 15: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

In activity_main.xml

• Component Tree content the main level of layout of the App

• You will see the toolbar; include; fab represent items in the preview scene of the phone.

Page 16: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

In content_main.xml

• In here, it’s the work place we are going to do with.

• We can edit / drag & drop/ on the layout

Page 17: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Open java – com.example.math – MainActiviry

• We are going to CODE now!

Page 18: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

The App Layout

Page 19: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Go to content_main.xml

• Select the “Hello World” , See all Properties .

• Layout_width > match_parent• textAlignment > center• TextSize > 50sp• Text > 0• Id > totalTextView

Page 20: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Add a text

• Drag a “TextView” , in the middle of screen , change the text to “What is”

• TextSize = 25

Page 21: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Add a Number Field

• Number (Decimal)

• Hint > Enter Percentage

• textAlignment > center

Page 22: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Copy and Paste

• Copy “What is” and create “%” & “of”

• Copy ”Enter Percentage” and create” Enter Number”

Page 23: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Add a Button

• Add button in the middel

• Change text to “CALCULATE”

Page 24: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Add a button

• background> …> Red

• Text Color > …> White

Page 25: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Change the bar to red color• Go to “activity_main.xml”

• Select the bar set to Red

Page 26: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Delete the fab button

>

Page 27: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Go to MainActivity

• onCreate

•Android Activity Life Cycle

Page 28: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Android Activity Life Cycle

• Activity is a full-screen user interface of an app.

• Comprehensive app consists of interaction between one or more activities.

• Activities are managed by activity stack of Android system.

• The foreground (running) activity is placed on at the top of activity stack.

Page 29: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

States of Activity:Active, Paused, Stopped, Dead:

• Active:• Running Activity (foreground).

• Only ONE activity is active each time.

• Paused• The activity is temporary stopped. (i.e., incoming call, switch to other activity),

the paused activity can go back to active if needed.

• Cannot interact with users.

Page 30: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

• Stopped• The activity is off screen and does not run any task. i.e., you quit the app by

pressing home button.

• Dead/Inactive• The activity is switched off manually. (force-quit)

• Finish() is called.

Page 31: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

• Flow of activity life cycle.

Page 32: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Activity lifecycle functions:

• onCreate() – initialize your app.

• onDestory() – release resource.

• onPause() – store activity stage and data.

• onResume() – restore stored data.

Page 33: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Let’s code. Go to MainActivity

• First, we go to create 3 variable for

• Ans, %txt , numtxt

• When you type “TextView”, it will show a short cut of “TextView(android.widget).

• Press enter to select.

• It’s help you to create the import element on the top of the code.

Page 34: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Before we code, go back to content_main.xml

• See the id of Enter text area.

• Change the editText > percentageTxt

• Change the editText2 > numberTxt

• Change the button > calcBtn

Page 35: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Button

• variable type = Button

• variable name = calcBtn

• Which target the “calcBtn” form our design screen button “CALCULATE”

Page 36: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

OnClickListener()

Page 37: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

We yet define the TxtView/EditText

• Do this here.

Page 38: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Start to enter the math method

Page 39: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Delete fab that we don’t need

Page 40: Introduction to Android Studio - eitp.gov.hk · Let’s code. Go to MainActivity •First, we go to create 3 variable for •Ans, %txt , numtxt •When you type “TextView”, it

Run the App