OpenLightGroup Blog

rss

Blogs from OpenLightGroup.net


Consuming The Netflix OData Service Using App Inventor

App inventor is a program that allows you to easily make applications that run on the Android system. This includes the Amazon Kindle Fire. Here are some links to get you started with App Inventor:

Setup

Set up your computer. Run the emulator. Set up your phone. Build your first app.

Tutorials

Learn the basics of App Inventor by working through these tutorials.

Reference Documentation

Look up how specific components and blocks work. Read about concepts in App Inventor, like displaying lists and accessing images and sounds.

You can use the server that is set-up at MIT or download the App Inventor Server source code and run your own server.

You will need to go through the Tutorials to learn how to manipulate the App Inventor Blocks.

The Netflix OData Feed

clip_image001

For the sample application, we desire to create an Android application that will allow us to browse the Netflix catalog by Genre.

If we go to: http://odata.netflix.com/v2/Catalog/ we see that Netflix has an OData feed of their catalog. This feed provides the information that we will use for the application.

The Netflix Genre Browser

The completed Android program allows you to choose a Movie Genre, and then a movie in the selected Genre. After you choose a Movie, it will display the summary of the movie:

(1)
clip_image002

(2)
clip_image003

(3)
clip_image004

(4)
clip_image005

(5)
clip_image006

(6)
clip_image007

(7)
clip_image008

 

The Screen

clip_image009

In the Screen designer of App Inventor, we create a simple layout with two List Picker Buttons and two Labels. We also include two Web controls.

The Blocks

clip_image010

With App Inventor we create programs using Blocks.

clip_image011

First we create definition Blocks. These Blocks are variables that are used to hold values that will be used in the application. The Text (string) variables have a “textBlock plugged into their right-hand side. The List variables have a “make a listBlock plugged into them.

clip_image012

We can also create procedure which is a method that can take parameters and can return results.

We create the RemoveODataHeader procedure that will remove the first two items from a list passed to it. This procedure will be called from other parts of the application.

The List Of Genres

clip_image013

The first procedure to run is the Screen1.Initialize procedure.

clip_image014

After it runs, OData is returned to the application.

clip_image015

The next procedure to run is the webComponentGenres.GotText procedure. This procedure fills the Genre List Picker Button so that the list of Genre entries will show when the user clicks the Button.

The first part of the procedure breaks the OData result and parses it into a List called lstAllOData.

clip_image016

The second part of the procedure loops thru each list item in the list and dynamically strips out everything but the title, and builds a list that is then set as the item source of the Genre List Picker Button.

clip_image004[1]

When the user clicks the Button, the list appears.

Choosing A Genre

clip_image017

When a user selects a Genre from the list, the ListPickerGenres.AfterPicking procedure runs. The first thing it does is display some hidden Screen elements and reinitialize the Movie Title and Movie Description lists (the user may have a list already displayed and simply chosen another Genre).

clip_image018

The next part of the procedure displays the selected Genre in a Label, and constructs a URL, and queries Netflix for Movies in the selected Genre.

clip_image005[1]

The selected Genre is displayed and the list of movies in that Genre are retrieved from Netflix.

Choosing A Movie

clip_image019

After the ListPickerGenres.AfterPicking procedure runs, OData is returned to the application.

clip_image020

The next procedure to run is the webComponentTitles.GotText procedure.

This procedure fills the Movie List Picker Button so that the list of Movie entries will show when the user clicks the Button.

The first part of the procedure breaks the OData result and parses it into lstAllOData.

clip_image021

The next step to create a list of Movie titles is similar to what we did previously to build the list of Genres.

clip_image022

However, this time we build a second list of Movie Descriptions.

We will use this second list to display the Movie description when a Movie is selected.

clip_image007[1]

We set the Movie List Picker to the list of Movie Titles and the list of Movies displays when the Button is selected.

clip_image023

When a Movie is selected, we will take the index position selected to retrieve the proper Movie Description in the lstMovieDescription list.

clip_image008[1]

The Movie is then displayed.

Download

You can download the source code at this link.

Further Reading

odata.netflix.com

Netflix OData Query Maker

Netflix API - OData Catalog API (Preview)





Comments are closed.
Showing 3 Comments
Avatar  Michael Washington 6 years ago

I just tried it again and it works fine now. Perhaps something was going on with the MIT server.

Avatar  admin account 6 years ago

@AppInventorBeginner - It appears they made changes to the MIT server because I can no longer upload the source code :(

Avatar  AppInventorBeginner 6 years ago

Thanks for the tutorial. I receive the following error when I select any item in the Genre list <br /><br />Invalid List Item - Remove list item: Attempt to remove item from an empty list.<br /><br />Watch Info:<br /><br />ListPickerGenres.Selection = Action Comedies<br />tempSelectGenre/replace all = %20(%20'%20A%20c%20t%20i%20o%20n%20 %20C%20o%20m%20e%20d%20i%20e%20s%20'%20)%20<br />webComponentTitles.Url/make text = <a href="http://odata.netflix.com/v2/Catalog/Genres" rel="nofollow">odata.netflix.com/v2/Catalog/Genres</a> %20(%20'%20A%20c%20t%20i%20o%20n%20 %20C%20o%20m%20e%20d%20i%20e%20s%20'%20)%20/Titles?$orderby=Name<br /><br />It appears the "tempSelectGenre/replace all" procedure isn't appending the selected Genre correctly.