CPSC 110-08: Computing on Mobile Phones
Spring 2012

Sharing Your App



CS Principles

This activity addresses the idea that computing is a creative activity. It has the following learning objective:

Introduction

In order to work together in a 2-person project, it will be necessary to share source code, which includes all the components and blocks that make up an App Inventor app. To share code, you need to download a zip file of your project, which can then be uploaded by your partner.

You might will also want to share a runnable version of an app with friends who have Android phones. In that case you'll be shaing an APK file, which is an Android package file.

To help facilitate sharing files, we'll store them in a special folder on our portfolio's.

Create a File Cabinet Page: Login in to your Portfolio and create a new page (tab on the top right). Select the File Cabinet. Name your page something like MyApps. You might also want to add that page to your Navigation Bar, by choosing Edit sidebar.

Sharing Your Source Code

In order to work together in a 2-person project, it will be necessary to share source code, which includes all the components and blocks that make up an App Inventor app.

  1. Download Your Project's Source Code: From within the App Inventor Designer page, select "My Projects" and then checkmark the project you want to share. Under the "More Actions" tab, choose "Download Source".

    This will download a file named ".zip" (e.g., "HelloPurr.zip"). Save it on your desktop.

  2. Don't Unzip This File: If you are sharing it with a partner, just email it, as is (not unzipped), to your partner. Your partner should use the "My Projects > More Actions > Upload Source" option to upload the Zip file.

  3. Upload the Zip File To Your Portfolio Page: Click on the link to your MyApps (file cabinet) page and choose the Add File. Then browse to your ZIP file and upload it.

  4. Your ZIP's URL: In order to link to your ZIP file you'll need to know its URL (Uniform Resource Locator) for your file. Assuming your file cabinet is named MyApps and your app is named MyApp, your URL will be: https://sites.google.com/site/yourportfolioname/MyApps/MyApp.zip. Type carefully. It's case sensitive.

  5. Create a Link to Your ZIP File: To create a link to the ZIP file on your Portfolio page, follow these steps:

Sharing Your App

This part shows you how to share your app with friends and others who have Android phones. We will create an APK file that can be downloaded to an Android phone. We'll upload that file to our Portfolios. Your friends will be able to download the file and install it on their Android phones.

  1. Create a File Cabinet Page: If you haven't already done so, create a file cabinet page in your portfolio -- see instructions above.

  2. Package Your App for a Phone: When your app is finished select the Download to this Computer under the Package for Phone tab. This will create what is called an APK file, an Android package file -- a file that is bundled to be downloaded to an Android phone. If your app is named MyApp, your APK file will be named MyApp.apk.

  3. Upload your APK File to Portfolio File Cabinet: Click on the link to your MyApps page and choose the Add File. Then browse to your APK file and upload it.

  4. Your APK's URL: In order to link to your APK file you'll need to know its URL (Uniform Resource Locator) for your file. Assuming your file cabinet is named MyApps and your app is named MyApp, your URL will be: https://sites.google.com/site/yourportfolioname/MyApps/MyApp.apk. Type carefully. It's case sensitive.

  5. Create a Link to Your APK: To create a link to the APK on your Portfolio page, follow these steps:

Downloading and Running an Android App

This step assumes you have already created an APK file for your app and uploaded it to your portfolio. You need to know its exact URL. For example, let's suppose your app's URL is: https://sites.google.com/site/yourportfolioname/MyApps/MyApp.apk.

It also assumes your phone is set to accept non market apps. If not go to Settings > Applications and make sure you have checked the Unknown sources option:


  1. Download the APK File to Your Computer: Use the phone's Browser to download the APK file -- i.e., simply type the app's URL into the browser. For this to work you'll need to be connected to the Internet by WiFi or you'll need to have a data plan on your phone.

    If you type the correct URL into your browser, the phone will download the APK file. The download icon will appear in the status bar:

  2. Pull Down the Status Bar Menu: The status bar is like a window shade. Pull it down to expose the following menu;

  3. Click on the APK file (the example here is WhereIsNorth.apk) and you'll be prompted to install it:

    Click ok to install the app and run it like any other app on your phone.

Creating a QR Code for Your App

This step assumes you have already created an APK file for your app and uploaded it to your portfolio. You need to know its exact URL. For example, let's suppose your app's URL is: https://sites.google.com/site/yourportfolioname/MyApps/MyApp.apk.

We will create a 2-D bar code, a QR Code that will be associated with your app's URL. You can them simply post the QR code on your Portfolio. Your friends will then be able to use a bar code reader app on their Android phones to download your app.

  1. Generate the QR Code Image: Go to the following site, http://qrcode.kaywa.com/, and paste your URL into the text box and click the "Generate" button. This will generate a 2-d barcode image, as seen in this figure (click to enlarge).

  2. Save the QR Image: Right click on the QR code image and save this image to your desktop or somewhere. The default name for the file will be something like "img.php" or "img.php.png". You'll want to rename it to "myapp.png" or something similar. The file name must have a ".png" extension in order to upload it.

  3. Upload the QR Code Image to your Portfolio: Upload the saved QR Image to your Portolio page -- by selecting Insert > Image while in edit mode. After copying and saving the QR image, upload it to your portfolio.

  4. Download to Your Phone: Test that the QR code is correct by downloading the app to your phone using the Barcode Scanner app. If not already installed on your phone, you can find one by searching the Android Market. Once you've installed Barcode Scanner, point it at your QR code and download your app.

  5. That's It! Just point your friends to your Portfolio.