got net?

Kevin Hazzard's Brain Spigot

About the author

Welcome to Kevin Hazzard's blog.
E-mail me Send mail

Recent posts

Recent comments

Authors

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2010

Flickr Photo Viewer in Small Basic

My sons, 10 and 15 years old, and I were sitting around this evening playing with Microsoft Small Basic. I've been trying to get my kids interested in writing software for years. But they didn't take to it. Small Basic made their eyes light up though. It has a Turtle graphics class like Logo had back in the 80s. You can make the turtle object move and turn to draw on the screen. It animates the whole thing. For capturing the imagination of children and getting them interested in writing algorithms, Logo was brilliant back in the 1980s and it's still brilliant today. Small Basic also has a Flickr class that you can use to download images by keywords. My sons and I wrote this little Small Basic program for taking keyword input from the user and then starting a Flickr slide show. They were so proud of themselves. Too much fun!

TextWindow.WriteLine("Welcome to My Flickr Picture Viewer")
TextWindow.ForegroundColor = "Cyan"
TextWindow.Write("What kind of pictures do you want to see? ")
TextWindow.ForegroundColor = "Yellow"
keywords = TextWindow.Read()
TextWindow.Hide()

GraphicsWindow.Title = "My Flickr Picture Viewer"
GraphicsWindow.Left = 0
GraphicsWindow.Top = 0
GraphicsWindow.Width = Desktop.Width - 20
GraphicsWindow.Height = Desktop.Height - 100
GraphicsWindow.FontSize = 18
GraphicsWindow.Show()
GraphicsWindow.MouseDown = OnMouseDown
GraphicsWindow.DrawText(10, 10, "You are about to see Flickr pictures with the keyword(s) '" + keywords + "'.")
GraphicsWindow.DrawText(10, 50, "Click in this window to begin. Click when you want to see a new picture.")

Sub OnMouseDown
  GraphicsWindow.Clear()
  GraphicsWindow.DrawText(10, 10, "Downloading...")
  img = Flickr.GetRandomPicture(keywords)
  GraphicsWindow.DrawResizedImage(img,0,0,GraphicsWindow.Width,GraphicsWindow.Height)
EndSub


Categories: Fun
Posted by kevin on Thursday, December 18, 2008 11:44 PM
Permalink | Comments (6) | Post RSSRSS comment feed

Comments

Al Tenhundfeld United States

Friday, December 19, 2008 11:19 AM

Al Tenhundfeld

What, you're not teaching them TDD?!?! Smile

That sounds like an awesome experience, Kevin.

I tried to get my little sister into software via HTML/web development. It worked well at first, nice and graphical and all that. But after she got the basics, she wanted to reproduce what she saw on the fancy professional sites. And back around 1999, when I was trying to teach her, there weren't as many great frameworks and toolkits available, not to my knowledge at least. So, she pretty much lost all interest after looking at her first few lines of JavaScript.

Small Basic sounds like a much smarter approach. Good luck!

A friend of mine has had moderate success enticing his nine-year-old into software development through Game Maker (http://en.wikipedia.org/wiki/Game_Maker). I haven't tried it, but it sounds pretty clever. It lets you create simple games through UI widgets and as you want to add more complex interaction or behavior, you have to learn bits of GML, a built-in interpreted scripting language.

Kevin Hazzard United States

Friday, December 19, 2008 1:54 PM

Kevin Hazzard

Hehe. No TDD for the 10 year old. I don't want to scare him away from programming. Smile But once they are ready to move up to do some real development, I will introduce them to those concepts though. I don't have delusions of my kids becoming great programmers. Certainly, if they want to do what I do for a living, that would be cool. I'd love to teach them and learn from them. But I'd at least like them to understand what I do for a living. Writing simple programs with Simple Basic and Game Maker is a fun way to get them there.

A while ago, my son e-mailed me a program he wrote this morning. (He's home from school recovering from a tonsilectomy/anedoidectomy operation on Monday.) With Simple Basic he wrote some code that draws a little spaceship that lands on a landing pad, gets refueled then takes off into space. It was really simple but way cool. And the excitement in his e-mail was palpable. I love watching people learn. That's one of the reasons I teach part time. But when you can see that excitement in your own kids, it's even more satisfying. Thanks for the Game Maker link Al. Awesome.

Derek Lazenby United Kingdom

Monday, March 30, 2009 8:28 AM

Derek Lazenby

Thanks for that, so simple yet so effective.

There is a slight problem though with the code above. It doesn't preserve the aspect ratio of the image. This leads to distorted images which no doubt entertain the kids, but at the end of the day they are distorted. So I took the liberty of changing the Sub to use an ImageList rather than a simple variable. The point being that you can then reference the dimensions of the original image for calculating a correct size change.

Pity they called it an ImageList (yes I know, the underlying implementation and all that) as it only seems to take a single image!

So for correct aspect ratios......

TextWindow.WriteLine("Welcome to My Flickr Picture Viewer")
TextWindow.ForegroundColor = "Cyan"
TextWindow.Write("What kind of pictures do you want to see? ")
TextWindow.ForegroundColor = "Yellow"
keywords = TextWindow.Read()
TextWindow.Hide()

GraphicsWindow.Title = "My Flickr Picture Viewer"
GraphicsWindow.Left = 0
GraphicsWindow.Top = 0
GraphicsWindow.Width = Desktop.Width - 20
GraphicsWindow.Height = Desktop.Height - 100
GraphicsWindow.FontSize = 18
GraphicsWindow.Show()
GraphicsWindow.MouseDown = OnMouseDown
GraphicsWindow.DrawText(10, 10, "You are about to see Flickr pictures with the keyword(s) '" + keywords + "'.")
GraphicsWindow.DrawText(10, 50, "Click in this window to begin. Click when you want to see a new picture.")

Sub OnMouseDown
  GraphicsWindow.Clear()
  GraphicsWindow.DrawText(10, 10, "Downloading...")
  Img = ImageList.LoadImage(Flickr.GetRandomPicture(keywords))
  IHeight = ImageList.GetHeightOfImage (Img)
  IWidth = ImageList.GetWidthOfImage (Img)
  ' do these here in case user resizes window
  GHeight = GraphicsWindow.Height
  GWidth = GraphicsWindow.Width
  HRatio = GHeight / IHeight
  WRatio = GWidth / IWidth
  If WRatio > HRatio Then
    GraphicsWindow.DrawResizedImage(Img,0,0,IWidth * HRatio,GHeight)
  ElseIf WRatio < HRatio then
    GraphicsWindow.DrawResizedImage(Img,0,0,GWidth ,IHeight* WRatio)
  Else
    GraphicsWindow.DrawResizedImage(Img,0,0,GWidth,GHeight)
  EndIf
EndSub

I may start adding SB stuff to my site, if I do (no promises) and I change this further, that is where I'll make the changes available.

Derek Lazenby United Kingdom

Thursday, April 02, 2009 2:24 PM

Derek Lazenby

OK, I relented. Here is another change. In my version, to centre the image, after

  Img = ImageList.LoadImage(Flickr.GetRandomPicture(keywords))

add

  GraphicsWindow.Clear()

and change the if statement to read

  If WRatio > HRatio Then
    IWidth = IWidth * HRatio
    GraphicsWindow.DrawResizedImage(Img,(GWidth - IWidth) / 2,0,IWidth,GHeight)
  ElseIf WRatio < HRatio Then
    IHeight = IHeight *WRatio
    GraphicsWindow.DrawResizedImage(Img,0,(GHeight - IHeight) / 2,GWidth ,IHeight)
  Else
    GraphicsWindow.DrawResizedImage(Img,0,0,GWidth,GHeight)
  EndIf

Kevin Hazzard United States

Sunday, April 05, 2009 9:55 AM

Kevin Hazzard

Thanks, Derek. The sample code I built with my kids was for fun. You've taken it to the next level. Small Basic is really fun. I hope Microsoft considers putting more resources behind simple, introductory programming languages like this.

Derek Lazenby United Kingdom

Thursday, June 04, 2009 2:02 PM

Derek Lazenby

Hey Kevin,

Haven't been doing SB recently, I got distracted by finally realising I could replace my personal edition of Delphi with Turbo Delphi. Wow, everything you used to have to pay for and then some!

Then I got distracted again (hah). Got a second hand pocket PC for a bargain 30 quid and duly discoverd Basic4PPC. Science fiction comes true, proper programming direct on the mobile device! Just wish the screen layout was consistent with the desktop IDE version. Sigh.

But what I was going to say when I started typing and got, guess what, distracted, is yes I know you were doing it for fun, that's why I said "took the liberty". But then, in a different way, I was doing it for fun too. Before I retired I was in the huge and complex end of software which is no fun at all. So it was great to get back to the sort of proggy you can do for fun, like it was in industry in the seriously old days (ie decades ago!).

Apart from that, part of me said, it's only a fun proggy but it is, despite that, really useful, so there are bound to be people out there who would be able to make use of my ideas too. So, I didn't want to keep them to myself.

One of these days I might re-invent Random Snakes & Ladders (70s and maybe earlier, don't know who had the original idea), definitely one for the younger users!

Comments are closed