Escolar Documentos
Profissional Documentos
Cultura Documentos
edu/ai2/stockquotes
(http://www.weibo.com/mitappinventor) (http://mp.weixin.qq.com
/s?__biz=MzAxODE1NTc1MQ==&mid=201968203&idx=1&
sn=01f8946b01a98b63e97e201a812dc844#rd)
StockQuotes
Just like you can access web pages from your phone -- for example, to look up a stock price -- so can App Inventor. This app enables the user
to enter a stock symbol, then looks up the price of the stock on Yahoo! Finance and displays the price on the phone.
This tutorial assumes that you are familiar with the basics of App Inventor -- using the Component Designer to build a user interface and using
the Blocks Editor to specify event handlers. If you are not familiar with the basics, try stepping through some of the basic tutorials
(http://appinventor.mit.edu/explore/ai2/tutorials.html) before continuing.
I ntroduction
1. Accepting text input from the user to specify the stock symbol.
2. Using the Web component to ask Google Finance for the latest price for the stock.
Getting Started
Connect to the App Inventor web site and start a new project. Name it StockQuotes, and also set the screens Title to Stock Quotes. Open the
Blocks Editor and connect it to the phone.
Use the component designer to create the user interface. When you are done, it should look something like the picture below. Additional
instructions are below the picture.
Create the following components by dragging them from the Palette into the Viewer.
TextBox User Interface StockSymbolTextBox Where the user enters the stock symbol
Component Action
Many web services provide an application programmer interface (API) for developers to enable their programs to access the service. Some ways
to discover APIs are through the website http://programmableweb.com (http://programmableweb.com) or just by doing a web search for the
service name and API.
For example, you can use the Yahoo! Finance API to get the latest price for the stock with the symbol "GOOG", for example, with the URL
http://finance.yahoo.com/d/quotes.csv?f=l1&s=GOOG (http://finance.yahoo.com/d/quotes.csv?f=l1&s=GOOG) . The section "f=l1"
(lower-case letter L, followed by the number 1) says we would like the latest price, and the section s=GOOG says we would like information
about the stock whose symbol is GOOG. The result is returned in comma-separated value (CSV) format, which you may be familiar with from
spreadsheets. Since only one value will be returned for our query, the result will be a plain old number, such as 511.5, without any commas.
(Commas would be used if we requested multiple pieces of data from Yahoo!, such as the name of the company and the daily trade volume.)
The blocks to make the web request are shown here and detailed below:
" " (http://finance.yahoo.com/d/quotes.csv?f=l1&s= (http://finance.yahoo.com Text Specify the first unchanging part of
/d/quotes.csv?f=l1&s=) ) the URL.
1 of 2 10/13/2016 8:17 AM
StockQuotes for App Inventor 2 | Explore MIT App Inventor http://explore.appinventor.mit.edu/ai2/stockquotes
2. Request the page specified by the URL. (This is like pressing return after entering a URL in your web browser.)
When the response to the web request arrives, the Web.GotText event is raised with four parameters (only some of which well use in this app):
1. url: the URL of the original request (which is useful if requests are made with many different URLs).
2. responseCode: the HTTP status code (http://en.wikipedia.org/wiki/List_of_HTTP_status_codes) , which indicates whether the web
request succeeded or how it failed; for example, 200 means that the request succeeded, 404 that the page could not be found, etc.
3. responseType: the MIME type (http://en.wikipedia.org/wiki/Mime_type) of the response, such as text/csv in this app, image/jpeg, etc.
Here are a picture and table of the blocks you need to create:
Web1.GotText Web1 Specify what to do when the reply comes back from the web.
if then Control Provide different behavior depending on whether the request succeeded. Use the mutator to add an
else statement.
get responseCode Variables Gets the response code returned for the web request, which...
number (200) Math ...200, the code for valid web responses.
" " ("Current value: ") Text ...the text Current value: and...
get responseContent Variables Gets the value returned from the web.
1. If the response code indicates that the web request succeeded (= 200), set the label to the concatenation of Current value: and the
returned data (e.g., 511.5).
Review
These ideas will be developed further in the second part of this tutorial, which is under development.
Scan the following barcode onto your phone to install and run the sample app.
If you'd like to work with this sample in App Inventor, download the source code to your computer, then open
App Inventor, click Projects, choose Import project (.aia) from my computer..., and select the source code you
just downloaded.
Credits
This tutorial is based on an app created by Pro f. David Wo lber ( http://app inventor.org) and relies on
the Yahoo! Finance API.
Done with StockQuotes? Return to the other tutorials here ( http ://explore.appinventor.mit.ed u/ai2/tutorials) .
Forums
Troubleshooting
(http://creativecommons.org/licenses/by-sa/3.0/)
This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License (http://creativecommons.org
/licenses/by-sa/3.0/)
Contact Us
2 of 2 10/13/2016 8:17 AM