2018年12月20日木曜日

A good example of Extension for App Inventor

If you want to create your own blocks (Extensions blocks) with App Inventor, how about referring to the example below. It is an ImageProcessor Extension published on the MIT App Inventor site. This makes two images to be combined into one.
http://appinventor.mit.edu/extensions/

It is said to be "Unsupported" materials, but intelligible Java source code has been released. The main functions of this extension are as follows:
  • Fetch two images into the application, then creates an image combining the two.
  • Give a weight to decide which image to adopt strongly.
  • For all the pixels, for each of the elements of R, G, B, A, both images are combined according to the weight. It is as follows: (pixel in image C) = weight * (pixcel in image A) + (1 - weight) * (pixcel in image B)
  • Writes the image of the join result to external storage. In doing so, give write permission with annotation @UsesPermissions.
From the Java source code of this Extension, you can learn the following basic items:
  • Basic operation of pixels of an image
  • How to make a function block with and without return value
  • Generation of user event and its processing
  • How to set properties (image size, weight,  etc.)
After understanding this Java source program, I made a very simple application using this extension. The following figure shows the entire source program of this application. Of course, thanks to this Exrensions block, this is extremely consice. Furthermore, after preparing the Java source list, you do not need to set up the build environment yourself. The following cloud builder will take care of everything.

Complete source program using Extensions blocks
Two examples of execution result of this application are shown below. The images as expected were obtained. How fun this is!

Original images(above) and the combined image(blow)

I would like to introduce my second version Extension which is a little advanced now.


With this experience as a clue, you want to develop yet another unique Extensions. The following reference sites would help you.

# How to make Extension concretely
http://ai2.appinventor.mit.edu/reference/other/extensions.html
# Java source code for existing blocks in App Inventor
https://github.com/mit-cml/appinventor-sources/tree/master/appinventor/components/src/com/google/appinventor/components/runtime


0 件のコメント:

コメントを投稿