Introduction to Software Engineering Fall...
Transcript of Introduction to Software Engineering Fall...
![Page 1: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/1.jpg)
Developing Android ApplicationsIntroduction to Software Engineering – Fall 2015
Updated 7 October 2015
![Page 2: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/2.jpg)
Android Lab 1Introduction to Android
Class Assignment: Simple Android Calculator
2
![Page 3: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/3.jpg)
Class Plan
• Introduction
• Android Studio• Installation Guide
• Project Setup
• Android Simulation Setup
• Interface Setup
• Basic Concepts
• Lab Assignment: Calculator
3
![Page 4: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/4.jpg)
Introduction
4
![Page 5: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/5.jpg)
What’s Android
• The world's most popular mobile platform
• Powerful development framework• Android Developer Tools offer a full Java IDE with advanced features
for developing, debugging, and packaging Android apps
• Open marketplace for distributing your apps• One time 25$ developer registration fee
5
![Page 6: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/6.jpg)
Version History
Cupcake Donut Eclair Froyo Gingerbread Honeycomb
1.5API LVL 3
1.6API LVL 4
2.0 – 2.1API LVL 5-7
2.2 – 2.2.3API LVL 8
2.3 – 2.3.7API LVL 9-10
3.0 – 3.2.6API LVL 11-13
Major (3) Minor Major Minor Major (9) Major (11)
6
Ice Cream Sandwich Jelly Bean KitKat Lollipop
4.0 - 4.2API LVL 14-15
4.1 – 4.3.1API LVL 16-18
4.4 – 4.4.4API LVL 19-20
5.0 – 5.1.1API LVL 21-22
Major Minor Minor Major
Each version of Android introduces new features. Some include smaller changes, optimizations and bugfixes while others greatly update the
operating system architecture.
![Page 7: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/7.jpg)
Android SDK
• The Android SDK provides access to the API libraries and developer tools necessary to build, test, and debug apps for Android.
• http://developer.android.com/sdk/index.html
• Available Tools• ADT Bundle (based on Eclipse IDE)
• Support being Discontinued
• Android Studio (IntelliJ IDEA)• Recently, Google accepted Android Studio as its official IDE.
• `
• NOTE: You only need one of the development tools!
7
![Page 8: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/8.jpg)
Device Testing Reminders:
• Windows:• See OEM USB Drivers document if drivers are necessary.
• MTP : Media Transfer Protocol
• Mac OS:• Android File Manager.
• PTP : Picture Transfer Protocol
• Enable USB debugging on your device.• On most devices running Android 3.2 or older, you can find the option
under Settings > Applications > Development.
• On Android 4.0 and newer, it's in Settings > Developer options.
Note: On Android 4.2 and newer, Developer options is hidden by default. To make it available, go to Settings > About phone and tap Build number
seven times. Return to the previous screen to find Developer options.
8
![Page 9: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/9.jpg)
Installation(Android Studio)
9
![Page 10: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/10.jpg)
Installation
• Download and Install Android Studio
• Just keep pressing next/accept
• Select your UI
• Update the tools
• Done!
10
![Page 11: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/11.jpg)
Creating a ProjectAndroid Studio
11
![Page 12: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/12.jpg)
The First Simple App: “Hello World!”
12
Select “Start New A.S. Project”
![Page 13: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/13.jpg)
13
Package name displayed on Google Play
Project Name viewed on Project List
Domain of the group developing the app
The developer name is generally based on reverse .com domain hierarchy.
[country code].[top level domain].[business name].[subdomain].[team]
Ex: br.com.firasoft.msp.jimmyfive
• Country Code, Subdomain and Team Fields are optional.
The package name is produced from Application Name and Company Domain.
You can edit the Package Name if necessary
![Page 14: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/14.jpg)
14
Project SDK Version
Use API LVL 15 during the tutorial.
After learning the ropes, you can develop andpublish apps for multiple variations of the AndroidOS.
![Page 15: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/15.jpg)
15
Activity Template
Special types of activities which haveminimum elements for their view (UI)
Select a Blank Activity for this exercise.
If you’d like to have special activities youshould update the minimum SDK version.
Example: Full screen Applications Startedbeing supported on 4.4 (API LVL 19)
![Page 16: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/16.jpg)
16
You can configure the naming scheme ofyour Activity, these details only affect thedeveloper side of things.
This is an opportunity for you to employ theknowledge you are learning in class.
By default Java uses Capitalized Camel Code as astandard for Classes, Interfaces and Camel Codefor Methods and Variables. Check Oracle’s websitefor more details:• http://www.oracle.com/technetwork/java/code
conventions-135099.html
![Page 17: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/17.jpg)
17
Textual XML EditorVisual Editor
Used for changing properties
For managing widgets
Android Virtual Device manager Palette for Buttons, EditTexts, Layouts, …
Current File
Android SDK Manager
![Page 18: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/18.jpg)
Android Virtual Device (AVD)
• An Android Virtual Device (AVD) is an emulator configuration that lets you model an actual device. It consists of :
I. A hardware profile: e.g., whether the device has a camera
II. A mapping to a system image: e.g. which Android version
III. A dedicated storage area on your development machine: e.g. the device's user data
IV.Other options: e.g. the emulator skin, appearance, and so on
18
![Page 19: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/19.jpg)
19
select Window > AVD Manager, or click the AVD Manager icon in the Eclipse toolbar
Click the “+” button to create a new AVD
![Page 20: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/20.jpg)
20
Select a device from the preset list or create your own by clicking the “New Hardware Profile” Button.
![Page 21: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/21.jpg)
21
![Page 22: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/22.jpg)
Hardware Limitations
Some computers limited hardware specs, and might struggle to emulate a device. If you are having issues starting a virtual
machine try one of the following solution:
Change any of the Device’s Configurations (pencil icon):
• Change the Architecture of the emulated device from x86 to armeabi-v7.
• Disable “Use Host GPU”
• Reduce the amount of RAM available (Advanced Settings)
22
![Page 23: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/23.jpg)
Installation(Eclipse + ADT)
(For the sake of time these slides are skipped in class. If you would like to continue with the Eclipse framework, please follow this tutorial)
If you are using Android studio, you can skip this step.
23
![Page 24: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/24.jpg)
Installation
• Download and Install Eclipse
• Just keep pressing next/accept
• Add ADT Plugin to the repository list• https://dl-ssl.google.com/android/eclipse/
• Accept all prompts
• Configure ADT• Install SDK or point to previously installed location
• Configure SDK Manager• Install Necessary Versions (Suggested API 21+)
24
![Page 25: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/25.jpg)
Install Eclipse
25
![Page 26: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/26.jpg)
Add Android ADT to Eclipse
26
![Page 27: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/27.jpg)
Install the Android SDK Tools
27
![Page 28: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/28.jpg)
Creating a ProjectEclipse + ADT
28
![Page 29: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/29.jpg)
The First Simple App: “Hello World!”
29
Select “Android Application Project”
![Page 30: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/30.jpg)
30
will be seen in Android devices
will be seen in Eclipse Package Explorer
an unique name forever (the app’s ID)
![Page 31: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/31.jpg)
31
To add and modify your own icon
To add the app’s first screen (activity)
![Page 32: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/32.jpg)
32
Be sure your icon meets the specifications defined in the Iconography design guide.http://developer.android.com/design/style/iconography.html
We can call this part of the wizard later to
modify the app’s icon
![Page 33: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/33.jpg)
33
Special types of activities which have minimum elements for their
view (UI)
![Page 34: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/34.jpg)
34
If you’d like to have special activities so there should be necessary support in the system
(minimum SDK version)
![Page 35: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/35.jpg)
35
It’s possible to specify the type of navigation for your activity (UI). The necessary elements will be added.
If you’d like to have special activities so there should be necessary support in the
system (minimum SDK version)
![Page 36: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/36.jpg)
36
The app’s icon and other bitmaps files (categorized based of their dpi)
Layout (physical structure) of activities will be put here. It’s based on XML and supported by a visual editor
All resources of the app (e.g. strings) should be registered in these sections (proper files). It helps memory management
and localization.
All Java files include launcher activity and other libs
![Page 37: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/37.jpg)
37
Textual XML EditorVisual Editor
Used for changing properties
For managing widgets
Android Virtual Device manager
Palette for Buttons, EditTexts, Layouts, …
![Page 38: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/38.jpg)
Android Virtual Device (AVD)
• An Android Virtual Device (AVD) is an emulator configuration that lets you model an actual device. It consists of :
I. A hardware profile: e.g., whether the device has a camera
II. A mapping to a system image: e.g. which Android version
III. A dedicated storage area on your development machine: e.g. the device's user data
IV. Other options: e.g. the emulator skin, appearance, and so on
38
![Page 39: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/39.jpg)
Managing AVDs with AVD Manager
• select Window > AVD Manager, or click the AVD Manager icon in the Eclipse toolbar
• Click New to create a new AVD
39
![Page 40: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/40.jpg)
Managing AVDs with AVD Manager (cont.)
• Fill out the details for the AVD and click OK.
• Select AVD Name in the list and click Start (be patient because execution
take time)
40
![Page 41: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/41.jpg)
Emulator
41
![Page 42: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/42.jpg)
User InterfaceBasic Concepts
42
![Page 43: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/43.jpg)
What does android provide?
• Pre-build UI components such as structured layout objects and UI controls
• Other UI modules such as dialogs, notifications, and menus (action bars)
• A mechanism to declare elements (e.g. layouts) through either source code or an XML file Easy and quick to create and manage UIs
Separation of logic from presentation
Reusable
can easily specify different layouts for different screen sizes (and densities, languages,...)
Easy to understand
43
![Page 44: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/44.jpg)
User Interface Elements’ Hierarchy
44
invisible view containers
invisible view containers
usually a UI widget
ViewGroups (Containers) are functional elements used to organize the UI.
Views are themselves the objects displayed on screen, such as textboxes, buttons, etc.
![Page 45: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/45.jpg)
Layouts
• defines the visual structure for a user interface
• Can be declared in either an XML file or source code (runtime)
• Common Layouts Linear
Relative
Web view
ListView
GridView
45
![Page 46: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/46.jpg)
Input Controls
• Android provides lots of inputs controls.
• You can build you own custom components.
• Common input controls Button
Text field
Checkbox
Radio button
Toggle button
Spinner
Pickers
46
![Page 47: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/47.jpg)
Second AppSimple Calculator: Time to work!
47
![Page 48: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/48.jpg)
Working with your UI
• The purpose of this task is to teachyou to use the tools available.
• Your android application does not needto look exactly like the one in theexample, but it needs to function as acalculator.
• To add a new object to your interface,drag the component from the Paletteto the Component Tree.
• Never drag components to the preview,Always to Component Tree.
• If you drag a component to the androidpreview screen it will very likely mess thewhole interface and make it harder for youto complete the task at hand
• Don’t forget to show your TA the appwhen you are done.
48
![Page 49: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/49.jpg)
Simple Calculator : Layout
1.Follow the steps in the first example and choose the name “Simple Calculator” for Application Name.
2.Remove TextView “Hello World”
3.Add a Layout (Vertical) under “resultEdit” and assign Id “mainlayout” to it
4.Add an EditText to MainLayout and change its id to “resultEdit”1.Text Field >> PlainText is the standard EditText object.2.To edit a property in an object you can double click it in the preview panel or in the
properties table.
5.Change ResultEdit’s “layout:width” property to fill_parent1.This will make your textfield occupy the whole width of the screen
(In Eclipse, use Outline environment for better managing of components)
49
![Page 50: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/50.jpg)
Simple Calculator : Step 01 Result
50
![Page 51: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/51.jpg)
Simple Calculator : Buttons
1.Add a HorizontalLayout to the VerticalLayout and name it “ButtonsLayout01”
1.Add four buttons to the HorizontalLayout you just created.
2.Rename Each buttons Id to the appropriate “btn0X “ name1. (e.g.: Button 1 will be called “btn01” and the Equals button “btnEQ”)
At this point your buttons might look unbalanced, with the last ones added being flattened on the right side of the screen. That is because the other
buttons are taking all the space available. To fix this do the following:
1.Change the property “layout:weight” in each button to 1.1.Now all buttons should be allowed the same space on the screen
regardless of the text in them.
51
![Page 52: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/52.jpg)
Simple Calculator : Step 02 Result
52
![Page 53: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/53.jpg)
Simple Calculator : More Buttons
1.Repeat the steps in the previous slide 3 times to create a 4 by 4 button matrix.
You will notice that the next row of buttons also get flattened, but this time to the bottom. To solve this issue, give the The HorizontalLinearLayouts the
same weight (layout:weight = 1) in the properties panel.
2. Add an extra button bellow the lowest HorizontalLinearLayout(this will be the Equals Button)1. Set the layout:width to fill_parent.
3. To fill any vertical empty space between buttons set their layout:height property to “fill_parent”
53
![Page 54: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/54.jpg)
Simple Calculator : Step 03 Result
54
![Page 55: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/55.jpg)
Simple Calculator : Buttons
• Change the text of all buttons as you can see in the picture.
• Change the id of all buttons as following:
• The numbers’ id should be started with “btn0”+its number. For example, for 1 button’s id should be “btn01”, for 0 should be “btn00”, and so on.
• For others see the table to the side.
55
Symbol ID
"C" btnClear
"." btnDot
"+" btnAdd
"-" btnMinus
"*" btnMultiply
"/" btnDivide
"=" btnResult
![Page 56: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/56.jpg)
Simple Calculator : Strings
• To separate strings from the layout code, follow these steps:1. Select a button in component tree section and click on it.
2. Navigate to the “Text” property in the properties panel.
3. Select the text property and click the triple dots button.
4. Select “New Resource” and then “New String Resource” in the Resources Window.
5. Define a name for the new button name (e.g.: button_07), add the actual button value (e.g.: 7), save the new resource.
6. Repeat this process for all numbers and operands.
56
![Page 57: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/57.jpg)
Simple Calculator (cont.)
• Add all onClick methods to MainActivity.java file.
• The methods’ signature should be as following:Public void <<methodName>>(View view) {
}
• E.g. onClick method for btnResult is:Public void btnResultClick (View view) {
}
• Don’t forget to import “android.view.View” and “android.widget.EditText”
• Now copy the code in the slides below to match the description above in your .java file.
57
![Page 58: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/58.jpg)
Simple Calculator (code section 1)
58
![Page 59: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/59.jpg)
Simple Calculator (code section 2)
59
![Page 60: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/60.jpg)
Simple Calculator (code section 3)
60
![Page 61: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/61.jpg)
Simple Calculator (code section 4)
61
![Page 62: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/62.jpg)
Simple Calculator (code section 5)
62
![Page 63: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/63.jpg)
Simple Calculator : Input Events
• Each view has its own Events (e.g. onTouchEvenet()) and must be override in order to have your own implementation.
• Instead of extending a view to have control events, use even lisetners
• An event listener is an interface in the View class thatcontains a single callback method. These methods will becalled by the Android framework. onClick() onLongClick() onFocusChange() onKey() onTouch() onCreateContextMenu()
63
![Page 64: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/64.jpg)
Simple Calculator : Button Functions
In order for your buttons to run the code in the java file they need to know what function they should call. To do so:
• Add onClick property to all buttons• In the “Design” view Set onClick property in the Properties panel to the
corresponding function name in the code.• E.g.: the function btn01click() corresponds to button01, so the OnClick
property should read “btn01click”.
• If you check the text version of the interface, you will see something similar to: android:onClick="btn01Click“
• This means that button01 has the correct onclick function assigned to is.
• Repeat this process for all numerical and operator buttons!
64
![Page 65: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/65.jpg)
Android Lab 02Advanced Android Features
65
![Page 66: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/66.jpg)
Class Plan
• Activities
• Intents
66
![Page 67: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/67.jpg)
How to Have Multiple Activity
• Create a simple project with name “Multiple Activity”
• Remove TextView “Hello World”
• Put a small button on the center of screen and name it “btn1”
• Add the property “OnClick” to btn1 (like this android:Onlick=“btnClick”;)
• Add the text of btn1 as a resource value (with CTRL+1)
• Add method btnClick to MainActivity.javapublic void btnClick(View view){
}
• Import android.view.View;
67
![Page 68: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/68.jpg)
How to Have Multiple Activity (cont.)
1.Right click on the project in Project Explorer
2.select New > Other
3.Select “Android Activity” form Android section and click Next
4.Choose Blank Activity and click Next
5.Fill out names as the picture
6.Accept pending changes and click finish
68
![Page 69: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/69.jpg)
Intents
• Messaging Objects designed to request actions from other app components
• Intent use-cases• To start an activity
To start a service
To deliver a broadcast
• Intent types Implicit
Explicit
69
![Page 70: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/70.jpg)
Intent (cont.)
• The primary information contained: Component name
Action
Data
Category
Extra
Flags
http://developer.android.com/guide/components/intents-filters.html
70
![Page 71: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/71.jpg)
How to Have Multiple Activity (cont.)
• Add following code to method “btnClick”Intent intent = new Intent (this,SettingActivity.class);
startActivity(intent);
• import android.content.Intent;
• Run the project as Android Application
71
![Page 72: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/72.jpg)
How to update the app icon (Eclipse)
1.Right click on the project in Project Explorer
2.select New > Other
3.Select “Android Icon Set” form Android section
72
Be sure your icon meets the specifications defined in the Iconography design guide.• http://developer.android.com/design/style/iconography.html
![Page 73: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/73.jpg)
How to change the icon of a created project (cont.)
73
![Page 74: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/74.jpg)
Menus and Action Bar
• Beginning with Android 3.0 (API level 11), Android-powered devices are no longer required to provide a dedicated Menu button.
• Different kinds of menus Option menu and action bar (e.g. search, compose mail,
settings, etc.) Context menu and contextual action mode
It appears when the user performs a long-click on an element and provides actions that affect the selected content or context frame
Popup menu Actions in a popup menu should not directly affect the corresponding
content. Rather, the popup menu is for extended actions that relate to regions of content in your activity
• Menus and items are defined in an XML file
74
![Page 75: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/75.jpg)
Menus and Action Bar (Cont.)
• Two ways to handle click events• Override onOptionItemSelected()
• Define the on-click behavior for a menu item in XML (Android 3.0 and higher)
75
![Page 76: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/76.jpg)
Dialogs
• Dialogs prompt the user for decisions or additional information required by the app to continue a task.
• Different dialogs AlertDialog
You can also add lists
DatePickerDialog
TimePickerDialog
Custom Layout
76
![Page 77: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/77.jpg)
• Simple feedback about an operation in a small popup
• They automatically disappear after a timeout
• You can position the toast differently or even use your own layout instead of a simple text message.
Toasts
77
![Page 78: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/78.jpg)
Settings
• Allow users to modify app featuresand behaviors. For example, howoften the application syncs data withthe cloud.
• Allow to build an interface that'sconsistent with the user experiencein other Android apps (including thesystem settings).
78
![Page 79: Introduction to Software Engineering Fall 2015site.uottawa.ca/~mgarz042/SEG2105/assignments/AndroidLab.pdf · 2016-08-20 · Developing Android Applications Introduction to Software](https://reader034.fdocuments.us/reader034/viewer/2022042506/5f5d098072dc3a2c5d26514c/html5/thumbnails/79.jpg)
Interested in Learning more?
• Follow the Android Training Guide• https://developer.android.com/training/index.html
80