` CS151

CS 151 - Lecture 18

Cover page image

Android Programming

Mobile OS developed by Google
Open source (Apache licensed)
Based on Linux and Java (but not the JVM)
Worldwide market share > 85% in 2016
Safari book http://0-proquest.safaribooksonline.com.catalog.sjlibrary.org/9780134401959
Useful snippets https://github.com/codepath/android_guides/wiki

First Android App

Android app consists of activities
Activity = single screen with UI
Transition between activities as needed
A program can use an activity of another program (e. g. camera)

Simplest activity:

public class MainActivity extends AppCompatActivity {
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
}

Activities must be declared in AndroidManifest.xml

<activity android:name=".MainActivity">
   <intent-filter>
      <action android:name="android.intent.action.MAIN" />
      <category android:name="android.intent.category.LAUNCHER" />
   </intent-filter>
</activity>

Layouts

Can use programmatic layout, like in Swing
Much more common to specify layout in XML
- In res/layout directory
LinearLayout lays out components horizontally or vertically
RelativeLayout lets you specify component relations (such as “this image below that text”)
IDE has drag-and-drop layout editor
Be sure to look at the XML

Load in the onCreate method:

 setContentView(R.layout.activity_main);

Resources

String resources should be declared in res/values/strings.xml
Those strings can be translated to other languages
- E.g French strings res/values-fr/strings.xml

Refer to as

<TextView ... android:text="@string/app_greeting"/>

Image resources go to res/drawable

<ImageView ... android:src="@drawable/spirit_icon"/>

Can provide different resolutions since screen DPI varies widely (ldpi ... xxxhdpi)
- E.g. res/drawable-xhdpi/spirit-icon.jpg

Lecture 18 Clicker Question 1

What are the most feared words in the English language?

I'm from the government and I'm here to help you
Honey, we need to talk
We're doing this for your own good
But it builds on my machine

Build Automation

Reproducible builds happen outside your IDE
These days, generally on a build server
Android uses gradle for build automation
Android Studio puts gradlew into the root of your project
Build with
```
./gradlew assembleDebug
```

Run with

emulator -list-avds
emulator -avd Nexus_4_API_16 &
adb install -r app/build/outputs/apk/app-debug.apk
adb shell am start -n "edu.sjsu.cs151.myapplication/.MainActivity"

IDs

Can specify TextView text declaratively.
- <TextView ... android:text="Fred">
- <TextView ... android:text="@string/protagonist">
Won't work if we need to update text dynamically
Assign an ID to each component
Use property pane in GUI builder
In XML, set android:id="@+id/result"

Get as R.id.result in Java code

TextView t = (TextView) findViewById(R.id.questionText);
t.setText("How old is Fred?");

Buttons

Add a listener to a button:

Button button1 = (Button) findViewById(R.id.button1);
button1.setOnClickListener(
   new View.OnClickListener() {
      @Override public void onClick(View arg0) {
         ...
   }});

Caution—this is Java 7
- No lambdas (but Android Studio can give you the illusion by “folding” the listener)
- Must declare local variables final if the listener accesses them

Lab

Work with a buddy
Both of you submit a screen shot of your app on androidLab/screen2.png via Git

Image View

Pick up with the app that you built when you ran through https://developer.android.com/training/basics/firstapp/running-app.html
Download one of the SJSU logos (or any image that's not too large)
Rename if necessary so that the name only has lowercase letters, digits, and underscores.

Copy it into the src/main/res/drawable directory of the app, e.g.

cp ~/Downloads/sjsu_logo.jpg ~/AndroidStudioProjects/MyApplication/src/main/res/drawables

Add an ImageView in the layout below the greeting
Add this to the <ImageView ...> element:
```
android:src="@drawable/sjsu_logo"
```
You can either edit the XML text or set the src property in the property window.
- Note: No .jpg extension!
Run the app. What happens?

Buttons

Make a new app, just like before, and call it QuizApp. When you set up the app, make sure the package is set to edu.sjsu.cs151.quizapp.
Add this TrueFalseQuestion.java class.
Make a layout with a text field, and below two buttons labeled True and False, and below another text field. It doesn't have to look pretty.
Rename the text fields into questionText and resultText. That's best done in the property sheet because then Android Studio will rename all references. Rename the buttons trueButton and falseButton.
In the main activity, make four instance variables questionText, resultText, trueButton, and falseButton. Initialize them by looking up the component by ID.

Add this to the main activity:

  final TrueFalseQuestion q1 = new TrueFalseQuestion("Was the iPhone the most popular smartphone in 2006?", false);
questionText.setText(q1.getText());

Add listeners to the trueButton and falseButton.
In each of the listeners, add the code to set the resultText to “Correct” or “Incorrect”.
Run your app and take a screen shot.

Extra time? Localize your app

Go back to the first application. Look into the layout XML. Notice how the string “Hello, World!” is hardwired into the XML.
That's reprehensible. Instead, visit res/values/strings.xml and add a string named app_greeting.
In the layout XML, change the literal string to "@string/app_greeting"
Try it out—you should still see the same greeting.
Now go back to strings.xml and locate the link to the translations editor. Click it. Locate the globe icon in the upper left corner. Pick some language that you know. Provide the translation of “Hello, World!”
Also provide a translation of app_name.
Run your app. In the phone's home screen, select settings, and change the phone's language to what you just provided. Do you see your localized version?