Individual Programming Assignment 1

From CS160 Spring 2013
Jump to: navigation, search

Due: by 11:59pm on Feb 1

20 points - Programming (Any changes to submissions are now late and will be disregarded)

Overview

In your first assignment you will learn how to:

  • Install the Android SDK and developer tools
  • Start programming with the Android SDK
  • Build a simple Android application and test it in the emulator

You will build a tip calculator .

Imagine you are eating dinner with your friends at Zachary's. The bill has just arrived and you need to split it evenly. Luckily you have your trusty tip calculator app that you built in CS160. You can enter the total bill amount, select a tip percentage and the number of people to split the bill between.

You will submit your source code, the executable, screenshots and a narrated video. It is your responsibility to ensure that the executable has all the resources it needs to execute.

Instructions

  1. Choose a development machine: You should be able to do development on your own laptop and we expect that most people will want to do this. Android has good support for Windows, Mac and Linux. You can also use EECS instructional machines in 277 Soda if you want to. Please send us a message on Piazza right away if you want to go that route so we can get some machines set up.
  2. Install the Android SDK and development tools: Instructions for setting up the tools and environment are in Section 1: Installing the Android SDK. We have had success with WinXP(32 bit), Vista(32 bit) and Windows 7(64 bit), an OS X Mac and Linux. The section on Thursday 1/24 will cover how to do this, on your own machine and the lab computers. We recommend using Eclipse as your IDE. You can also build Android applications through the command line, but we will not be able to help you with this process.
  3. Application Functionality: Your application must
    1. be able to enter a bill amount,
    2. calculate 10, 15, or 20% tip.
    3. split the final bill amount among a number of guests.

One possible way of achieving these goals is to break your application down in the following fashion:

The first view should be the tip calculator.

  • Provide a text field for entering the bill amount.
  • Provide radio buttons for calculating 10, 15, or 20% tip.
  • Provide a button to switch to the bill splitter view.

The second view should be the bill splitter.

  • Provide a text field for entering the number of guests.
  • Provide a button to calculate the amount per guest.

This is by no means a brilliant design for a tip calculator. You are free to design your own app provided that it has the functionality as enumerated above.

Grading Criteria

Full credit (20 points) will be given if your application compiles, runs, contains the functionality as detailed in the instructions, and your documentation (writeup, photos, video) is complete.

Up to 5 extra points will be given if you implement additions that make the application more usable or more aesthetically pleasing. For example, you can implement the following:

  • Create a (launcher) icon for the app
  • Use more flexible schemes to choose tip percentage: e.g. a slider, or a gridview.
  • Enable orientation (app should be viewable in portrait and landscape mode)
  • Custom calculator input buttons

Solution Example

Simple Implementation

The media player is loading... (YouTube link)

More Complex Implementation (Extra Credit)

The media player is loading...

QuickStart Guide

Creating a new Project

In Eclipse, Create a new project with File→New→Project. From within the new project dialog, select Android→Android Application Project.

Give the project a name, e.g. "TipCalculator". Check the most recent Android SDK version. Scroll down to find the properties for this project. Some suitable options here are:

  • Application Name: Tip Calculator
  • Package Name: edu.berkeley.cs160.yourname.prog1
  • Create Activity: TipCalculator
  • Minimum SDK version: 13

The SDK version is the alternative numbering for the 3.2 Honeycomb API. Click "Next" or "Finish" and you should find your project created in the Package Explorer. Explore the project. Under res→layout you will see the layout xml file as main.xml. This file defines the widgets in the UI. You typically edit this file first to create the widgets you need, and then add code to interact with them in the src directory. Navigate up to the src directory which will contain a file TipCalculator.java under the package node. Look inside. It will contain the definition of the new TipCalculator class with a single "onCreate" method which loads the layout file.

Building and Running

Try building the project with Project→Build Project. Assuming that worked, you can run the project in the emulator. Follow the directions in the course "Tips and Tricks" page. You should see a screen that says "Hello World, TipCalculator!". You are off and running. From here you can iterate on your design, gradually adding functionality.

Layout

You can use LinearLayout, AbsoluteLayout, or RelativeLayout containers. Droiddraw s a third-part utility that can help you generate layout files. If you use Droiddraw, it will give you an absolutelayout with pixel coordinates for all the widgets. RelativeLayout is the most general, but may be a little more work to get want you want. If you use LinearLayout, you may want to insert some empty FrameLayout objects between your widgets to add extra space. Setting the FrameLayouts height to zero, and using the layout_weight property instead produces the effect of elastic spacing between the widgets.

Some interesting links on layouts, and the options you have with them are:

You can breeze through the assignment even with Linear Layouts, but we would recommend experimentation with various different layout schemes once you are done with the basic code. The earlier you do this in the semester, the closer you inch to success in the final project.

Event Listeners

You will want several kinds of listeners on your widgets. OnClickListener's are the right option for buttons, RadioButtons have a special listener called OnCheckedChangeListener, and the OnEditorActionListener will allow you to respond to "enter" events on editable text boxes.

Submission Instructions

Create a Wiki Page for this assignment

Begin by creating a new wiki page for this assignment. Go to your user page. Edit your user page to add a link to a new wiki page for this assignment. The wiki syntax should look like this:

[[ProgrammingAssignment1-FirstName_LastName|Programming Assignment 1]]

Again replace FirstName and LastName with your name. Look at my user page for an example. Then click on the link and enter the information about your assignment.

Writeup and Photos / Videos

Describe (briefly) what design decisions you made and why you made them. Include screenshots of key screens.

Then record a short (<60 second) video of you using your application. Narrate and explain what you are doing. No video editing is necessary - you can send us a single take. To record your screen, try screencast-o-matic.com, or Quicktime Screen Recording on a Mac. You can either upload an MP4 file (<100Mb) or upload your video to YouTube and link to it.

To embed a video use the <mediaplayer> tag (documentation).

The two most common ways are to either upload an mp4 file like this: <mediaplayer>File:TIppyTipper.mp4</mediaplayer, or embed a YouTube video like this: <mediaplayer>http://www.youtube.com/watch?v=PexaFctGXE8</mediaplayer>

You should then upload your source as one file (described below) and in the wiki page, describe any extra credit functionality you implemented and want us to review.

Upload Project

  • Your submitted project must include both the full source code as well as the executable of the working application.
  • Create a zip file of your project tree (the top-level folder that includes the Eclipse project. Rename the zip file to firstname-lastname-ipa1.zip (e.g., bjoern-hartmann-ipa1.zip)
  • Upload the zip file to the ProgrammingAssignment1-FirstNameLastName page you just created:
    • Create a new file link like this: [[File:firstname-lastname-ipa1.zip]]
    • Save the page, then click on the File link you just created to upload the zip file.

Add Link to Your Finished Assignment

One you are finished editing the page, add a link to it at the bottom of the page with your full name as the link text. The wiki syntax will look like this: *[[ProgrammingAssignment1-FirstName_LastName|FirstName LastName]]. Hit the edit button for the last section to see how I created the link for my name.

Links to Finished Assignments

Add your submission below this line: