Lecture 13 Mobile Programming
description
Transcript of Lecture 13 Mobile Programming
![Page 1: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/1.jpg)
Lecture 13Mobile
Programming
Google Maps Android API
![Page 2: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/2.jpg)
Agenda
• Generating SHA1 Fingerprint
• Signing up for API Key (as developer)
• Permissions
• MapFragment and GoogleMap object
• Layers
• MyLocation
![Page 3: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/3.jpg)
Google Maps API Key
• In order to use the Google Maps API, you first need to obtain an API key and configure your app
• GoogleMap API v1 is obsolete!!• Now, you better use GoogleMap API v2.
o https://docs.google.com/document/pub?id=19nQzvKP-CVLd7_VrpwnHfl-AE9fjbJySowONZZtNHzw
o Please read page 863 – 970 in your textbook!
![Page 4: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/4.jpg)
Getting the SHA1 Fingerprint
• To register for a Maps API Key, you need to provide an SHA1 fingerprint of the certificate that you will use to sign your application
• Navigate to C:\Documents and Settings\<User>\.android
• Run the following commandkeytool -list –v –keystore debug.keystore -alias androiddebugkey -storepass android -keypass android
• Copy the text that comes after Certificate fingerprint (SHA1):
• Go Google API Console and sign up for the Android Maps API
• Save the generated API key, you will use it in your app.
![Page 5: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/5.jpg)
Use (Support) WebFragment
• In the layout file:• You need define a <fragment>• Give it an id, so you can access it in source code.• Class=“com.google.android.gms.maps.MapFragmen
t” or SupportMapFragment depending on the version of your phone.
![Page 6: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/6.jpg)
Use (Support) WebFragment
• In the java file:• SupportMapFragment mapFrag = (SupportMapFragment)
getSupportFragmentManager().findFragmentById(R.id.mapView)
• GoogleMap map = mapGrag.getMap();
• CameraUpdate center = CameraUpdateFactory.newLatLng(new LatLng(x, y), where x and y are double/float.
• map.moveCamera(center)
• CameraUpdate zoom = CameraUpdateFactory.zoomTo(15).
• map.animateCamera(zoom)
![Page 7: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/7.jpg)
Add Marker or OverlayItem
• Create Marker object • MarkerOptions mo = new
MarkerOptions().position(LatLng).title(“text”).snippet(“text”).draggable(true);
• Add a marker to the map object.• Map.addMarker(mo);
![Page 8: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/8.jpg)
Customized Info Window
• Create a new class that implements InfoWindowAdapter
• Class PopupAdapter implements InfoWindowAdapter{ LayoutInflater inflater; PopupAdapter(LayoutInflater inflater){ this.inflater = inflater; } @Override public View getInfoContents(Marker marker){ }
![Page 9: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/9.jpg)
Customized Info Window
• @Override public View getInfoContents(Marker marker){ View popup = inflater.inflate(R.layout.popup, null); TextView tv = (TextView) popup.findViewById(); tv.setText(Marker.getTitle); return popup; }
@OverridePublic View getInfoWindow(Marker marker){ return null;}
![Page 10: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/10.jpg)
Customized Info Window
• In java file:
• map.setInfoWindowAdapter(new PopuoAdapter(getLayoutInflater()));
![Page 11: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/11.jpg)
Find My Location
• In java file:• map.setMyLocationEnabled(true);
• You must call map.setOnMyLocationChangeListener(Listener)
• The listener must override the method:
• Public void onMyLocationChange(Location lastKnownLocation)
![Page 12: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/12.jpg)
Map Listeners• setOnCameraChangeListener(this)
o implement OnCameraChangeListenero Override public void onCameraChange(CameraPosition position)
• setMyLocationChangeListener(this):o implement OnMyLocationChangeListenero Override public void onMyLocationChange(Location lastKnownLocation)
• If you set marker.draggable(true)o Implement OnMarkerDragListenero Override three methods:
onMarkerDrag(Marker maker) onMarkerDragEnd(Marker marker) onMarkerDragStart(Marker marker)
![Page 13: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/13.jpg)
Guesture• The user can change zoom level either by + and - buttons or via “pinch-to
zoom” gestures
• The user can change the center of the map via simple swipe gestures
• The user can change the camera tilt via two-finger vertical swipes, so instead of a traditional top-down perspective, the user can see things on an angle
• The user can change the orientation of the map via a two-finger rotating swipe, to change the typical “north is to the top of the map” to some other orientation
![Page 14: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/14.jpg)
Control
• You can enable and disable those gestures by:o setRotateGesturesEnabled()o setScrollGesturesEnabled() (for panning the map)o setTiltGesturesEnabled()o setZoomControlsEnabled() (for the + and - buttons)o setZoomGesturesEnabled() (for pinch-to-zoom)o SetCompassEnable()
![Page 15: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/15.jpg)
JSON Values
• "title" : "IT Business Analyst Intern"
• "organization" : "Medtronic"
• "city" : "Brooklyn Park"
![Page 16: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/16.jpg)
JSON Arrays
"details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
![Page 17: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/17.jpg)
JSON Objects
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/10" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
![Page 18: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/18.jpg)
Parsing JSONJSONObject json = new JSONObject(raw);
final String moviePlot = "" + json.getString("Plot");
mTextMoviePlot.post(new Runnable() {@Overridepublic void run() {mTextMoviePlot.setText(moviePlot);
}});
![Page 19: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/19.jpg)
Parsing JSONJSONObject json = new JSONObject(raw);
final String moviePlot = "" + json.getString("Plot");
mTextMoviePlot.post(new Runnable() {@Overridepublic void run() {mTextMoviePlot.setText(moviePlot);
}});
JSONObject is a set of name/value mappings, can represent a JSON document
![Page 20: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/20.jpg)
Parsing JSONJSONObject json = new JSONObject(raw);
final String moviePlot = "" + json.getString("Plot");
mTextMoviePlot.post(new Runnable() {@Overridepublic void run() {mTextMoviePlot.setText(moviePlot);
}});
Retrieve the plot of the movie
![Page 21: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/21.jpg)
Parsing JSON
Parsing JSON is not always this simple however, but it's usually straightforward once you understand JSON
A JSONObject may consist of more JSONObjects, JSONArrays, Strings, Booleans, Integers, etc
![Page 22: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/22.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
![Page 23: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/23.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with
pie"]}
This is a JSONObject
![Page 24: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/24.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
You can get title by calling getString("title") on the JSONObject
![Page 25: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/25.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
You can get organization by calling getString("organization") on the JSONObject
![Page 26: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/26.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
Etcetera, etcetera ...
![Page 27: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/27.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with
pie"]} This however, is not a String,
but an array. Get this by calling getJSONArray() on the JSONObject
![Page 28: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/28.jpg)
Parsing JSON
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with
pie"]} After which you can use the
getters on the JSONArray to get the desired data
![Page 29: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/29.jpg)
Parsing JSON
How would you represent this data using XML?
{"title" : "IT Business Analyst Intern" , "organization" : "Medtronic" , "city" : "Brooklyn Park" , "state" : "MN" , "start_date" : "05/10" , "end_date" : "07/11" , "details" : [ "bla bla bla" , "drank some soda" , "hit manager in face with pie"]
}
![Page 30: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/30.jpg)
Parsing JSON
See HttpGetJsonExample.tar
![Page 31: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/31.jpg)
FACEBOOK API
See FacebookApiExample.tarSee FacebookHello.tar
![Page 32: Lecture 13 Mobile Programming](https://reader036.fdocuments.us/reader036/viewer/2022062316/56816875550346895ddee882/html5/thumbnails/32.jpg)
References
• The Busy Coder's Guide to Android Development - Mark Murphy
• Android Developers
• The Mobile Lab at Florida State University