Challenges¶

Challenge 1: Creating a non-trivial app¶

edu.app¶

I made this app with MIT App Inventor back in 2015 for a contest, Galiciencia 2015. It was an app for all the educational community in my region, Galicia.
This app provides different zones for each kind of person: students, teachers or parents. For example, teachers have a service to report incidents that a student made to their parents (although it used Google Fusiontables and now it does not work properly), and students have a calculator and a translator.

The passwords needed to access each respective area are as follows: estudante15alumno16 for students (alumno), 2015xade2016mestres for teachers (profesor), and 2015pais2016 for parents (pais).

The app has been re-built to ensure it works with the latest MIT App Inventor version (nb183).
It has been tested in both local and ai2 online servers.

Downloads¶

Challenge 2: Design challenge¶

Enhancing the Camera operation¶

The useFront property¶

The useFront property made use of the android.intent.extras.LENS_FACING_FRONT intent extras. However, Google deprecated it in the release of Lollipop MR1 (Android SDK 22, Android 5.1), so it is not working with newer Android OS releases:

if (useFront) {
  intent.putExtra("android.intent.extras.CAMERA_FACING", 1);
}

This intent extra was being added when the TakePicture method was called (as seen in Camera.java#L170). So, when trying to invoke the camera intent, newer phones did not recognize the extras because it was removed. Consequence: no front camera working by default.
Solution: using a conditional check to know the SDK version and the new android.intent.extras.LENS_FACING_FRONT should get the job done, in theory:

if (useFront) {
  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP_MR1)
    intent.putExtra("android.intent.extras.LENS_FACING_FRONT", 1);
  else
    intent.putExtra("android.intent.extras.CAMERA_FACING", 1);
}

Related issues in appinventor-sources: ¹²

Taking photos automatically¶

The current Camera component invokes an Android intent in order to call the Android camera. It is not a self-baked Camera, it just makes a request to the Android OS to take a photo using the native Camera.
So, to avoid confusing users, I would create a new component. Users link Camera with the normal phone's camera, and if they were to see two different blocks to take pictures, it would conflict with the component's purpose. However, having it as two separate components makes it easier, as they do not conflict with each other.

To implement an "automatic" photo camera component in MIT App Inventor, first it is needed to understand that Android OS by itself does not allow such thing. As it is understandable, it could incurr in security issues. However, there is a trick that may bypass this limitation, that is implementing a Surface View.
A Surface View³ is an Android layout that creates a camera inside the app. It places the image of the camera inside a layout. This special layout was designed to allow the creation of custom camera apps, so users could take photos defining the look and feel. By using this component, the camera can be used without any control (it will be ready after approving the camera permission).
So, the trick consists in creating a 1x1 pixels layout using the Surface View (and maybe making it not-visible, if it works). By doing it so small, Android OS thinks there is an active camera that is being "used" by the user, and it allows taking photos without any control.

In order to create a new component in MIT App Inventor, the following files need to be altered:

Images.java
appinventor/appengine/src/com/google/appinventor/client/
This file is the one that links components images files to usable image paths in Google Web Toolkit, to be rendered in Google App Engine.
The following lines shall be added:
```
/**
 * Designer palette item: Surface View component
 */
@Source("com/google/appinventor/images/surfaceView.png")
ImageResource surfaceView();
```
OdeMessages.java
appinventor/appengine/src/com/google/appinventor/client/
Modifying this file is optional, as MIT App Inventor changed the translation system some time ago. OdeMessages.java is the file that contains all localizable strings in App Inventor. Thus, the system checked of the component had the required String's defined here.
Then, this file gets exported to a .properties one, which can be parsed and uploaded to translations centre to be later imported in the respective languages.
SimpleComponentDescriptor.java
appinventor/appengine/src/com/google/appinventor/client/editor/simple/palette
This file is the needed one to link each component's images (stored in the appengine/ folder) with the component itself. It makes "creates" a link that makes the first link point to the second one (defined in Images.java).
The following lines shall be added:
```
bundledImages.put("images/surfaceView.png", images.surfaceView());
```
surfaceView.png
appinventor/appengine/src/com/google/appinventor/images/
This is the image file for the new component. Its name must match the one defined in Images.java.
YaVersion.java
appinventor/components/src/com/google/appinventor/components/common/
This file defines each component's version, used to make "upgrades". As a small summary, upgrades are made semi-automatically when a new property/block is added to a component, to let existing projects know that sources have been changed and they may need to modify some of the blocks, to match the new version.
In order to define the new component's version, the following lines shall be added:
```
//For SURFACEVIEW_COMPONENT_VERSION: Initial Version
public static final int SURFACEVIEW_COMPONENT_VERSION = 1;
```
SurfaceView.java
appinventor/components/src/com/google/appinventor/components/runtime/
Source code of the component. This component should be under the Layout category (even though it was designed with the purpose of taking pictures, the nature of the component is a view), and it should be a visible component. The component version shall be taken from the variable in YaVersion.java, and the appropriate icon based on the one described in SimpleComponentDescriptor.java.
Regarding the features, the base component could be like any arrangement (because a Surface View can get components inside it), specifying alignments, sizing, visibility, etc. Then, there could be a working property to set or not the front camera by default. And finally, there should be a method to directly take a picture (and the respective ones for start, pause and stop preview).

Regarding documentation, if Ruby is installed in the machine, App Inventor will automatically modify the documentation files after running ant. A specific tutorial could be added as well, explaining how the "automatic photo-taking" could be achieved using Surface View.

Just with those files, a basic Surface View would arrive to MIT App Inventor, adding the possibility of taking photos automatically without user interaction.
And it would not only add a single feature, but also a fully working component that brings lots of new possibilities to the platform.