This week we'll begin the process of creating a stock ticker. There are already many stock tickers and stock quote web sites out there, but hopefully this project will give you some other ideas for what you can do with REALbasic. This project will appear in two parts. This week (Part 1), we will build a project to retrieve a single quote. Next week, we'll integrate the stock information into a fancy display.
For this project, I am going to try something new for the RB section of ResExcellence. In the past, I listed all tutorial code as text. Starting today, I am going to begin using graphics to display the code. My original intent was that you could copy and paste the code as you worked through the tutorial. Since you can download the completed code anyway (which I suspect most of you do), screenshots of the code offer some advantages. First, the source code will more closely match the REALbasic you use (correct colors, spacing, etc...). Secondly, it saves me a lot time, which can only mean more time for tutorials and REALbasic news for you. Now, on to the tutorial!
Preparation
Before you get started coding, download Dan Vanderkam's HTTPSocket Class. We'll use it to handle the transfer of stock data from the internet. Once you have it downloaded and unstuffed, launch REALbasic and drag the file named "httpSocket (complete)" from the Finder into the Project Window, like so:
Don't worry that the name changes to "httpSocket" in the Project window; this is normal behavior.
Build the Interface
Open the Window Editor by double-clicking Window1 in the Project Window. Drag httpSocket from the Project Window into Window1. Next, add the controls listed below, making sure to change any Properties listed in the "Settings" column.
| Control | Settings |
| Chasing Arrows | Visible : Unchecked |
| EditField | Name : HTMLField MultiLine : Checked |
| EditField | Name : StockHTMLField MultiLine : Checked |
| EditField | Name : SymbolField LimitText : 4 |
| StaticText | Name : quoteDisplay Color : Red |
| PushButton | Name : PushButton1 |
You may rearrange the interface however you see fit, but it might look something like this:
Add the Code
The idea behind this tutorial is that we will download a web page using the httpSocket and then retrieve the information we want from the page. For our example, we will use Yahoo's stock lookup. For an example, check Apple's stock (AAPL). Look closely at the URL. The stock symbol is embedded in it. Once you have looked at the web page, save it as an HTML file and open it in a text editor. If you are HTML-literate, scroll down and find the table where the stock quote is located. This is the data we want to retrieve from the page.
The code this week will:
Before you add any code, create a new Property in Window1, like so:
Now, the code. To begin, open the Code Editor for Window1 and navigate to its Open event. Add the following code:
Next, navigate to the Action event of PushButton1 and enter this code:
Finally, open the DLFinished event of httpSocket1 and finish off the project with this code:
Conclusion
That's it! Test the project and when you're happy with the results, build the final application. To spruce things up, feel free to resize Window1 to conceal the EditFields. As usual, you can download the application and completed project.