In this exercise, you will develop an Android application, which allows users to search for cities to see weather summary, look at detailed information about them, pin those cities to favorites and post on Twitter about the weather.

INSTRUCTIONS TO CANDIDATES

ANSWER ALL QUESTIONS

Objectives

Become familiar with Java, JSON, Android Lifecycle and Android Studio for Android app development.

Build a good-looking Android app.

Learn the essentials of Google’s Material design rules for designing Android apps

Learn to use the Google Maps APIs and Android SDK.

Get familiar with third party libraries like Picasso, Glide and Volley.

The objective is to create an Android application as specified in the document below and in the video

Background

Android Studio

Android Studio is the official Integrated Development Environment (IDE) for Android application development, based on IntelliJ IDEA - a powerful Java IDE. On top of the capabilities you expect from IntelliJ, Android Studio offers:

Flexible Gradle - based build system.

Build variants and multiple apk file generation.

Code templates to help you build common app features.

Rich layout editor with support for drag and drop theme editing.

Lint tools to catch performance, usability, version compatibility, and other problems.

ProGuard and app-signing capabilities.

Built-in support for Google Cloud Platform, making it easy to integrate Google Cloud Messaging and App Engine.

Android

Android is a mobile operating system initially developed by Android Inc., a firm purchased by Google in 2005. Android is based upon a modified version of the Linux kernel. As of Nov 2018, Android was the number 1 mobile OS, in unit sales, surpassing iOS, while iOS was still the most profitable platform.

Prerequisites

This homework requires the use of the following components:

Download and install Android Studio. Technically, you may use any other IDE other than Android Studio such as Eclipse, but the latest SDKs may not be supported with Eclipse. We will not be providing any help on problems arising due to your choice of alternate IDEs.

You must use the emulator. Everything should just work out of the box.

If you are new to Android Development, Hints are going to be your best friends!

 

High Level Design

This homework is a mobile app version of Homework 8.

In this exercise, you will develop an Android application, which allows users to search for cities to see weather summary, look at detailed information about them, pin those cities to favorites and post on Twitter about the weather.

You should reuse the Node.js backend service you developed in Homework 8 and follow the same API call requirements. In case you need to change something in Node, make sure you do not break your Angular assignment (or deploy a separate copy) as the grading will not be finished at least until 2 weeks later.

PS: This app has been designed and implemented in a Pixel 3XL emulator. It is highly recommended that you use the same virtual device to ensure consistency.

Implementation

App Icon and Splash Screen

 

In order to get this icon/image, go to the icon’s web page specified in the hints. Using advanced export option, set the colors and a correct size to download the PNG icon.

 

The app begins with a welcome screen (Figure 2) which displays the icon downloaded above. This is also where we credit Darksky for using their APIs and data.

This screen is called Splash Screen and can be implemented using many different methods. The simplest is to create a resource file for launcher screen and adding it as a style to AppTheme.Launcher

 

 

Home Screen / Current Location / Weather Summary View

As soon as you open the app, the summary view of the current location is displayed. The tabs on the right swipe are described in a later section.

This view is also called the summary view. The summary view has a selected amount of information which might be most useful for a user. It has the following fields

Card 1:

Icon: “icon” property in “currently” json. The mapping of Darksky’s icon field and our app’s icon is given in the implementation

Temperature: “temperature” property in “currently” json. Make sure that the temperature is rounded off to nearest integer.

Summary: Summary field from the “currently” json. You must limit the summary field to upto 2 lines and terminate any longer strings with “…” at the end

City: Name of the city to which this card belongs. You can use either the autocomplete suggestion or the name returned by Darksky.

On click: Clicking this card will open a new “detailed weather information view” 

Card 2:

This shows 4 selected values from the “currently” property. i.e. humidity, windspeed, visibility, pressure. Make sure all floats are terminated to exactly 2 digits after the decimal point. Also ensure that the correct icons are used,

“humidity” is returned between 0 and 1 by the API - convert it to % by either mathematical operations or by dropping everything before “.” followed by a % symbol.

“windSpeed” property from currently json is used. The unit is mph.

“visibility” property from “currently” json is used. The unit is km.

“pressure” property from “currently” json is used. The unit is mb.

Card 3:

This card is used to display a quick overview of the next week’s temperature. The predictions are available inside the “data” array of “daily” json. Each row in the table consists of:

Date: “time” property converted to a MM/DD/YYYY format

Icon: based on the “icon” property. The mapping of Darksky’s icon field and our app’s icon is given

Minimum temperature: “temperatureLow” property in the json, rounded off to integer.

Maximum temperature: “temperatureHigh” property in the json, rounded off to integer.

This must display all 8 days of information. You must use a ScrollView to achieve this table.

 

Notes:

JSON property names are written for reference. For exact structure please refer to HW8

If any of the details are missing, you can use a default value of 0 or “N/A”

All floats are rounded to exactly 2 digits after the decimal point.

All temperatures must be rounded off to nearest integers.

The iOS version of the app shows sunset/sunrise timings. Please note, we will display min-max temperatures.

Searching for a new city

In a typical weather app, we need to provide only the city name to search. Our app will be a Google recommended “Searchable” app.

On top right side, there will be a search button which opens a textbox where the user can type name of a city.

for icon.

The user is provided with suggestions of city names using the places API.

When the user taps on a suggestion, it is filled inside the search box and clicking enter/next takes the user to the next page.

Before you get the data from your backend server, a progress bar should display on the screen as indicated in Figure 12.

On the next page, the user will then be redirected to a new page/activity which will show the summary view (described above in section 5.2).

Notes:

If your Node backend from Assignment 8 returns only the city name and not the state and country, you can still use that.

If you still have to change Node backend, make sure you don’t break the Angular app (if grading is still in progress) or deploy a newer instance of Node.

Reusing the summary view and the corresponding logic to dynamically set the value will make it much faster to implement this.

Do not forget the static “Search Results” label on top.

Favorites button: This button will add/remove a city to/from the favorites. This can be implemented using a Floating Action Button. The icon of the button should also change based on whether the city currently belongs to favorites or not. For more details see video and implementation hints.

Clicking on the top card, also opens the same details view as described in the section 5.4

 

Attachments:

Related Questions

. Introgramming & Unix Fall 2018, CRN 44882, Oakland University Homework Assignment 6 - Using Arrays and Functions in C

DescriptionIn this final assignment, the students will demonstrate their ability to apply two ma

. The standard path finding involves finding the (shortest) path from an origin to a destination, typically on a map. This is an

Path finding involves finding a path from A to B. Typically we want the path to have certain properties,such as being the shortest or to avoid going t

. Develop a program to emulate a purchase transaction at a retail store. This program will have two classes, a LineItem class and a Transaction class. The LineItem class will represent an individual

Develop a program to emulate a purchase transaction at a retail store. Thisprogram will have two classes, a LineItem class and a Transaction class. Th

. SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of Sea Ports. Here are the classes and their instance variables we wish to define:

1 Project 1 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of

. Project 2 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of Sea Ports. Here are the classes and their instance variables we wish to define:

1 Project 2 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of