讲解sCSCI3310、辅导Java语言、Java编程调试、讲解Mobile Computing
- 首页 >> Java编程 sCSCI3310 Mobile Computing & Application Development
Assignment 2 (Android and Google Maps)
CU Flowery Spot
Trumpet Tree at Science Centre
captured by CPRO CUHK
Due : Mar 18, 2019 (Mon) 11:59pm
In different seasons, blossom among the CUHK campus has decorated the hill and the suburbs area with
colourful charms and created many must-visit spots: in spring with the pink cherry blossoms in NA, in summer
with the blue Jacaranda, and in autumn with the purple Orchid tree. This assignment needs you to write an
Android App which can display a list of blossom images of flowery spots with Kotlin and Android Studio
3.2.x please try to implement the program on Android 8.0/8.1 (API 26/27). The default testing simulator is
Nexus 5X Portrait mode.
In this assignment, you need to set up a list of 10 blossom items in a grid-based photo gallery when the
program starts up. Each flower item only has to contain one thumbnail photo, and nothing else. As a practice of
various programming skills in this assignment, you need to use the Adaptor to display these flower images as a
Grid Layout of RecyclerView (master view) on screen. On clicking each item, you should be able to get the
GPS location of where the photo is taken from its EXIF field and show user the location in a MapView or the
StreetView through the use of Google Maps Android API.
Google Maps API provides enormous support to developers so that they can embed a map view in their app
easily, but at the same time showing great map features to the user. Adding map view to your own program is in
fact quite easy. But to do this, you need to go through several steps.
1. Register for your use of Map API in Google and obtain the key. You should follow the procedure listed here
(the steps are in Java, you may convert them into Kotlin on-the-fly or at the end):
https://developers.google.com/maps/documentation/android-api/start
2. Adding the library use of Map, as well as permissions needed, which is both Internet, and location
information in this assignment. 2
Requirements
Part I. Android Gallery of Blossom
Basically, in this part of the assignment you have to manage RecyclerView in a Grid Layout:
https://developer.android.com/guide/topics/ui/layout/recyclerview
https://developer.android.com/reference/android/support/v7/widget/GridLayoutManager.html
1. At start, your program should display 10 sample images in a Grid based RecyclerView included in the
assignment package [NOTE: all photos are provided under the permission of Communications and
Public Relations Office (CPRO), CUHK, please use them only within this assignment].
2. When one of the photos is long-pressed, a floating context menu with two options “Show Location on
Map” and “Show Panorama StreetView” should be displayed.
3.
4. Clicking on “Show Location on Map” shall bring user to a map view for showing floweryspot’s
location. Clicking on “Show StreetView Panorama” shall bring user to a panorama street view of the
flowery-spot. The destinating location, i.e. the GPS latitude/longitude pair, should be obtained from the
EXIF field of each flower photo (you can assume the photo always has the location information in this
assignment) and be passed to the map view for processing and display.3
Part II. Showing Locations on Maps and StreetViews to Flowery-spots
It is recommended you open a new project to try the Google Map Android API v2 tutorial in order to
understand the properties of Google map.
https://developers.google.com/maps/documentation/android-sdk/start
Once you have the confident in working on the map, you may proceed to do the following.
1. You need to embed a map into your flowery-spot app. The map type can be either normal, satellite or
hybrid.
2. In the “Show Location” map view, your program should add a marker on the destining GPS location
received from the previous gallery view. Your app should position the camera centered at the floweryspot
with suitable zoom in order to display nearby buildings’ name (like the mapView shown below).
3. In the “Show StreetView” panorama view, your program should display the street view while user will not
be able to move to a different panorama, not able to pinch to zoom, but able to re-orient the camera by
dragging and see street names displayed on the ground.
4. You should add a topmost fragment header for toggling between map view and street view. When you
press back button, the app should return to the screen prior to the current one.
Below is an example showing the map view and street view constructed when user query the location based
information to find the Trumpet Tree in Science Center.
4
References
1. To provide a floating context menu, you can follow the tutorial:
https://developer.android.com/guide/topics/ui/menus.html#FloatingContextMenu
2. ExifInterface programming reference is as follows:
https://developer.android.com/reference/android/media/ExifInterface.html
[Note: ExifInterface only support absolute input stream or file path e.g. on SD card. In other words, path within
the APK, e.g. /res/drawable, are not supported. Exploiting temporary file could be a possible choice].
Extensions
There exist quite several extensions you may work with in this assignment if you find it interesting. Here are
some of the suggestions.
1. Gallery is now of fixed number of images and could be extended to provide function for adding or
deleting image. Adding an image could be done by FAB while deleting an image can be implemented
within the same floating action contextual menu item.
2. Google Direction API provides a mean to search for path between two end points. It is a part of the
Google Map API which is originally supported in Javascript. Some external client for different
programming language such as Java is also available:
https://android.jlelse.eu/google-maps-directions-api-5b2e11dee9b0
GMap Services Java client (for processing Javascript Direction query result):
https://developers.google.com/maps/documentation/directions/client-library
Setup of GMaps Android Util for decoding route as polyline display:
https://developers.google.com/maps/documentation/android-api/utility/setup
Submission
You should pack all your program and related files e.g. icon file, settings etc. into a folder named 3310_asg2, and zip the
folder into the same named zip or rar file, and submitted it into our assignment collection slot in Blackboard system before
the deadline, Mar 18, 2019 11:59pm.
Late submissions will risk a mark deduction from 10% to 50% if they are being done within 48 hours after the deadline.
Submission later than Mar 20 11:59pm won’t be considered.
Assignment 2 (Android and Google Maps)
CU Flowery Spot
Trumpet Tree at Science Centre
captured by CPRO CUHK
Due : Mar 18, 2019 (Mon) 11:59pm
In different seasons, blossom among the CUHK campus has decorated the hill and the suburbs area with
colourful charms and created many must-visit spots: in spring with the pink cherry blossoms in NA, in summer
with the blue Jacaranda, and in autumn with the purple Orchid tree. This assignment needs you to write an
Android App which can display a list of blossom images of flowery spots with Kotlin and Android Studio
3.2.x please try to implement the program on Android 8.0/8.1 (API 26/27). The default testing simulator is
Nexus 5X Portrait mode.
In this assignment, you need to set up a list of 10 blossom items in a grid-based photo gallery when the
program starts up. Each flower item only has to contain one thumbnail photo, and nothing else. As a practice of
various programming skills in this assignment, you need to use the Adaptor to display these flower images as a
Grid Layout of RecyclerView (master view) on screen. On clicking each item, you should be able to get the
GPS location of where the photo is taken from its EXIF field and show user the location in a MapView or the
StreetView through the use of Google Maps Android API.
Google Maps API provides enormous support to developers so that they can embed a map view in their app
easily, but at the same time showing great map features to the user. Adding map view to your own program is in
fact quite easy. But to do this, you need to go through several steps.
1. Register for your use of Map API in Google and obtain the key. You should follow the procedure listed here
(the steps are in Java, you may convert them into Kotlin on-the-fly or at the end):
https://developers.google.com/maps/documentation/android-api/start
2. Adding the library use of Map, as well as permissions needed, which is both Internet, and location
information in this assignment. 2
Requirements
Part I. Android Gallery of Blossom
Basically, in this part of the assignment you have to manage RecyclerView in a Grid Layout:
https://developer.android.com/guide/topics/ui/layout/recyclerview
https://developer.android.com/reference/android/support/v7/widget/GridLayoutManager.html
1. At start, your program should display 10 sample images in a Grid based RecyclerView included in the
assignment package [NOTE: all photos are provided under the permission of Communications and
Public Relations Office (CPRO), CUHK, please use them only within this assignment].
2. When one of the photos is long-pressed, a floating context menu with two options “Show Location on
Map” and “Show Panorama StreetView” should be displayed.
3.
4. Clicking on “Show Location on Map” shall bring user to a map view for showing floweryspot’s
location. Clicking on “Show StreetView Panorama” shall bring user to a panorama street view of the
flowery-spot. The destinating location, i.e. the GPS latitude/longitude pair, should be obtained from the
EXIF field of each flower photo (you can assume the photo always has the location information in this
assignment) and be passed to the map view for processing and display.3
Part II. Showing Locations on Maps and StreetViews to Flowery-spots
It is recommended you open a new project to try the Google Map Android API v2 tutorial in order to
understand the properties of Google map.
https://developers.google.com/maps/documentation/android-sdk/start
Once you have the confident in working on the map, you may proceed to do the following.
1. You need to embed a map into your flowery-spot app. The map type can be either normal, satellite or
hybrid.
2. In the “Show Location” map view, your program should add a marker on the destining GPS location
received from the previous gallery view. Your app should position the camera centered at the floweryspot
with suitable zoom in order to display nearby buildings’ name (like the mapView shown below).
3. In the “Show StreetView” panorama view, your program should display the street view while user will not
be able to move to a different panorama, not able to pinch to zoom, but able to re-orient the camera by
dragging and see street names displayed on the ground.
4. You should add a topmost fragment header for toggling between map view and street view. When you
press back button, the app should return to the screen prior to the current one.
Below is an example showing the map view and street view constructed when user query the location based
information to find the Trumpet Tree in Science Center.
4
References
1. To provide a floating context menu, you can follow the tutorial:
https://developer.android.com/guide/topics/ui/menus.html#FloatingContextMenu
2. ExifInterface programming reference is as follows:
https://developer.android.com/reference/android/media/ExifInterface.html
[Note: ExifInterface only support absolute input stream or file path e.g. on SD card. In other words, path within
the APK, e.g. /res/drawable, are not supported. Exploiting temporary file could be a possible choice].
Extensions
There exist quite several extensions you may work with in this assignment if you find it interesting. Here are
some of the suggestions.
1. Gallery is now of fixed number of images and could be extended to provide function for adding or
deleting image. Adding an image could be done by FAB while deleting an image can be implemented
within the same floating action contextual menu item.
2. Google Direction API provides a mean to search for path between two end points. It is a part of the
Google Map API which is originally supported in Javascript. Some external client for different
programming language such as Java is also available:
https://android.jlelse.eu/google-maps-directions-api-5b2e11dee9b0
GMap Services Java client (for processing Javascript Direction query result):
https://developers.google.com/maps/documentation/directions/client-library
Setup of GMaps Android Util for decoding route as polyline display:
https://developers.google.com/maps/documentation/android-api/utility/setup
Submission
You should pack all your program and related files e.g. icon file, settings etc. into a folder named 3310_asg2, and zip the
folder into the same named zip or rar file, and submitted it into our assignment collection slot in Blackboard system before
the deadline, Mar 18, 2019 11:59pm.
Late submissions will risk a mark deduction from 10% to 50% if they are being done within 48 hours after the deadline.
Submission later than Mar 20 11:59pm won’t be considered.