Download Android start programming lecture

ANDROID – A FIRST PROGRAM
L. Grewe
Using AndroidStudio –basic
Android


Lets do a “Hello World Project”
Start up AndroidStudio (assume you have installed
with Android support)
Hello World Project – Android Studio
1.
2.
3.
4.
5.
App name, package
Target
Activity type
Name of Activity
Now finish to setup
Hello World Project---basic folders &files
Folders
•
Number of folders and files are autogenerated when you create a project
File of note
AndroidManifest.xml – like a ship’s manifest
it tells us the components of our app
Project basics….
Android Studio



manifests/AndroidManifest.xml: an
XML file describing the application
being built and what components –
activities, services, etc. – are being
supplied by that application
java/: holds the Java source code
for the application
res/: contains
layout files
 drawable =icons
 menus
 values = static files like strings.xml

Project basics….
Android Studio

Gradle Scripts/: an gradle script
for compiling the application and
installing it on the device
(integrated with IDE—don’t see it
there)

gradle.properties: a property file
used by the compiler
Manifest file – AndroidManifest.xml




an XML file describing the application being built and what
components – activities, services, etc. – are being supplied by
that application
Initially created by IDE
must declare all activities, services, broadcast receivers and
content provider of the application.
must contain the required permissions for the application.
 For example if the application requires network access it must be specified
here.
Hello World Project – AndroidManifest.xml
Define Application –see res/strings.xml
Manifest file
–see res/drawable-resolution/icon.png
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.helloworldandroid"
android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".HelloWorldAndroid"
android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
Here have intent created for
<uses-sdk android:minSdkVersion="4" />
This acitivity that is associated with
</manifest>
launch of application
The Layout
Interface specifications
Interface ---2 options

Do it with XML file(s)



Many modern frameworks whether for mobile programming like
Android or iOS or for other platforms have gone to specifying
GUI (graphical user interface) elements in static XML files rather
than programming source code (like java).
The reason –it allows separation of the look (view) from how the
code works (model and controller). Have you ever heard of
Model View Controller –it is a famous software engineering
framework that programmers try to achieve in their software
systems.
Do it with Java code.

This has similarities if you have created desktop GUI Java
applications
OPTION 1: The Layout with XML
We are going to discuss a
specific resource in the res
folder
res/layout/activity_main.xml

The Layout-the interface

res/layout/main.xml = contains layout for interface
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
</LinearLayout>
The above will create an interface in vertical (versus portrait) mode that fills the parent
Both in width and write and wraps and content as necessary.
The Layout-the interface

res/layout/main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>


android:orientation = vertical (versus portrait) mode.
that fills the parent both in width and write and wraps and
content as necessary.
Vertical
Landscape
Hello World Project
Creating a Layout file—2
options
1) Do it manually –type it in
Layout file
2) For Layouts corresponding to GUIs
You have a drag and drop option
we will learn about in a later lecture
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
</LinearLayout>
This adds a “TextView” to the interface and this has the text referenced
by @string/hello in it.
Using IDE to Visually
Create XML file


Visual creation of XML file
AndroidStudio: New->
Layout resource file
 Select
layout (root)
 &qualifiers as needed
 drag & drop
Visually Creating XML interface

I dragged and dropped an EditText view and a
Button. Below I show you the corresponding code.
res/layout/main2.xml
<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText android:text="@string/hello" android:id="@+id/editText1" android:inputType="textMultiLine"
android:layout_width="169dp" android:layout_height="115dp" android:layout_x="11dp"
android:layout_y="20dp"></EditText>
<Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="Button" android:layout_x="27dp" android:layout_y="146dp"></Button>
</AbsoluteLayout>
Lets look at the “Main” class
It is an Activity
Activity is a class in the Android sdk
(android.app.Activity)
It represents us now the main application itself—we
will learn more about what this means in a near
future lecture –remember we are at the beginning!
Create an Activity with simple text
Interface ……first


An Android user interface is composed of
hierarchies of objects called Views.
A View is a drawable object used as an element in
your UI layout, such as a button, image, or

In the next code will create a text label. Each of these
objects is a subclass of the View class and the subclass
that handles text is TextView.
Hello World Project – here we are creating
interface with programatically/code
Helloworld.java

package com.teach.helloworld;
import android.app.Activity;
import android.os.Bundle;
create a TextView with the class constructor,
which accepts an Android Context instance as
its parameter.
•Context is a handle to the system
•provides services like resolving resources,
•obtaining access to databases and preferences, etc.
The Activity class inherits from Context, and because
your HelloAndroid class is a subclass of Activity, it is
also a Context. So, you can pass this as your Context
reference to the TextView.
public class helloworld extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
TextView tv = new TextView(this);
tv.setText("Hello, Android.....Lynne");
setContentView(tv);
}
}
text content is set with setText(CharSequence)
pass the TextView to setContentView() in order to display
it as the content for the Activity UI.
What we just learned



You will have a class created for you that is your
android application, i.e. “ helloworld” and it extends
Activity
Your application is an Activity and that also descends
from Content
Context = class that gives us access to System
•
•

provides services like resolving resources,
obtaining access to databases and preferences, etc
View = is a GUI element, there are different kinds
like the TextView we are using
•
.constructor needs Context instance (we used our App)
R.java
Automatically created by IDE when created
project
Hello World Project
R.Java == generated by project, this points to various resources in
your project see res folder.
DO NOT EDIT THIS –unless you know what you are doing.
/* AUTO-GENERATED FILE. DO NOT MODIFY.
*
* This class was automatically generated by the
* aapt tool from the resource data it found. It
* should not be modified by hand.
*/
package com.example.helloworldandroid;
public final class R {
public static final class attr {
}
public static final class drawable {
public static final int icon=0x7f020000;
}
public static final class id {
public static final int button1=0x7f050001;
public static final int editText1=0x7f050000;
}
public static final class layout {
public static final int main=0x7f030000;
public static final int main2=0x7f030001;
}
public static final class string {
public static final int app_name=0x7f040001;
public static final int hello=0x7f040000;
}
}
TIP: sometimes when you are compiling your code you can have
problems with the R.java file (which you DON’T edit) –what is going
on? Somehow the R.java is out of sync with the project
resources…..WHAT TO DO? do a “Build->Clean Project” and it will
regenerate R.java for you
Why have R.java?
It is used it in your code to point to resources.
Lets look at an example where we alter our
onCreate method to point to the interface
described in the res/layout/main.xml file….so
now interface specified with XML and not
programmatically with code.
Where is R.java
Eclipse: gens/R.java
Android Studio: build/generated/source/r/debug/yourpackage -name/R.java
(Example:
C:\Users\Lynne\AndroidStudioProjects\HelloWorldAndroid\app\build\g
enerated\source\r\debug\com\example\lynne\helloworldandroid)
Android studio: you can not
see
the R.java in IDE
Go to file system
Alter your Activity to Use an XML
layout file

package com.example.helloandroid;
import android.app.Activity;
import android.os.Bundle;
Now going to change the
code so it uses instead an
XML file for its intervace
public class HelloAndroid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main); This line of code says
use the xml layout file called
}
main.xml that is pointed to
}
inside your R.java file in
memory
Interfaces ---XML-based layout



Previous HelloWorld example has interface created
in java code.
ALTERNATIVE: XML-based layout files. Example
that duplicates previous.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout……….>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="@string/hello"/>
Above located in res/layout/main.xml
Here is our main.xml file
that will be used and do
the same thing as our
previous java code –show
a TextView
XML interface

Lets understand the XML
Tag used to describe our
TextView
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="@string/hello"/>

xmlns:android XML namespace declaration that tells the Android tools that you are
going to refer to common attributes defined in the Android namespace. The
outermost tag in every Android layout file must have this attribute.

android:layout_width This attribute defines how much of the available width on the
screen this View should consume. As it's the only View so you want it to take up the
entire screen, which is what a value of "fill_parent" means.
android:layout_height This is just like android:layout_width, except that it refers to
available screen height.

android:text This sets the text that the TextView should display. In this example, you
use a string resource instead of a hard-coded string value. The hello string is defined
in the res/values/strings.xml file.
Wow! That’s a lot to remember ---aren’t you glad we have an API online to
look it up ---better yet is the drag and drop option to make interfaces!!!
More on resources
The res directory
We mentioned res folder
Android Studio
res/ directory




res/layout/ : contains one or more xml files that
define interfaces
res/values/strings.xml : file where you specify
strings (constants) that you can use in your program
res/drawable-* : gives file use for different
resolutions like icon.jpg. *=hdpi (high),
mdpi(medium), ldpi (low). Depends on device what
mode it can/may be running in.
res/menu/ : contains one or more xml files for
menus
Event Handling
So we have an interface what can we do with it.
Event Handling = code that responds when
“events” happen. For GUI elements we usually
have events associated with them. For example,
a button has the event of hitting the button.
Widget : Views that have events


For a list of the widgets provided by Android, see
the android.widget package.
Some Examples
 Button
 CheckBox
 DatePicker
 EditText
 ImageView
 SearchView
 Spinner
There are more ---here are a
few.
Event Handling


3 steps:
1) Decide what events to respond to
2) Create a listener to respond to each
event
3) Register the listener to the
corresponding widget
Decide what Widgets who’s events to process
Define an event listener and register it with the
View.
 View.OnClickListener
(for handling "clicks" on a View),
View.OnTouchListener (for handling touch screen events
in a View), and View.OnKeyListener (for handling
device key presses within a View)

http://developer.android.com/guide/topics/ui/uievents.html details more
Lets add a Button to a programbased interface


Step 1: Add button
Step 2: Register Event Handler
 TWO
OPTIONS – separate class to handle event(s), OR
have the Activity containing the button do the event handling

Step 3: Implement Event Handler…for a Button
means implementing the View.OnClickListener
interface
Event handling done by Activity
itself –one option


Here code to handle is inside Activity itself
public class ExampleActivity extends Activity implements OnClickListener {
protected void onCreate(Bundle savedValues) {
...
Button button = (Button)findViewById(R.id.corky);
button.setOnClickListener(this);
}
// Implement the OnClickListener callback
public void onClick(View v) {
// do something when the button is clicked
}
...
}
This option is okay only if the
event handling code is simple
and you will not reuse it ever
---if the code is longer or will
reuse make a separate class
Event Handling - here have a
SEPARATE class
EVENT HANDLING CODE in separate object mCorkyListner
// Create an anonymous implementation of OnClickListener
private OnClickListener mCorkyListener = new OnClickListener() {
public void onClick(View v) {
// do something when the button is clicked
}
};
Better for readability and
reuse
//Now inside your Activity class
protected void onCreate(Bundle savedValues) {
...
// STEP 1: Capture our button from layout
Button button = (Button)findViewById(R.id.corky);
// STEP 2: Register the onClick listener with the implementation above
button.setOnClickListener(mCorkyListener);
...
}
Run your code
Depends on IDE
Running code


Will Run in the Emulator
Android Studio: Run->”Run app” or “Debug App”
You should learn to run both on the emulator AND on a physical
device. TO use features of a phone like GPS, etc. it is often
required to run on a phone
Running code


TIP: Emulator can take a long time to load at first---be patient and keep it up---just re-run after
changes and won’t have to relaunch emulator, will
just load up new app.
Look if you have Intell Virtualization speed up,
check out GPU and snapshot options –search
online for current info on these tips