Mobile Software Development Framework: Android Activity...
Transcript of Mobile Software Development Framework: Android Activity...
![Page 1: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/1.jpg)
1
Mobile Software Development Framework: Android Activity,
View/ViewGroup, External Resources, Listener
10/9/2012
Y. Richard Yang
![Page 2: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/2.jpg)
2
Admin.
❒ Homework 2 questions
![Page 3: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/3.jpg)
3
Recap: TinyOS ❒ Hardware components motivated design
❍ Each component/module • specifies
– the interfaces it provides – the interfaces/modules it uses
• implements the functions in – the declared provided interfaces – event handlers in the declared used interfaces
❍ Configuration specifies the linkage among components/modules
❒ Execution model ❍ Event driven (triggered) handlers, who may post tasks to a
FIFO task queue monitored by a task thread
![Page 4: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/4.jpg)
4
Recap: J2ME Framework
❒ Java adaptation for mobile devices ❒ A major focus of J2ME is device
heterogeneity ❒ Solution: versioning
❍ Configurations ❍ Profiles
![Page 5: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/5.jpg)
5
Recap: J2ME MIDP Structure
MIDP
Lifecycle callbacks - startApp - pauseApp - destroyApp
Current Displayable
A set of commands
Command listener
d=Display.getDisplay(this) d.setCurrent(disp)
![Page 6: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/6.jpg)
6
Recap: IOS
❒ Apple’s adaptation for mobile devices ❒ E.g., Cocoa => Cocoa Touch
❍ App KIT => UI Kit
http://developer.apple.com/library/ios/documentation/Miscellaneous/Conceptual/iPhoneOSTechOverview/iPhoneOSTechOverview.pdf
![Page 7: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/7.jpg)
7
Recap: IOS Model View Controller (MVC) Structure
Model View
Controller
Model Model View
Outlet
Target
Ac-on
did will
count Data at
No-fica-on and KVO
![Page 8: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/8.jpg)
8
Discussion
❒ What are some major differences between desktop GUI app design and mobile (phone/tablet) GUI app design?
![Page 9: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/9.jpg)
9
Some Key Features of Mobile UI APp
❒ Limited screen real estate ❍ one thing at a time
❒ Limited resources: more dynamic system management on app life cycle ❍ give app chances to adapt, better mem management
❒ More heterogeneous display devices ❍ decoupling between display and logic
![Page 10: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/10.jpg)
10
Mobile GUI App ❒ Screen real-estate is limited => Focus on one
thing at a time
![Page 11: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/11.jpg)
11
Mobile GUI App ❒ Screen real-estate is limited => Focus on one
thing at a time
![Page 12: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/12.jpg)
Mobile GUI App Workflow
App
App lifecycle callbacks/custom - start - pause - …
![Page 13: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/13.jpg)
Mobile GUI App Workflow: Do One Thing
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
![Page 14: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/14.jpg)
Mobile GUI App Workflow: Display Content Based on Underlining Data
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
![Page 15: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/15.jpg)
Mobile GUI App Workflow: Handle Events
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
Event Handler
Event Handler
![Page 16: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/16.jpg)
Mobile GUI App Workflow: Switch to Another GUI
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
Event Handler
Event Handler
Display Composite
Display
Display Composite
Display
Display
![Page 17: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/17.jpg)
17
Discussion
❒ Key design points for mobile GUI app ❍ Specify app life cycle customization ❍ Specify display ❍ Specify event scheduling
• How to link event, display, handler, data
![Page 18: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/18.jpg)
Typical Design: App
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
Event Handler
Event Handler
Framework reacts to app events and invokes app lifecycle event handlers
![Page 19: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/19.jpg)
19
How to Provide App LifeCycle Handlers?
❒ App class implements it ❍ Inheritance
❒ App class does not implement it ❍ Delegate ❍ Command listener
![Page 20: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/20.jpg)
Typical Design: UI
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
Event Handler
Event Handler
System captures UI events; and puts them in a msg queue of the app. A UI thread processes the queue
![Page 21: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/21.jpg)
Example: IOS
10/4/1
2
![Page 22: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/22.jpg)
22
How to Provide Display Component Event Handlers?
❒ Display Component class implements it ❍ Inheritance ❍ Typically a bad idea
❒ Display Component class does not implement it ❍ Makes Display reusable
• Delegate • Command listener
![Page 23: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/23.jpg)
23
Outline
❒ Admin and recap ❒ Mobile/wireless development framework
❍ GNURadio ❍ TinyOS ❍ J2ME ❍ IOS ❍ Android http://developer.android.com/index.html
![Page 24: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/24.jpg)
Android ❒ A mobile OS based on Linux
❍ Customized Linux kernel 2.6 and 3.x (Android 4.0 onwards)
• E.g., default no X Windows, not full set of GNU libs
❍ Apply OS concepts for mobile contexts
• e.g., each app is considered one Linux user
❍ New key components, e.g., • Binder for IPC • Power management wakelock
❒ Application development framework based on Java ❍ Dalvik Virtual Machine
24
![Page 25: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/25.jpg)
Android Architecture
25
![Page 26: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/26.jpg)
Android Tools
❒ Android SDK Manager (android) ❒ Android emulator ❒ Android debug bridge (adb) can connect to an
Android device and start a shell on the device
❒ See http://developer.android.com/tools/workflow/index.html
![Page 27: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/27.jpg)
Mapping to Android
App
App lifecycle callbacks/custom - start - pause - …
Display Composite
Display
Display Composite
Display
Display
Display Composite
Display
Display
Data/Model
Data/Model
Event Handler
Event Handler
-How to specify the customized callbacks: extend Activity class
-How to link the callbacks defined in view to listener/controller: View.set…Listener()
Allows external XML resource files to specify views
![Page 28: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/28.jpg)
Application Framework (Android): Key Concepts
❒ Activity
❒ View/ViewGroup (Layout)
❒ External resources
28
![Page 29: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/29.jpg)
Activity
❒ A single, focused thing that the user can do. ❒ Creating a window to place UI views
❍ Full-screen windows, floating windows, embedded inside of another activity
❒ Typically organized as a Stack ❍ Top Activity is visible ❍ Other activities are stopped ❍ Back button to traverse the
Activity Stack ❍ Long Home shows the content
of the Stack
![Page 30: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/30.jpg)
Activity: Manifest File
❒ To facility launching and managing Activities, each activity is announced in a manifest file
Manifest the activity
Instead of a hardcode string in code, defines in res/strings
![Page 31: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/31.jpg)
Android Project Resources
31
![Page 32: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/32.jpg)
Activity: Example // MainActivity.java public class MainActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { // savedInstanceState holds any data that may have been saved // for the activity before it got killed by the system (e.g. // to save memory) the last time super.onCreate(savedInstanceState); setContentView(… ); // set a View }
![Page 33: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/33.jpg)
View ❒ A view component is a building block for user
interface components. ❒ Two types of views
❍ Leaf: TextView, EditText, Button, Form, TimePicker… ListView
❍ Composite (ViewGroup): LinearLayout, Relativelayout, …
http://developer.android.com/guide/tutorials/views/index.htm
![Page 34: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/34.jpg)
Programmatic Usage of Views
// MainActivity.java public class MainActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { // savedInstanceState holds any data that may have been saved // for the activity before it got killed by the system (e.g. // to save memory) the last time super.onCreate(savedInstanceState); TextView tv new TextView(this); tv.setText("Hello!“); setContentView(tv); }
![Page 35: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/35.jpg)
Define View by XML
![Page 36: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/36.jpg)
Access View Defined by XML @Override public void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.main); } … TextView myTextView = (TextView)findViewById(R.id.myTextView);
<?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:id=”@+id/myTextView” android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:text=”Hello World, HelloWorld” /> </LinearLayout>
main.xml
![Page 37: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/37.jpg)
External Resources
❒ Compiled to numbers and included in R.java file
37
![Page 38: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/38.jpg)
Hello Example
❒ See HelloStart
38
![Page 39: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/39.jpg)
39
Android Activity Life Cycle
![Page 40: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/40.jpg)
Lifecycle Example
❒ See ActivityifeCycle
40
![Page 41: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/41.jpg)
Linking Views and Handlers/Controllers
❒ onKeyDown. onKeyUp ❒ onTrackBallEvent ❒ onTouchEvent
myEditText.setOnKeyListener(new OnKeyListener() { public boolean onKey(View v, int keyCode, KeyEvent event) { if (event.getAction() == KeyEvent.ACTION_DOWN) if (keyCode == KeyEvent.KEYCODE_DPAD_CENTER) { … return true; } return false; }}); }
registerButton.setOnClickListener(new View.OnClickListener() { public void onClick(View arg0) {….}}
![Page 42: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/42.jpg)
Example: TipCalc
Set listener:
42
public class TipCalcActivity extends Activity implements OnClickListener { … @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_tip_calc); Button calc = (Button)findViewById(R.id.calculate); calc.setOnClickListener(this); } …}
![Page 43: Mobile Software Development Framework: Android Activity ...zoo.cs.yale.edu/.../cs434-2012-fall/lectures/12-mobisys-android.pdf · 1 Mobile Software Development Framework: Android](https://reader031.fdocuments.us/reader031/viewer/2022022006/5ac4888f7f8b9a2b5c8d122c/html5/thumbnails/43.jpg)
Example: TipCalc
Handler:
43
@Overridepublic void onClick(View arg0) { EditText amountText = (EditText)findViewById(R.id.amount_value); // get input double amt=Double.parseDouble(amountText.getText().toString()); // compute output double tipD = amount * 0.15; // set UI String tipT = String.format("%.2f", tipD); TextView tipText = (TextView)findViewById(R.id.tip_value);
tipText.setText(tipT);}