Download Seminar.1hr

Can be viewed at:
http://web.fscj.edu/Janson/cis2930/Seminar.1hr.ppt
Mobile Computing
Overview
1
Copyright 2014 by Janson Industries
Objectives
▀
Explain
 Mobile
computing background
and concepts
 Basic
mobile computing
programming concepts
 Android
concepts
2
Copyright 2014 by Janson Industries
Why Mobile?


According to Google, as of
December 2011 there are over
700,000 Android devices
activated every day
In Jan 2014 mobile phone apps
overtook PCs as the most
popular method of accessing the
WWW
3
Copyright 2014 by Janson Industries
Why Mobile?
4
Copyright 2014 by Janson Industries
PC Sales

Meanwhile, smartphone
adoption was up 39%
5
Copyright 2014 by Janson Industries
Where’s It Going?
6
Copyright 2014 by Janson Industries
Mobile is Different



Limited memory and screen size
Interactions are short and
interruptions are common
Touch based
 Typing

minimized
Often used for monitoring (i.e. GPS)
 Timely
access to the latest data
7
Copyright 2014 by Janson Industries
Mobile is Different

Social interactions are important

Lots of different devices
 Tablet
 Blackberry
 SmartPhone
 iPhone
 Windows
Phone
 Android
8
Copyright 2014 by Janson Industries
Mobile Implications

Apps already revolutionializing
some industries
 Uber



and the taxi industry
Trend to "always-on commerce"
Better understand customer
behavior
Competitive advantage
9
Copyright 2014 by Janson Industries
Mobile Implications




Apps must be written for different
devices
Web pages need to be designed
for smaller screens
Apps must be very efficient and
small
Apps distributed through “stores”
 Some
stores have many hurdles for
developers
10
Copyright 2014 by Janson Industries
Why Bother



Enable customer access
anytime anywhere
Increase field employees
productivity
Real time data exchange from
mobile devices
 Track
location of delivery truck
and reroute based on traffic info
11
Copyright 2014 by Janson Industries
IoT - Internet of Things

Not just phones
 Connected
sensors, devices and
objects


Installing sensors on water
pipes, parking meters, etc. for
more efficient use
Beacons in stores
 Track
customers in store and offer
location based deals
Copyright 2014 by Janson Industries
12
Why Android?




Did I mention 700,000 new
devices a day?
Some reports say Android has
over 50% of US market
Open source (aka Free)
Android Market not as restrictive
as some other stores
13
Copyright 2014 by Janson Industries
Why Android?
Top Five Smartphone Operating Systems, Worldwide Shipments,
and Market Share, 2014Q2 (Units in Millions)
Operating
System
2Q14
Shipment
Volume
Android
2Q14
Market
Share
2Q13
Shipment
Volume
2Q13
Market
Share
2Q14/2Q1
3 Growth
255.3
84.7%
191.5
79.6%
33.3%
35.2
11.7%
31.2
13.0%
12.7%
Windows Phone
7.4
2.5%
8.2
3.4%
-9.4%
BlackBerry
1.5
0.5%
6.7
2.8%
-78.0%
Others
1.9
0.6%
2.9
1.2%
-32.2%
301.3
100%
240.5
100%
25.3%
iOS
Total
14
Copyright 2014 by Janson Industries
What is Android


An open source linux based
operating system for mobile
devices
Development is primarily done
with a customized version of
java
C
and C++ supported
 Google App Inventor
 VE
for beginners
 Cross
platform development tools
 PhoneGap,
Copyright 2014 by Janson Industries
Rhomobile, appMobi
15
Android Concepts
▀
Screens/windows defined with
XML and are comprised of views
A
button, edittext, textview, etc. are
all considered views
▀
Applications comprised of
activities
 Activities
can display and retrieve
screens/windows and their
components
16
Copyright 2014 by Janson Industries
Android Concepts
▀
Eclipse with Android plug in is
the most popular IDE
 Lots
of tools: emulator, syntax
checker, logcat
▀
Initially creates a very specific
structure for applications
 Not
very java-novice friendly
 Will
ignore as much as possible
17
Copyright 2014 by Janson Industries
Getting Started with Android
▀
Need a java JDK
 Contains
all the java commands,
compiler, and more
▀
Need the Android SDK
 Unique
functionality for mobile
apps
▀
▀
Copyright 2014 by Janson Industries
Need Eclipse and the Android
plugin
We have it all set up here!
18
Start Eclipse and, if the Welcome window appears, close it
19
Copyright 2014 by Janson Industries
Eclipse
▀
Has a variety of perspectives
Java,
▀
Debug, DDMS
Each perspective consists of a
unique set of functions and
views of the application
 Java
shows source code and
allows the programmer to edit it
 Debug
shows the stack trace
(logic flow) of a running app
 DDMS
Copyright 2014 by Janson Industries
allows access to the
device/emulator’s file system
20
Perspective indicated in upper right hand corner
Java Perspective window consists of four panes
Panes contain views
Views indicated by tabs at top of pane, switch view by clicking tab
Resize panes by clicking and dragging borders
21
Double
view tab to expand view and fill perspective window
Copyright
2014 byclick
Janson Industries
Eclipse Concepts
▀
All of an application’s
resources are stored in a
project
 Source
code
 Images
 XML
▀
The resources can be further
organized into folders and
packages
22
Copyright 2014 by Janson Industries
Eclipse
Project
Package
▀
▀
Folder
Package
Folder
File
Packages and folders hold
the majority of an
application’s resources
Java source code must go
into a package
23
Copyright 2014 by Janson Industries
Android Java
▀
▀
▀
An Android application’s
programs are called activities
Files with an extension of .java
hold an activity’s source code
To create an activity you have to
have a project and a package to
put it in
24
Copyright 2014 by Janson Industries
Creating an Application
▀
Click File, New and then Project
▀
Select Android Project
▀
Give the :
 Project,
package, activity and
application names
 Specify
a build target
25
Copyright 2014 by Janson Industries
Click File, New, and Project then expand Android, select Android
Application Project and click Next
26
Copyright 2014 by Janson Industries
Initial new app Window, must enter…
27
Copyright 2014 by Janson Industries
28
Copyright 2014 by Janson Industries
29
Copyright 2014 by Janson Industries
30
Copyright 2014 by Janson Industries
31
Copyright 2014 by Janson Industries
Creating an Application

Eclipse will create the
 Project
 Packages
and folders
 Files

It even creates a working
application
 In
a file called MainActivity.java
 File stored in a package called
com.example.howdyproj in source
folder src
32
Copyright 2014 by Janson Industries
To Run an Application




In Package Explorer, expand
HowdyProj, src, &
com.example.howdyproj
Select MainActivity by clicking it
Click the run button (green circle
with white arrow head)
Select Android Application and
click OK
33
Copyright 2014 by Janson Industries
If you want to install and run on your phone, plug it into the USB port
34
Copyright 2014 by Janson Industries
If not, you have to have a phone emulator (aka Android Virtual
Device) and you may have to create it
35
Copyright 2014 by Janson Industries
36
Copyright 2014 by Janson Industries
37
Copyright 2014 by Janson Industries
Specify a name and accept the default values
38
Copyright 2014 by Janson Industries
39
Copyright 2014 by Janson Industries
40
Copyright 2014 by Janson Industries
To Run an Application



First time will take a while
Emulator must configure itself
and will launch
The emulator is displayed
41
Copyright 2014 by Janson Industries
42
Copyright 2014 by Janson Industries
Go back and close the Manager window
43
Copyright 2014 by Janson Industries
Click the “Choose a running Android device” and select the emulator,
click OK
44
Copyright 2014 by Janson Industries
45
Copyright 2014 by Janson Industries
How Does It Work


The generated application is
pretty complicated and requires a
lot of Java knowledge
Let’s learn a little about Java,
then some XML, tweak the app,
and then modify it for input and
output
46
Copyright 2014 by Janson Industries
Activity Classes

Runnable java pgms:
public class HowdyActivity extends Activity {


Also comments (non-executable
statements) preceded by //
Consists of many methods
(program subsections)
 By
default onCreate method run
the first time the app is run
47
Copyright 2014 by Janson Industries
package com.example.howdyproj;
import
import
import
import
import
android.os.Bundle;
android.app.Activity;
android.view.Menu;
android.view.MenuItem;
android.support.v4.app.NavUtils;
Putting It All
Together
public class HowdyActivity extends Activity {
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_howdy);
}
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_howdy, menu);
return true;
}
}Copyright 2014 by Janson Industries
48
Android online documentation at:
http://developer.android.com/reference/packages.html
49
Copyright 2014 by Janson Industries
To find info about a class, start to enter text and a list of classes will
be displayed
50
Copyright 2014 by Janson Industries
Resources
▀
Are other things that comprise
the Android app
 Pictures
 Values
 Text
files
 Screen
▀
definitions
Screen definitions are defined
with XML
51
Copyright 2014 by Janson Industries
XML
▀
Extensible Markup Language
 Basically
▀
Can do a lot more than just
layouts
 As
▀
the duct tape of apps
you will see if you take the class
Like HTML comprised mostly of
paired tags
52
Copyright 2014 by Janson Industries
Screen Definition


Stored in a separate file in
res/layout
All GUI component definitions
are within the layout tags
53
Copyright 2014 by Janson Industries
Layouts

Lots of different kinds
 GridLayout,
AbsoluteLayout,
RelativeLayout

A LinearLayout organizes the
screen into a series of rows or
columns
54
Copyright 2014 by Janson Industries
LinearLayout

In the start tag must identify the
XML name space (xmlns)
 The
location of predefined XML
elements and attributes
 i.e.
The name space contains the
definition of a button, text view, etc.

Also, gives the namespace an
alias. Eg:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 The
Copyright 2014 by Janson Industries
alias is android
55
LinearLayout


The screen definition can now
use any of the attributes or
elements in the namespace
For example, the layout’s
 Orientation
 Width
 Height
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
56
Copyright
> 2014 by Janson Industries
LinearLayout



Vertical means the screen will be
laid out with horizontal bands
from top to bottom:
Fill parent means it will take up
the whole screen width or height
Need an end LinearLayout tag
</LinearLayout>
Copyright 2014 by Janson Industries
57
GUI Components


All the GUI components (aka
views, widgets, or controls) go
between the start and end layout
tags
A TextView displays static text
<TextView
android:layout_width="fill_parent"
android:layout_height=“fill_parent"
android:text="This is an example of some static text that is more than one
line in length"
/>
58
Copyright 2014 by Janson Industries
GUI Components


Once again, width and height
declared this time based on layout
size (i.e. parent)
Static text defined with text
attribute
<TextView
android:layout_width="fill_parent"
android:layout_height=“fill_parent"
android:text="This is an example of some static text that is more
than one line in length"
/>
59
Copyright 2014 by Janson Industries
GUI Components

Putting all the XML together
<?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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="This is an example of some static text that is more than one
line in length"
/>
</LinearLayout>
60
Copyright 2014 by Janson Industries
GUI



As mentioned, screen definition
must be stored in a file in
res/layout
Create a file called example1.xml
in res/layout
Enter the XML
61
Copyright 2014 by Janson Industries
File , New, File then select the layout folder
62
Copyright 2014 by Janson Industries
May initially bring up a Graphical Layout editor – not very good
Switch to source code view
63
Copyright 2014 by Janson Industries
Paste the XML, error icons may be displayed
Save source code and error icons will be removed
64
Copyright 2014 by Janson Industries
May flag the text statement with a warning. Warnings won’t stop it
from working. However, defining text/strings in xml or java code is
frowned on by Eclipse because of redundancy.
Have to update the application to display example1.xml
65
Copyright 2014 by Janson Industries
GUI

Create a method called onStart
to display the new layout with
the following statement
setContentView(R.layout.example1);

As the name implies,
setContentView displays the
screen
66
Copyright 2014 by Janson Industries
GUI

Create onStart as follows
protected void onStart(){
super.onStart();
setContentView(R.layout.example1);
}
67
Copyright 2014 by Janson Industries
Double click MainActivity to open and paste the code
68
Copyright 2014 by Janson Industries
Run the app
Now you do it!
69
Copyright 2014 by Janson Industries
Input To Application



A little more complicated
An EditText view allows user
to enter and change text
EditText content can be read
by app
<EditText android:id=”@+id/userName”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent” />
70
Copyright 2014 by Janson Industries
Input To App

Width and height the same as
before

id is new attribute

Defines a name for the view
 Need
to be able to identify the
view so we can read it
<EditText android:id=”@+id/userName”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent” />
71
Copyright 2014 by Janson Industries
Input to App

example1.xml - change TextView also
<?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/greeting"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="What is your name? "
/>
<EditText android:id="@+id/userName"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
Copyright 2014 </LinearLayout>
by Janson Industries
72
We changed the height so that the EditText doesn’t fill the whole
screen from top to bottom
Now when run looks like this
73
Copyright 2014 by Janson Industries
Button
▀
Us XML to define a button and
method to call when clicked
<Button android:id="@+id/submit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Submit"
android:onClick="submitClicked" />
74
Copyright 2014 by Janson Industries
XML File
▀
Us XML to define a button and
method to call when clicked
75
Copyright 2014 by Janson Industries
Changes to Java Activity
▀
To read the EditText, need to:
 Import
the EditText class
► import
 Define
android.widget.EditText;
an EditText class level variable
► EditText
name;
 Retrieve
the EditText’s (userName)
location in memory and assign it to name
► name
=
(EditText)findViewById(R.id.userName);
 Retrieve
the text
► name.getText();
• EditText has a method called getText
76
Copyright 2014 by Janson Industries
Button
▀
In activity need to define
submitClicked method
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;
EditText name;
public void submitClicked(View v){
name = (EditText)findViewById(R.id.userName);
TextView greeting = (TextView)findViewById(R.id.greeting);
greeting.setText("Hi " + name.getText() + ". Nice to meet you.");
name.setText("");
}
77
Copyright 2014 by Janson Industries
78
Copyright 2014 by Janson Industries
Run app, notice new text and the button
Enter a name and click the Submit button
79
Copyright 2014 by Janson Industries
New msg displayed and name blanked out
80
Copyright 2014 by Janson Industries
Saving Your App
▀
▀
Export the project to thumb drive
In the Package Explorer, select
the project then
 File,
▀
Export
At export window
 Expand
 Select
 Click
Copyright 2014 by Janson Industries
General
File System
Next
81
82
Copyright 2014 by Janson Industries
Make sure project checkbox is checked
Specify location and click Finish
83
Copyright 2014 by Janson Industries
View Properties
▀
Instead of setting a view’s width
to fill_parent, can specify
wrap_content
android:layout_width="wrap_content"
▀
Since the view doesn’t fill the
parent, can specify the gravity
(justification)
android:layout_gravity="center"
84
Copyright 2014 by Janson Industries
View Properties
85
Copyright 2014 by Janson Industries
EditText and Button sizes dictated by its text content
86
Copyright 2014 by Janson Industries
View Attributes
▀
height – view set to a specific size
▀
textColor
▀
textSize
▀
textStyle - (bold, italic)
▀
width – view set to specific size
▀
Sizes can be specified many ways
 px
- Pixels
 in – Inches
 mm - Millimeters
87
Copyright 2014 by Janson Industries
88
Copyright 2014 by Janson Industries
89
Copyright 2014 by Janson Industries
Input Accepting Views
▀
digits – only specified numeric
characters can be entered (digits=“135”)
▀
hint – defines text for view when empty
▀
inputType
 textAutoCorrect
 number
 phone
–corrects some misspellings
– only numeric characters allowed
- only phone keypad characters allowed
 date
– only date chars (numbers, /, ., -)
 time
– only time chars (numbers, :, a, p, m)
90
Copyright 2014 by Janson Industries
91
Copyright 2014 by Janson Industries
92
Copyright 2014 by Janson Industries
Enter adn and then…
93
Copyright 2014 by Janson Industries
… a space
94
Copyright 2014 by Janson Industries
95
Copyright 2014 by Janson Industries
Initial display, typing in and
96
Copyright 2014 by Janson Industries
All letters converted to numbers according to a phone keypad
No delete, only backspace allowed
97
Copyright 2014 by Janson Industries
However none of these options can prevent all nonsense input
98
Copyright 2014 by Janson Industries
Interested in apps with…
▀
More GUI
▀
Graphics
▀
Games
▀
Music
99
Copyright 2014 by Janson Industries
Interested in apps with…
▀
Gestures
▀
Databases
▀
Maps
▀
Ads
100
Copyright 2014 by Janson Industries
Spring 2015
▀
CIS2930
▀
Reference # 414625
▀
Tuesdays 6 – 9 pm, B session
▀
B107
101
Copyright 2014 by Janson Industries