COMP 5047 Pervasive Computing: Week 5: Smartphones & the Android OS Dr.-Ing. Rainer Wasinger School of Information Technologies
May 17, 2015
COMP 5047 Pervasive Computing: Week 5: Smartphones & the Android OS
Dr.-Ing. Rainer Wasinger
School of Information Technologies
Correction to Last Week‟s Slides
• Slide 9 in the week 4 handouts, in the “Worldwide
mobile terminal sales” pie chart:
– “Others” should have read 23%. This has now been
fixed.
• The images in slides 13 and 15 also got updated.
2
Statistics: Mobile terminal, smartphone, and operating
system market share
3
Worldwide mobile terminal
sales to end users in 1Q2009
(source: Gartner).
Worldwide smartphone
sales to end users in 1Q2009
(source: Gartner).
Smartphone OS market
share in 4Q2008
(source: Gartner).
Slide 9 in the week 4 handout (correction):
So what do all the sub-directories mean?
4
Android Smartphone Device CharacteristicsMobile Device HTC Dream HTC Magic
Release date Oct 2008 May 2009
OS Android Android
Display 3.2”, 320x480 (HVGA), capacitive “”
Dimensions 117.7mm x 55.7mm x 17.1mm 113mm x 55m x 13.65mm
Weight 158g 118.5g
Processor Qualcomm MSM7201A 528MHz “”
Memory 256MB ROM, 192MB RAM 512MB ROM, 192MB RAM
Battery 1150mAh 1340mAh
Network HSDPA/WCDMA (1700, 2100MHz),
Quad-band GSM/GPRS/EDGE (850,
900, 1800, 1900MHz)
HSDPA/WCDMA (900, 2100MHz),
Quad-band GSM/GPRS/EDGE
(850, 900, 1800, 1900MHz)
Camera 3.2MP with auto focus “”
WiFi WiFi 802.11b/g “”
Bluetooth Bluetooth 2.0 with EDR “”
Sensors GPS, digital compass, accelerometer “”
5
More Smartphone SpecificationsMobile Device HTC Hero Apple iPhone 3GS Palm Pre
Release date July 2009 July 2009 June 2009
OS Android iPhone OS 3.0 Palm webOS
Display 3.2”, 320x480 (HVGA)
capacitive multi-touch
3.5”, 320x480 (HVGA)
capacitive multi-touch
3.1” 320x480 capacitive
multi-touch
Weight 135g 135g 135g
Processor Qualcomm MSM7200A
528MHz
ARM Cortex 600MHz TI OMAP 3430 500MHz
Memory 512MB ROM, 288MB RAM 256MB RAM + 16/32 GB
flash memory
256MB RAM + 8GB flash
memory
Battery 1350mAh 1219mAh 1150mAh
Camera 5MP with auto focus 3MP with auto focus 3MP
Expansion slot microSD (up to 16GB) - -
WiFi WiFi 802.11b/g WiFi 802.11b/g WiFi 802.11b/g
Bluetooth Bluetooth 2.0 with EDR
and A2DP
Bluetooth 2.1 with EDR and
A2DP
Bluetooth 2.1 with EDR and
A2DP
Sensors aGPS, digital compass,
accelerometer, light sensor
aGPS, digital compass,
accelerometer, light sensor,
proximity sensor
aGPS, accelerometer, light
sensor, proximity sensor
6
Part 1: Android Widgets and more on GUI Design
7
GUI Design for Android Applications
• Two ways to create user interfaces:
– Using Java code and classes.
– Using XML.
• This is the standard method of GUI creation. It is inspired by the web
development model, wherein you can separate the presentation of your
application (its UI) from the application logic used to fetch and fill in data.
• XML layout files should start with an XML declaration, i.e.:
<?xml version=“1.0” encoding=“utf-8”?>
• The first ViewGroup element (e.g. ScrollView, LinearLayout) must also include the
android XML namespace, e.g.:
<ScrollView xmlns:android=“http://schemas.android.com/apk/res/android”
• XML layout files are linked to the code via the method setContentView,
e.g., for a layout page called propertylisting.xml, we would call the
following from within the respective Activity class:
setContentView(R.layout.propertylisting);
Note: Layout filenames must contain the .xml suffix, and only the characters:
“a-z”, “0-9”, and “_.”.
8
Android GUI Widgets (ViewGroups and Views)
9
ViewGroup Widgets (android.view.ViewGroup)
Let‟s have a look
at the following:
• LinearLayout
• AbsoluteLayout
(deprecated)
• RelativeLayout
• TableLayout
10
Creating an XML GUI Layout File
1. Open the Android XML file wizard:
2. Fill in the details, as shown
on the right
11
LinearLayout (android.widget.LinearLayout)
• In LinearLayouts, child widgets are presented either horizontally or
vertically.
12
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content“
android:orientation="horizontal">
<Button android:text="Button01"
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button02“
android:id="@+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button03“
android:id="@+id/Button03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
</LinearLayout>
LinearLayout (cont.)
• In LinearLayouts, child widgets are presented either horizontally or
vertically.
13
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content“
android:orientation=“vertical">
<Button android:text="Button01"
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button02“
android:id="@+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button03“
android:id="@+id/Button03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
</LinearLayout>
LinearLayout (cont.)
• android:layout_width="wrap_content“
– “fill_parent”: This means the widget should fill up all available space
in its enclosing container, after all other widgets are taken care of. If
there is no parent, it will fill the entire screen.
– “wrap_content”: This means that the widget should fill up its natural
space, unless that is too big, in which case Android can use word-
wrap as needed to make it
fit.
– “Xpx”: The width of the
widget in pixels, where X is
a number.
• The same values apply for the
attribute android:layout_height.
14
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content“
android:orientation=“vertical">
<Button android:text="Button01"
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button02“
android:id="@+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button03“
android:id="@+id/Button03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
</LinearLayout>
RelativeLayout (android.widget.RelativeLayout)
• In RelativeLayouts, child widgets are placed relative to one other. The
“android:id” parameter is important when using this type of.
15
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/RelativeLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<Button android:text="Button01"
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button02"
android:id="@+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/Button01"></Button>
<Button android:text="Button03"
android:id="@+id/Button03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/Button01"></Button>
</RelativeLayout>
TableLayout (android.widget.TableLayout)
• In TableLayouts, child widgets are placed into rows and columns. A
TableLayout consists of TableRow widgets, and each row can
effectively have one or more columns.
• Other common layout parameters:
– android:gravity={“top”, “bottom”
“center”, “right”, “left”}
– android:background=“FFFFFFFF”
– android:visibility={“visible”,
“invisible”, “gone”}
16
<?xml version="1.0" encoding="utf-8"?>
<TableLayout android:id="@+id/TableLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TableRow android:id="@+id/TableRow01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button android:text="Button01"
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
<Button android:text="Button02"
android:id="@+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
</TableRow>
<TableRow android:id="@+id/TableRow02"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button android:text="Button03"
android:id="@+id/Button03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></Button>
</TableRow>
</TableLayout>
View Widgets (android.view.View)
Let‟s have a look
at the following:
• TextView
• EditText
• Button
• RadioGroup /
RadioButton
• Spinner
17
View Widgets (android.view.View)• Can anyone explain why only some of the widgets in the Outline view
have the Widget type indicated in parenthesis?
18
TextView, EditText, and View
<TextView android:text="TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="24sp"
android:textStyle="bold|italic“
android:typeface="sans">
</TextView>
<EditText android:text="EditText01"
android:id="@+id/editText01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</EditText>
Retrieving text from an EditText:EditText editTextStr = (EditText)findViewById(R.id.editText01);
String fetchedStr = editTextStr.getText().toString();
19
TextView, EditText, and View (cont.)
<TextView android:text="TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="24sp"
android:textStyle="bold|italic“
android:typeface="sans">
</TextView>
<EditText android:text="EditText01"
android:id="@+id/editText01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</EditText>
<View android:background="#FFFFFF"
android:layout_width="wrap_content"
android:layout_height="1px"/>
20
A Quick Note on a View‟s ID
• Any View object may have an
integer ID associated with it, to
uniquely identify the View within
the tree. The ID is typically
assigned in the layout XML file as
a string, though after compilation, it is referenced as an integer.
• The @ symbol: This indicates that the XML parser should parse and
expand the rest of the ID string and identify it as an ID resource.
• The + symbol: This means that this is a new resource name that must
be created and added to our resources (i.e. in the R.java file).
21
<EditText android:text="EditText01"
android:id="@+id/editText01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</EditText>
Button, RadioGroup/RadioButton, and Spinner
22
<Button android:id="@+id/button01“
android:text="Button01"
android:layout_width="wrap_content“
android:layout_height="wrap_content">
</Button>
<RadioGroup android:id="@+id/myRadioGroup"
android:layout_width="wrap_content“ android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton android:id="@+id/radioButton01“
android:text="RadioButton01"
android:layout_width="wrap_content” android:layout_height="wrap_content">
</RadioButton>
<RadioButton android:id="@+id/radioButton02“
android:text="RadioButton02"
android:layout_width="wrap_content“ android:layout_height="wrap_content">
</RadioButton>
</RadioGroup>
<Spinner android:id="@+id/spinner01"
android:layout_width="fill_parent"
android:layout_height="40px"/>
Using android.widget.Button
To capture button clicks, we set up an event listener using the setOnClickListener
method. E.g., we might use an (anonymous) inner class to capture button
clicks, as is defined below:
Button button01=(Button)findViewById(R.id.button01);
button01.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Log.d("PropertyApp", "button01 has just been pressed");
}
});
23
Using android.widget.RadioButton
To get the ID of a currently-checked radio button we use the
getCheckedRadioButtonID method. E.g.:
RadioGroup myRadioGroup;
myRadioGroup=(RadioGroup)findViewById(R.id.myRadioGroup);
int checkedID = myRadioGroup.getCheckedRadioButtonId();
if (checkedID == -1) {
Log.d(TAG, "No radio button was selected.");
} else if (checkedID == R.id.radioButton01) {
Log.d(TAG, "'radioButton01' was selected.");
populatePropertyCatalog(false); //creates the property catalog
//using 'buy' data.
} else if (checkedID == R.id.radioButton02) {
Log.d(TAG, "'radioButton02' was selected.");
populatePropertyCatalog(true); //creates the property catalog
//using 'rent' data.
}
24
Using android.widget.Spinnerpublic class PropertyApp extends Activity implements OnItemSelectedListener {
String[] spinner01Items = {"---", "Apartment", "House", "Land"};
...
public void initialiseSearchPageGUI() {
Spinner spinner01=(Spinner)findViewById(R.id.spinner01);
spinner01.setOnItemSelectedListener(this);
ArrayAdapter<String> spinner01AA = new ArrayAdapter<String>(
this,
android.R.layout.simple_list_item_1,
spinner01Items);
spinner01AA.setDropDownViewResource(
android.R.layout.simple_spinner_dropdown_item);
spinner01.setAdapter(spinner01AA);
...
}
...
//Callback method to be invoked when an item in this view has been selected.
public void onItemSelected(AdapterView<?> parent, View v, int position, long id){
} //onItemSelected
//Callback method to be invoked when the selection disappears from this view.
public void onNothingSelected(AdapterView<?> parent) {
} //onNothingSelected
...
25
Using android.widget.Spinner (cont.)public class PropertyApp extends Activity implements OnItemSelectedListener {
String[] spinner01Items = {"---", "Apartment", "House", "Land"};
...
public void initialiseSearchPageGUI() {
Spinner spinner01=(Spinner)findViewById(R.id.spinner01);
spinner01.setOnItemSelectedListener(this);
ArrayAdapter<String> spinner01AA = new ArrayAdapter<String>(
this,
android.R.layout.simple_list_item_1,
spinner01Items);
spinner01AA.setDropDownViewResource(
android.R.layout.simple_spinner_dropdown_item);
spinner01.setAdapter(spinner01AA);
...
}
...
//Callback method to be invoked when an item in this view has been selected.
public void onItemSelected(AdapterView<?> parent, View v, int position, long id){
} //onItemSelected
//Callback method to be invoked when the selection disappears from this view.
public void onNothingSelected(AdapterView<?> parent) {
} //onNothingSelected
...
26
We use the Activity itself as
the listener, which is possible
because the Activity
implements the
OnItemSelectedListener
interface.
The above event handling could also be implemented as an anonymous inner class:spinner01.setOnItemSelectedListener(new OnItemSelectedListener(){
@Override
public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2, long
arg3) { /*Do something*/ }
@Override
public void onNothingSelected(AdapterView<?> arg0) { /*Do something*/ }
});
Using android.widget.Spinner (cont.)public class PropertyApp extends Activity implements OnItemSelectedListener {
String[] spinner01Items = {"---", "Apartment", "House", "Land"};
...
public void initialiseSearchPageGUI() {
Spinner spinner01=(Spinner)findViewById(R.id.spinner01);
spinner01.setOnItemSelectedListener(this);
ArrayAdapter<String> spinner01AA = new ArrayAdapter<String>(
this,
android.R.layout.simple_list_item_1,
spinner01Items);
spinner01AA.setDropDownViewResource(
android.R.layout.simple_spinner_dropdown_item);
spinner01.setAdapter(spinner01AA);
...
}
...
//Callback method to be invoked when an item in this view has been selected.
public void onItemSelected(AdapterView<?> parent, View v, int position, long id){
} //onItemSelected
//Callback method to be invoked when the selection disappears from this view.
public void onNothingSelected(AdapterView<?> parent) {
} //onNothingSelected
...
27
• Adapters provide a common interface to the data model behind a selection-style
widget.
• ArrayAdapter is one of the easiest to use adapters. It takes three parameters:
• Context context: The context to use, typically the Activity instance.
• int resource: The resource ID of a view to use, such as a built-in system
resource ID as shown in the example above.
• int textViewResourceId: The actual list of items to show.
• android.R.layout.simple_list_item_1: is used to format your list with one TextView in
each row. This text is large, white, and centred vertically.
Using android.widget.Spinnerpublic class PropertyApp extends Activity implements OnItemSelectedListener {
String[] spinner01Items = {"---", "Apartment", "House", "Land"};
...
public void initialiseSearchPageGUI() {
Spinner spinner01=(Spinner)findViewById(R.id.spinner01);
spinner01.setOnItemSelectedListener(this);
ArrayAdapter<String> spinner01AA = new ArrayAdapter<String>(
this,
android.R.layout.simple_list_item_1,
spinner01Items);
spinner01AA.setDropDownViewResource(
android.R.layout.simple_spinner_dropdown_item);
spinner01.setAdapter(spinner01AA);
...
}
...
//Callback method to be invoked when an item in this view has been selected.
public void onItemSelected(AdapterView<?> parent, View v, int position, long id){
} //onItemSelected
//Callback method to be invoked when the selection disappears from this view.
public void onNothingSelected(AdapterView<?> parent) {
} //onNothingSelected
...
28
setDropDownViewResource:
Sets a specific resource to
use for the drop-down view, in
this case the built-in system
resource:
“simple_spinner_dropdown_it
em”
COMP5047 PropertyApp Screenshots
29
• Screenshots (as shown in last week‟s lecture)
searchpage.xml
propertylisting.xml,
propertylistrow.xml propertydetails.xml
• searchpage.xml:
• A vertical LinearLayout, containing a number of horizontal LinearLayouts that
themselves encompass a range of standard View widgets.
• propertylisting.xml and propertylistrow.xml:
• A LinearLayout containing a ListView.
• Each element in the ListView is a horizontal LinearLayout, encompassing:
• An ImageView, and a
• Vertical LinearLayout containing a TextView and a TableLayout that holds a
number of parameters.
• propertydetails.xml:
• A ScrollView, containing a vertical LinearLayout that contains a TextView,
ImageView, TableLayout, and another TextView.
Part 2: More on Activities and Intents
30
COMP5047 PropertyApp Class Diagram
31
Property
XMLParserXMLPropertyCatalog
…XMLUnmarshaller(extends DefaultHandler)
AndroidManifest.xml
PropertyApp(extends Activity)
searchpage.xml
PropertyList(extends Activity)
propertylisting.xml
propertylistrow.xml
PropertyListAdapter(extends ArrayAdapter<Property>)
…_buy.xml
…_rent.xml
PropertyDetails(extends Activity)
propertydetails.xml
1
1
1…*1
User interaction
between Activities
PropertyDB
DatabaseHelper(extends SQLiteOpenHelper)
propertydata
Write data into
databaseRetrieve data
from database
Retrieve
data from
database
Activities and Intents
• Activity (android.app.Activity):
– Activities represent the building block of the user
interface.
– Activities are used to present a visual user interface for
one focused endeavour that the user can undertake.
• Intent (android.content.Intent):
– An Intent is an abstract description of an operation to be
performed.
– An Intent‟s most significant use is in the launching of
activities, where it can be thought of as the glue
between activities.
– Intents are basically a passive data structure holding an
abstract description of an action to be performed.
32
Intents – Another look at the PropertyApp
AndroidManifest.xml File<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="au.edu.usyd.it.PropertyApp"
android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".PropertyApp“ android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".PropertyList“ android:label="@string/app_name">
</activity>
<activity android:name=".PropertyDetails“ android:label="@string/app_name">
</activity>
</application>
<uses-sdk android:minSdkVersion=“2" />
</manifest>
33
Note how each Activity in the PropertyApp application is defined in the AndroidManifest.xml
file. This is needed in applications that utilise explicit intents. If not in the manifest, we
would receive an ActivityNotFoundException at runtime.
Creating an Intent and passing it to the Android OS
• If the activity you intend to launch is part of your own
application, it is simplest to create an explicit intent that
names the component that you wish to launch (remember
that the activity also needs to be named in the
AndroidManifest.xml file). E.g.://Create an intent for a specific component.
//Intent(Context packageContext, Class<?> cls)
Intent i = new Intent(PropertyApp.this, PropertyList.class);
• The next step is to pass the Intent to Android and get the
child activity to launch. The simplest option is to call
startActivity(Intent i), which gets Android to find the best-
match activity and pass the intent to it for handling. E.g.:startActivity(i);
34
Intent Extras – Putting and Getting Extras
• Extras: Extras are key-value pairs that contain additional
information that should be delivered to the component
handling the intent. E.g.:
– Placing the Extra from inside the PropertyApp class:
i.putExtra(PropertyApp.EXTRA_TO_RENT, “false”);
– Retrieving the Extra from inside the PropertyList class:
toRentStr = extras != null ?
extras.getString(PropertyApp.EXTRA_TO_RENT) : null;
35
i.e. if "extras!=null", then
toRentStr=extras.getString(PropertyApp.EXTRA_TO_RENT), else
toRentStr=null.
Intent Extras - The Full Examplepublic class PropertyApp extends Activity implements OnItemSelectedListener {
public static final String
EXTRA_PROPERTY_ID="au.edu.usyd.it.PropertyApp.property_id";
public static final String
EXTRA_TO_RENT="au.edu.usyd.it.PropertyApp.to_rent";
...
public void initialiseSearchPageGUI() {
Intent i = new Intent(PropertyApp.this, PropertyList.class);
i.putExtra(PropertyApp.EXTRA_TO_RENT, “false”);
startActivity(i);
...
public class PropertyList extends Activity {
...
protected void onCreate(Bundle savedInstanceState) {
String toRentStr = null;
boolean toRent = false;
Bundle extras = getIntent().getExtras();
toRentStr = extras != null ?
extras.getString(PropertyApp.EXTRA_TO_RENT) : null;
toRent = Boolean.parseBoolean(toRentStr);
36
Note: The au.edu.usyd.it.PropertyApp
namespace is used to ensure that the
'extra' name will not collide with any
names perhaps in use by the Android
system.
COMP5047 PropertyApp SQLite Database
• SQLite Manager Add-on for Firefox
37
Security Permissions
• A quick look at defining security permissions in an Android
Application.
38
Security Permissions (cont.)<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="apt.tutorial.two“ android:versionCode="1“
android:versionName="1.0">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
...
<uses-permission android:name="android.permission.READ_CALENDAR"/>
<uses-permission android:name="android.permission.READ_CONTACTS"/>
<application android:label="@string/app_name">
<activity android:name=".Patchy“ 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>
</manifest>
39
See http://developer.android.com/reference/android/Manifest.permission.html for a full list of permissions.
There are currently over 100 that have been defined.
Part 3: Smartphone Design
40
Mobile Device Design
• Typical mobile device limitations:
– Processor, memory, display size (e.g. might require
extensive scrolling), modes of input (e.g. 12-key
numeric keypad; touch-screen).
• System Designer Choices
– E.g. menu placement, location of physical buttons,
button sizes, choice of hardware (e.g. capacitive /
resistive touch screens).
• Input Interaction / Output Presentation:
– Input: Speech, handwriting, stylus/finger input, sensor-
based input.
– Output: Sound, graphics, video, haptic/vibration,
projection.
41
Mobile Phone Target Groups
• Low-end: Phones for this demographic are currently being marketed as
‘internet-ready’ phones.
– Consider for example the Nokia 7020.
• Mid-range: Phones for this demographic are advertised as bringing
smartphone and web functionality to the mass market. Nokia is also expected
to bring touch screen phones to the mid-range markets sometime in 2009.
– Nokia’s 5800 XpressMusic (a.k.a. the Tube) is a handset currently being targeted at
the mid-range market.
• High-end: Phones for this demographic typically represent the tier one
manufacturer’s (and speciality manufacturer’s) flagship products.
– Representative devices in this category include those that we have typically talking
about in these lectures, e.g. Apple iPhone 3G.
• Luxury phones: This sector focuses on third party companies who modify
handsets for the fashion-conscious consumer, to create gold-plated and/or
diamond-encrusted phones.
– Example handsets in this group include the Gucci G600 24-karat plated gold phone,
and Continental Mobile’s version of the Nokia E71 that is encrusted with diamonds
and retails for GBP 5,999.
42
Mobile Phone Target Groups (cont.)
43
Nokia 7020
Nokia’s 5800 XpressMusic
HTC Hero
Continental Mobile’s
adaptation of the Nokia E71
Gucci G600
Part 4: The Future of Mobile Computing
44
Some Key Trends For Mobile Device Development, with
specific reference to the Web
• One-web:
– The one-web vision in which content is authored once and then reused and repurposed based on
the situation and technology that it is required for is emerging as the de facto path forward.
• Evidences: Emergence of proxy-based browsers like Opera Mini, Teashark, and Skyfire. Emergence of
transcoding sites like Skweezer, Google Mobilizer, and DotMobi Mowser. Existence of content-repurposing
platforms like Volantis Mobility Server, IBM WebSphere, and WURFL.
• Heterogeneous devices:
– Heterogeneous devices will continue to emerge as the market tries to identify the relevant non-
desktop devices required for interactive, mobile, always-on, and always-connected use.
• Examples: Smartphones, social phones, mobile internet devices, e-book readers, gaming consoles, set-top
boxes, music/video players, in-car navigation consoles, tabletops, and net books.
• Interaction:
– Interaction will become embedded into the classical media types like text, image, audio, and
video, to create rich and engaging user experiences. Utilisers of such media, e.g. in print, TV,
and radio, will need to adapt.
– IPTV is gaining traction and will hopefully provide for a smooth transition from classical non-
interactive TV to interactive TV.
– New interaction paradigms will be a key differentiator between services seen to be innovative
and of high quality.
The Mobile Markup Languages
• A range of mobile markup languages covering protocols like WAP, i-mode, and
HTTP have emerged. These mobile markup standards are converging in
functionality, and that with the most secure future is XHTML-Basic.
46
Emerging Technology Independent Standards
• The most recent smartphones now also have the same web browser
capabilities as their desktop counterparts, i.e. they can render full HTML and
XHTML, thus reducing the need for mobile-specific markup. Mobile protocols
like i-mode, WAP, and HTTP may converge in the future.
– WAP is the main mobile protocol in use and has very wide backing. i-mode
has had significant impact in Japan but has not managed to penetrate
much of the rest of the world. Modern smartphone browsers can also
render full HTML and XHTML pages via the HTTP protocol.
• Recent alignment efforts between the W3C and OMA are such that the
proposed W3C XHTML Basic 1.1 and OMA‟s XHTML-MP 1.2 are now
virtually indistinguishable.
• Standards for interactive media and interaction in general are still maturing, but
are expected to become increasingly relevant to web services in the future.
– Consider: SMIL, MPEG7, EMMA, and InkML.
Categorization of a number of Web-Related
Standards
• Catering for the full spectrum of user characteristics, as too interactive media,
will be important targets for the future.
– Examples: User knowledge, user skills and capabilities, user interests and preferences, user
goals and plans, usage data, and environment data.
Individual Device Profiles
CC/PP
UAProf
HTTP
i-mode
WAP 2.0WAP 1.0
HTML/XHTML
XHTML-MP
WML
C-HTML
XHTML-Basic CSS MP
CSS
WCS
DIAL(XHTML 2.0, XForms 1.0,
DiSelect 1.0, CSS 2.1)
XDIME 2
Device IndependentMarkup Languages
Device Capability Profiles ProtocolsMarkup
LanguagesStyle
Languages
Device Description Repository
DDR
Mobile Web Browsers and their Capabilities
• Web browsers:
– Represent the underlying environment within which web-applications run.
– A number of different web browsers exist for mobile devices; some come pre-
installed while others are available in the form of 3rd party software.
• Proxy-based browsers and transcoding sites are also available for
mobile devices.
• The top level domain suffix .mobi is available for sites that want to
advertise themselves as being mobile, though the take up on this has
so far been limited, and critics say that this approach goes against the
„one web‟ principle.
• Rich Internet Apps (extending the browser‟s capabilities)
– A number of web-technologies also exist that focus on interactive
multimedia, and that also blur the classical distinction between
native/stand-alone functionality and web-application functionality.
Mobile Web Browsers
• Popular mobile web browsers:
• Several predominant 3rd-party mobile browsers:
50
Pre-installed web browsers
Manufacturer Operating system Layout engine
Android browser OHA Android WebKitSafari browser Apple iPhone WebKitInternet Explorer Mobile
Microsoft Windows Mobile -
Blackberry browser RIM BlackBerry MangoWeb browser for S60 Nokia Symbian, S60 WebKit
3rd party stand-alone web browsers
Manufacturer Targeted Operating system
Layout / Rendering engine
Version License / Cost
Opera Mobile Opera Software
Windows Mobile, UIQ and S60 for Symbian OS.
Presto 9.51b2 (Oct.2008)
Proprietary, US$24-
Fennec Mozilla Foundation
Linux (Nokia Maemo) and Windows mobile 6; in the future also Symbian
Gecko 1.0 (Dec.2008) alpha
Freeware, free
Rich Internet Application Technologies
• Categorisation of Rich Internet Application (RIA) technologies:
Categorisation of processing strategies (left) and development
technologies (right), categorised by the two axes: server-side/client-
side and desktop/web (source: [Moritz, 2008]).
Application Stores / Market Places
• Application store fronts are a new delivery channel through which customers
can purchase applications and services that are compatible with their mobile
device.
• Device manufacturers, operating system manufacturers, and
telecommunications providers are all currently introducing app stores with one
goal being to try and control the payment channel. Creators of app stores are
also not limited to just these three groups.
• Personalisation and contextual awareness are two predominant themes in the
new breed of app stores, designed to deal with the influx of apps now available
in these market places (over 25,000 for the iPhone as at March 2009).
• App stores are currently focussing on providing search and purchasing support
for any (and all) of: applications, widgets, music, video, and gaming.
Application Store Front Examples
• Apple‟s iPhone App Store (launched in July 2008)
• OHA‟s Android Market (launched in Oct. 2008)
• RIM‟s BlackBerry App World (launched April 2009)
• Nokia‟s OVI Store (launched May 2009)
• Microsoft‟s Windows Marketplace for Mobile (expected launch
4Q2009)
• Palm‟s App Catalog
• Samsung Mobile Video Store (Mar.2009)
• Portals provided by the carriers:
– Joint Innovation Labs (Vodafone, Verizon, Sofbank, and China
Mobile)
53
Note: The revenue share between the developer and the Application Store Fronts is typically 70:30, i.e.
the developer gets 70% for every application sold through a particular store front and the store front gets
the remaining 30%. Currently, many parties - the telecommunications providers, device manufacturers,
operating system manufacturers, and other – all want a share of the store front market.