Scribd
Upload
83 views

Parsing Json Appybuilder

FojYoJSON is a JSON decode extension for App Inventor that allows hierarchical acquisition of values within JSON data using tag names. It takes a JSON text and search instruction list to retrieve specific values. For example, it can obtain the second author of the first book or the author of the second book. The extension represents arrays with a single element as a single value. It can also extract multiple values like all book titles and authors by processing the JSON data recursively.

Uploaded by

Depri Pramana
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
83 views

Parsing Json Appybuilder

FojYoJSON is a JSON decode extension for App Inventor that allows hierarchical acquisition of values within JSON data using tag names. It takes a JSON text and search instruction list to retrieve specific values. For example, it can obtain the second author of the first book or the author of the second book. The extension represents arrays with a single element as a single value. It can also extract multiple values like all book titles and authors by processing the JSON data recursively.

Uploaded by

Depri Pramana
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

FoYoJSON : a JSON Decode Extension

Fujio Yamamoto, Jan. 22, 2019


Outline

JSON format is often used when receiving data from Web services, etc. In App Inventor, you can
convert JSON to nested list with JsonTextDecode in the web block. Then, the conversion result can
be manipulated by the selectItem and lookUpInPairs of the list block. However, as Evan W Patton
(MIT) pointed out in the following paper [1], these list processes are generally cumbersome.

And he suggested a more readable and compact expansion block to alleviate this. I independently
developed an Extension (FoYoJSON) for JSON decode based on his idea. This Extension may be
intuitive and easy to understand because it can hierarchically acquire necessary information with the
tag names without using complex operations on nested lists. The outline is shown in the figure
below.

This Extension takes two arguments. One is JSON text converted into list structure. The other is a
search instruction list for hierarchically specifying the value of a specific tag (property). In this
example, JSON text holds the values of four kinds of sensors as "healthData". In the following
figure, the name of the third sensor is searched. Note that in the query list, a number such as "3"
indicates the element index of the JSON array. This extension was created using AppyBuilder Code
Editor [2].

response from a web service

existing Web block

converted
new JSON extension nested list

Outline of the proposed Extension


Typical example of JSON text

The following is an example of JSON text. This is a search result by the keyword "App Inventor".
GoogleBook Search was used here. From this result, we stored information on two books in
BookInfo.json. In the JSON structure, two kinds of parentheses, "{ }" and "[ ]" are used. The latter
refers to an array. The following shows how Extension FoYoJSON is used for this JSON text.

BookInfo.json: to be assigned to the variable response shown above


{
"kind": "books#volumes",
"totalItems": 395,
"items": [
{
"kind": "books#volume",
"id": "GzgCBQAAQBAJ",
"volumeInfo": {
"title": "App Inventor 2",
"subtitle": "Create Your Own Android Apps",
"authors": [
"David Wolber",
"Hal Abelson",
"Ellen Spertus",
"Liz Looney"
],
"publisher": "¥"O'Reilly Media, Inc.¥"",
"publishedDate": "2014-10-13",
"description": "Yes, you can create your own apps for Android devices ..."
}
},
{
"kind": "books#volume",
"id": "8ZKvZHBxjYYC",
"volumeInfo": {
"title": "App Inventor for Android",
"subtitle": "Build Your Own Apps - No Experience Required!",
"authors": [
"Jason Tyler"
],
"publisher": "John Wiley & Sons",
"publishedDate": "2011-04-04",
"description": "Create Android mobile apps, no programming required! ..."
}
}
]
}
How to get the value of a tag (property) separately

For example, to obtain the value of the tag "totalItems", simply give "totalItems" to the query list
queryL of this Extension. However, please give this as a list as follows. Then you will get the value
"395".

Next, in order to obtain "the second author's name of the first book", give "items, 1, volumeInfo,
authors, 2" as a list as follows. Then you will get "Hal Abelson". Here, the numbers "1" and "2"
mean the array element index (starting from 1). Note that the value of "item"s and the value of
"authors" are both arrays.

Another example of a similar search is shown below. Search "the author's name of the second book".
To do that, give "items, 2, volumeInfo, authors" as a list as follows. Then you will get "Jason Tyler".
There is an attention here. The tag "authors" denotes an array, but it has only one element. In such a
case, this Extension does not treat it as an array. Therefore, "items, 2, volumeInfo, authors, 1" is
incorrect. Do not add "1" at the end.

Again, this Extension converts an array or list with only one element as follows. Provide search list
(queryL) based on this conversion concept.
"authors": ["Jason Tyler"] -> "authors":"Jason Tyler"
"X": [{"B":"b", "D":"d"}] -> "X": {"B":"b", "D":"d"}
{{"S":"s", "U":"u"}} -> {"S":"s", "U":"u"}

How to get all of array elements

This JSON text contains information on multiple books. The program that extracts the title and
author names from all of them (two books in this example) is as follows. There is information on two
books in the list jsonL which is the value of the tag "items". The "for each" block processes subList
containing information of each book. Also note that Extension FoYoJSON is recursively used as
follows:

sublist -> FoYoJSON for “volumeInfo” -> subList -> FoYoJSON for “title”
-> FoYoJSON for “authors”

References
[1] Evan W Patton, Danny Tang:JSON Interoperability in MIT App Inventor:
https://2018.splashcon.org/event/blocks-2018-papers-json-interoperability-in-mit-app-inventor
[2] AppyBuilder Code Editor, http://Editor.AppyBuilder.com

You might also like