Androiddevelopmentthe first app

Andoid vs iOSwhich is better?

Short answer: neither

Proponents on both sides

For an iOS side, see this article on TechCrunch (by the developer of the SMS/MMS app Emu:

The Fallacy of Andoid First

BasicsApps are composed of activities and layouts

an activity is an instance of the activity class manages user interaction with a screen of info subclass it to implement app functionality may have many activities for a complex app

a layout defines a set of user interface objects and their position on the screen uses XML each definition creates an object on the screen

Create the projectin Eclipse:

File->New->Android Applicationname: GeoQuizpackage: edu.ithaca.android.geoquizTarget SDK: API 16: Android 4.1 (Jelly Bean)

doesn’t matter as long as you’ve downloaded this in Eclipse

click next

Configuring the projectunclick “Create custom launcher icon”

leave “Create activity” checked

uncheck “Mark this project as a library”

check “Create Project in Workspace”should not have to change location

uncheck “Add project to working sets”

click next

Configuring Project click on “Blank Activity”

click next

Name the activity subclass QuizActivity convention to end name with “Activity” but not required

layout name will fill in automagically. Provides recommended naming style.

click finish

Laying out the user interface Open the layout file

in the folder res/layout named activity_quiz.xml

select the “activity_quiz.xml” tab at the bottom of the middle screen of Eclipse. we will ignore the graphical layout tool for now we will use this file to create our view.

should have a framelayout in the folder res/layout for fragments or partial layouts named fragment_quiz.xml we will ignore this file; we’re not going to use fragments

Default Layout (part 1)in activity_quiz.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/container"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="edu.ithaca.geoquiz4.QuizActivity"

tools:ignore="MergeRootFrame" />

Default Layout (part 1)in fragment_quiz.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="edu.ithaca.geoquiz4.QuizActivity$PlaceholderFragment" >

<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" />

</RelativeLayout>

Default Layout (part 2)

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/hello_world" />

</RelativeLayout>

Layout filedefault fragment_quiz.xml file has two widgets

RelativeLayout TextView

Widgets are the components of a viewevery widget is an instance of the View class or

one of its subclasses

Click the Graphical Layout tab at bottom to see how the layout looks

LayoutQuizActivity requires 5 widgets:

a vertical LinearLayout a TextView a horizontal LinearLayout two Buttons

LayoutOverwrite all the text in activity_quiz.xml with this

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="vertical" >

<TextView android:text="@string/question_text” android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="24dp" /> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal">

<Button android:id="@+id/true_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/true_button" />

<Button android:id="@+id/false_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/false_button" />

</LinearLayout>

</LinearLayout>

There will be errors!

+ sign means that you are creating the resource not just referencing it

The view hierarchy

Widget Attributesandroid:orientation

determines whether the children appear vertically or horizontally

the order in which children are defined determines the order in which they appear on screen.

in vertical, first child is topmost in horizontal, first child is leftmost (unless right-to-left

language)

Widget Attributesandroid:text

tells widget what text to displaynot literal strings (thought they could be)instead references to string resources

a string that lives in a separate XML file called the strings file

allows for easy localization

String Resources every project has a default strings file named strings.xml

open the strings.xml file in res/values click on strings.xml tab at bottom

remove the hello_world string, add three new strings

<string name="app_name">GeoQuiz</string> <string name="question_text">The Pacific Ocean is larger than the Atlantic Ocean.</string> <string name="true_button">True</string> <string name="false_button">False</string> <string name="correct_toast">Correct!</string> <string name="incorrect_toast">Incorrect!</string> <string name="menu_settings">Settings</string>

keep the menu_settings or you’ll get lots of errors!

String Resources whenever you refer to @string/false_button

in any XML file in the GeoQuiz project, get “False” at runtime.

save strings.xml errors in fragment_quiz.xml should go away may get warnings; can ignore.

You can have multiple strings files in your project must be in res/values must have a resources root element must contain child string elements your strings will be found automagically

Creating View ObjectsHow do XML elements become View objects?

see code on next slide contains two Activity methods

onCreate(Bundle) called when an instance of the activity subclass

(QuizActivity) is created. calls method setContentView(int layoutResID) this method inflates a layout and puts it on the screen also asks the fragment manager to add the

appropriate fragments each widget is instantiated as defined by its attributes you specify which layout by passing the layout’s

resource ID (see later)

onCreateOptionsMenu(Menu)

Creating View Objects

protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_quiz);

if (savedInstanceState == null) { getFragmentManager().beginTransaction() .add(R.id.container, new PlaceholderFragment()) .commit(); } }

Delete this method; we won’t use fragments!

Resources and resource IDS

resource: a piece of your app that is not code images, audio files, XML files

resources live in a subdirectory of the res directoryactivity_quiz.xml lives in res/layout/strings file lives in res/values/

Resources and resource IDS

resource: can see by opening the file R.java it’s in the gen/edu.ithaca.android.geoquiz

directorythe edu.ithaca.android.geoquiz name depends

on what you named your package.this file is generated by the build process

won’t be there until you build!

you should see a value similar to

public static final int activity_quiz=0x7f030000;

Resources To access a resource in code use its resourceID

resource for our layout is R.layout.activity_quiz Android generates resource IDs for entire layouts and

each string but not individual widgets

to generate a resourceID for a widget must include an android:id attribute in the widget’s definition

For each button add the attribute:

android:id="@+id/true_button”

or

android:id="@+id/false_button"

the + sign means to create the id

Wiring up widgetsCan access buttons via their resource IDs

Add the bold lines to QuizActivity:

public class QuizActivity extends Activity { private Button mTrueButton; private Button mFalseButton;

@Override protected void onCreate(Bundle savedInstanceState) {

these will cause errors: the Button type needs to be imported! see next slide!

the m prefix is an android convention

Wiring up widgetsTo fix the import error can organize your imports

To organize press:Command+Shift+O on macCtrl+Shift+O on windows/linux

this will put in the necessary imports

Wiring up widgetsTo wire up buttons:

get references to the inflated View objectsset listeners on those objects to respond to user

actions

Get ref to widgetsCan get a reference to an inflated widget by

calling:public View findViewById(int id)this method accepts a resource ID of a widget it returns a View object

Add to QuizActivity.java see next slide

Get ref to widgetsprotected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);setContentView(R.layout.activity_quiz);

mTrueButton = (Button)findViewById(R.id.true_button);

mFalseButton = (Button)findViewById(R.id.false_button);

return true; }

Setting ListenersAndroid apps are event driven

When app is waiting for a specific event it is listening for that event

A listener is an object that implements a listener interface for that event.

listener interfaces are provided by Android for most events

Setting ListenersOur app: want to listen for a mouse click

Must implement the View.OnClickListener interface

Setting Listenersprotected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);setContentView(R.layout.activity_quiz);

mTrueButton = (Button)findViewById(R.id.true_button);

mTrueButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) { // TODO Auto-generated method stub

}});

mFalseButton = (Button)findViewById(R.id.false_button); return true; }

We’ll fill this in shortly!

Anonymous ClassesThe listener on the last slide is an anonymous

inner class

Most listeners in Android use this technique

The anonymous inner class implements the OnClickListener interface.means it must implement the interface methods in this case, there is only one: OnClick(View)

Must set a similar class for the false button (next slide)

Setting Listeners // mTrueButton code is still here, I just took it out to save room mFalseButton = (Button)findViewById(R.id.false_button); mFalseButton.setOnClickListener(new View.OnClickListener() {

@Overridepublic void onClick(View v) { // TODO Auto-generated method stub

}});

return true; }

We’ll fill this in shortly!

ToastsA pop-up message in Android is called a toast

A toast is a short message that informs the user of something but does not require any input or action.

We’ll make toasts that announce whether the user answered correctly or not.

ToastsTo make a toast call the following method from the Toast

class:

public static toast Toast makeText(Context context, int resId, int duration)

The Context parameter is typically an instance of an Activity class.

The second parameter is the resource ID of the string that the Toast will display needs the Context to find and use the string’s resource ID

Third parameter is one of two Toast constants that specify how long the toast should be visible

ToastsAfter you make a Toast, use Toast.show() to get

it on the screen.

see next slide

Making Toastsfor mTrueButton handler:

public void onClick(View v) {Toast.makeText(QuizActivity.this,

R.string.incorrect_toast,

Toast.LENGTH_SHORT).show();}

QuizActivity.this indicates the correct context

Cannot just say “this” because we’re inside an anonymous class!

Making Toastsfor mFalseButton handler:

public void onClick(View v) {Toast.makeText(QuizActivity.this,

R.string.correct_toast,

Toast.LENGTH_SHORT).show();}

Runright click on name and choose

Run As->Android Application

To run on device, on a Mac just connect device via USB.on Windows may need to install the abd (Android

Debug Bridge).may have to download from your device

manufacturer’s websitemust set device up (see next slide).

Setting up device Step 1Must set up device to accept applications that

are not from Google Play if device is running Android 4.1 or earlier, go to

SettingsApplications. Make sure Unknown sources is checked.

if device is running Android 4.2 or later, go to SettingsSecurity. Make sure Unknown sources is checked.

Setting up device Step 2Must enable USB debugging in the device.

Android 4.0 and earlier: SettingsApplicationsDevelopment and enable USB debugging

Android 4.1 or later. Must enable developer options. Go to SettingsAbout Tablet/phone and press Build Number 7 times.

Return to Settings see Developer Options and enable USB Debugging.

DebuggingTo see what’s happening on the device or the

emulator, see the LogCat window at the bottom of Eclipse (next to the console window).

If it’s not showing go to Window Show View OtherExpand Android and double-click on LogCat