Table of Contents. Lesson Lesson Lesson Lesson Lesson Lesson Lesson

Transcription

1 P a g e 1

2 Table of Contents Lesson Lesson Lesson Lesson Lesson Lesson Lesson P a g e 2

3 P a g e 3

4 Hello World! Welcome to your first lesson! In this lesson, you ll get an introduction to a programming language named SmallBasic. Just like there are different spoken languages for different countries like English or Spanish, computer have different languages for different tasks as well. SmallBasic is more complex than a block programming language like Scratch, but not as complex as Java or C++. Downloading SmallBasic First, download Small Basic from smallbasic.com. Click the download button and run the installer. Follow the instructions to install Small Basic. Then, look on your Start Menu for Microsoft Small Basic. Running Small Basic should open a screen like this: P a g e 4

5 You can type your code into the window (marked Untitled) and press the Run button to run your code. Let's try writing our first program. Type the following into your editor and press the run button: TextWindow.WriteLine("Hello World!") You should get a window that has the following: Now let's make things more colorful: TextWindow.BackgroundColor="darkgreen" TextWindow.ForegroundColor="green" TextWindow.WriteLine("Hello World!") A program is a series of instructions. The computer first sets the background of text to be dark green, sets the foreground of text to be green, then prints Hello World! to your window. P a g e 5

6 Challenge 1 Try changing the code above so that the text is yellow, and the background is dark gray. Next, try changing the code above so that it uses your favorite colors. There are 16 colors available: Black, DarkBlue, DarkGreen, DarkCyan, DarkRed, DarkMagenta, DarkYellow, DarkGray, Gray, Blue, Green, Cyan, Red, Magenta, Yellow, and White. The colors aren't case sensitive, but you can't include extra spaces. Graphics Now let's try making some shapes and text: GraphicsWindow.DrawText(15,15,"Hello World!") 'The two numbers are just an example, you are free to choose where you would like your text to start on the X,Y axis You should get a graphics window that has the following: Now let's add some color, shape, and increase the font size. Note: Feel free to add the lines of code one by one to see what each of them does. GraphicsWindow.BackgroundColor="#AFEEEE" P a g e 6

7 Note: Try adding the code line by line GraphicsWindow.BrushColor="#8B0000" GraphicsWindow.PenColor="#FF8C00" GraphicsWindow.FontSize=30 'This is just a sample number GraphicsWindow.DrawRectangle(18,25,190,30) 'These four numbers represent: X,Y axis, width and height of the rectangle GraphicsWindow.DrawText(20,20,"Hello World!") 'The two numbers are just as example, you are free to choose where you would like your text to start on the X,Y axis You should get a graphics window that has the following: Hint: Use DrawEllipse The computer first sets the background to light blue, the brush color sets the color of the text, and the pen color sets the color of the rectangle lines. The rectangle is set by the measures given by you. Lastly, the text starts on the X, Y axis that you specified. Try, playing with these numbers to see the effects. Also wanted to mentioned that on the graphics window you are able to use more colors than on the text window. You can find the table of colors with the respective Hex value code in this article. Challenge 2 Try changing the code above so that the text is green, and the background is dark green, and the rectangle lines are blue. Next, try changing the code font and rectangle size. Last, try changing the shape to use an ellipse instead of a rectangle. Discussion Questions Now that you write your first lines of code, what was your favorite part? Additional Resources How can I set colors in Small basic? You can set colors in three ways: Using pre-defined color names (e.g. GraphicsWindow.BrushColor = "Blue") P a g e 7

8 Using a Hex value code (e.g. GraphicsWindows.BrushColor = "#FF0000") Setting the Red, Green, Blue components (RGB) (e.g. GraphicsWindows.BrushColor = GraphicsWindow.GetColorFromRGB(255,0,0)) Introduction to Small Basic Small Basic color documentation. Small Basic color base P a g e 8

9 P a g e 9

10 Variables This lesson is an introduction to variables. You will cover variable assignment, printing variables to TextWindow, and reading variables from TextWindow. Introduction In this lesson, we will build a Mad Libs program where you can play a game of Mad Libs:! he said as he jumped into his convertible exclamation adverb and drove off with his wife. noun adjective Note: This will be your finished product! Concept: Variables A variable has a name and a value. You can think of them as boxes which you put values into. To assign a value to a variable, you use the = sign. Area = 27.1 Name = "Ada" P a g e 10

11 The computer first assigns the value 27.1 to the variable called Area, then assigns the value "Ada" to the variable called Name. Notice how different variables can have different types of values, like numbers and words. You can assign more complex values to variables: Area = 6*21 Name = "Ada " + "Lovelace" Note: This window appears when you press run The value on the left is evaluated before it is assigned to the variable. In this case, Area ends up with the value 126 (which is 6*21) and Name ends up with the value Ada Lovelace. The + sign pastes the two words together (we call the words strings ). Challenge 1 Type and play around with some of the code above in Small Basic. You can print the value of a variable to the screen by using TextWindow.WriteLine(variable name) TextWindow.WriteLine(Area) What happens when you paste a string and a number together using +? Try it out! Reading input You can assign values based on what people type in by calling Line = TextWindow.Read() P a g e 11

12 This will read the next line that is typed in until the enter key is pressed. Here s an example that: Line 1: Asks you to type your name in Line 2: Reads what you have typed in, then assigns what you have typed in to the variable called Name Line 3: Prints out the value of Name: TextWindow.WriteLine("Enter your name") Challenge 2 Name = TextWindow.Read() TextWindow.WriteLine(Name) It s time for Mad Libs! You can find a Mad Libs online that you like, or you can use the template provided at the beginning. Remember that you can stick words together by using + (see the second short code sample). Hint: Don t forget spaces and +! Whoops, not enough spaces. Try getting your friends to play your Mad Libs, and try theirs out as well! Additional Resources A list of mad libs: P a g e 12

13 P a g e 13

14 More Variables Build on lesson 2 with more variables! You ll build a tool that measures how many of something it takes to reach a destination. A preview of what you ll build: Variable Assignment You can use the values that variables contain by typing the name of the variable. Cats = 5 BoxesNeeded = Cats*2 First, the value 5 is assigned to the variable Cats. For the second line, the right hand side is evaluated first: take the value of Cats (5) and multiply it by two. Then, assign this value to the variable BoxesNeeded. Now try reading this code sample: Length = 4 Note: the right hand side of the equation is evaluated first Width = 10 Area = Length*Width Here, Area ends up with the value 40: first, you take the values of Length and Width, you multiply them, then you assign them to Area. Now try this next code sample. What value do you think Height ends up with? Area = 5.3 Area = Area+0.1 If you said 5.4, you are right. You take the value of Height, which is 5.3, add 0.1 to it, then assign this value back to Height. P a g e 14

15 It might be confusing to see the equals sign, but keep in mind that it means assignment, not equality. So the last statement isn't saying that Height is equal to Height+0.1, but that Height's new value is assigned Height's old value Naming variables You can name your variables anything you want: Tacos = 2.54*Hamburgers But it makes things easier to read (especially for future you) if you name things well: Challenge Centimeters = 2.54*Inches We're now going to build a measurer. First, ask for the height of something using TextWindow.Read(): it could be your height, the height of an animal, or the length of a bus. Then choose a long distance: maybe the distance from your house to your school, from New York to London, or from Earth to the Moon. Next, output how many of that object it would take to reach the long distance. P a g e 15

16 A sample of what your program might look like after you run it can be found at the beginning of this lesson. You could also try other measurements: how many cups of water would it take to fill an Olympic sized pool (using volume), how many of you would it take to be as heavy as an elephant (using weight), or anything else you can come up with! If you want to a try a more complicated formula, you could build a converter such as a Fahrenheit to Kelvin converter. Additional Resources You might not want a long trailing decimal point. To round a number to the nearest whole number, type Math.Round(number). To round down, type Math.Floor(number). To round up, type Math.Ceiling(number). The floor is down and the ceiling is up! P a g e 16

17 P a g e 17

18 Take Control with Conditionals In this lesson you will learn how to create your very own calculator using conditional statements! What are Conditionals and How Do You Use Them? We make decisions every day. What should I wear today? What should I have for lunch? Should I watch the new episode of that TV show or do my homework? When we make these sorts of choices we take into account a lot of information. If it s sunny outside, I ll wear shorts. If my homework isn t due for a few days, I ll watch that new episode. You might be surprised to know that computers make decisions in a similar way. At this point we can give a computer a series of instructions and it will carry them out for us. But what if we don't want to perform the same instructions every time we run a program? For instance, say I want to display a special message on my birthday. The following program will do just that: Notice that Clock will tell you today s date If Clock.Date = "2/10/2017" Then TextWindow.WriteLine("Happy Birthday To You!!!") EndIf This program will only display the message if it s my birthday. But how does the program know how to do this? Conditions are statements that either evaluate to True or False. For example I have a twin sister is a condition. If I do indeed have a twin sister, then this condition is True, otherwise it is False. In the program above the condition is The current date is 2/8/2017 or in SmallBasic: Clock.Date = "2/10/2017" If the current date is 2/10/2017 Then we want the program to say Happy Birthday. We use the If/Then keywords to accomplish this. P a g e 18

19 The keyword If will take a condition and evaluate it to True or False. You use Then to specify the instructions you want executed if the condition is True. If the condition is False, then the program will skip to the next line and execute those instructions. EndIf tells the program to perform the following instruction regardless of whether the condition was True or False. Creating Complex Conditions with Logical Operators The above program will only print out my birthday if it s 2017, but if it isn t 2017 then that means I m never going to get my special birthday message! Let s fix that: If Clock.Month = 2 And Clock.Day = 10 Then TextWindow.WriteLine("Happy Birthday To You!!!") EndIf So what is the condition in this program? If the current month is February (2) AND the current day is the 10 or in SmallBasic: Clock.Month = 2 And Clock.Day = 10 And is what is known as a logical operator. Logical operators allows us to combine multiple conditions into a single condition (i.e. The current month is February, The current day is 10 ). For a condition created using And, both of the sub-conditions need to be True for the entire condition to be True. If it isn t February it isn t my birthday and likewise if it isn t the 10th it isn t my birthday. Compare this with the following program that will let me know if it s the weekend: If Clock.WeekDay="Saturday" Or Clock.WeekDay="Sunday" Then TextWindow.WriteLine("It's the weekend!") EndIf Notice that here the two sub-conditions are combined using a different logical operator: Or. If we use the Or keyword, then as long as at least one of the sub-conditions is True, then the entire condition is True. If it s Saturday, then it s the weekend and likewise if it s Sunday, it s the weekend. P a g e 19

20 Let s look at a more complicated example where you can specify an action if a condition is false: TextWindow.Write("Enter a number: ") input = TextWindow.ReadNumber() If input > 0 Then TextWindow.WriteLine("That's a positive number!") EndIf If input < 0 Then TextWindow.WriteLine("That's a negative number!") EndIf In this example we specify an action to take if the condition, input > 0, is satisfied and a different action to take if the opposite condition, input < 0,is satisfied. This code will work just fine, but there s a better way to write this program using a new keyword Else. TextWindow.Write("Enter a number: ") input = TextWindow.ReadNumber() If input > 0 Then TextWindow.WriteLine("That's a positive number!") Else TextWindow.WriteLine("That's a negative number!") Endif This keyword allows us to specify an action to take if the condition is False. So in this program is the user will input a number and the condition input is greater than zero will be evaluated. What do you think will happen if you input zero? But what if we want to be a bit more selective with our program? Here s one more example that s even more involved: TextWindow.Write("What is the temperature today in F? ") temperature = TextWindow.ReadNumber() If temperature < 0 Then TextWindow.WriteLine("Wow it's really cold today!") ElseIf temperature < 32 Then TextWindow.WriteLine ("It's freezing today!") ElseIf temperature < 50 Then TextWindow.WriteLine ("It's chilly today") ElseIf temperature < 80 Then TextWindow.WriteLine ("It's nice outside today") Else P a g e 20

21 TextWindow.WriteLine ("It's really hot today") EndIf What this program does is print out different messages for different ranges of temperatures. For a temperature between 32 and 50 degrees, it will print It s chilly today or for temperatures between 50 and 80 it will print It s nice outside today. We can accomplish this with the introduction of the keyword ElseIf. This will allow us to nest if statements together. For example, the first few lines could also be written as: If temperature < 0 Then TextWindow.WriteLine("Wow it's really cold today!") EndIf If temperature < 32 And temperature >= 0 Then TextWindow.WriteLine ("It's cold enough to freeze water today!") EndIf If temperature < 50 And temperature >= 32 Then TextWindow.WriteLine("It's chilly today") EndIf Notice that with this approach we end up with multiple If/EndIf blocks. With the first approach our code has less repetition and is much cleaner. Challenge: Build Your Own Calculator Using what we now know about conditional statements, let s make something useful: a calculator! The basic interface is as follows: Greet the user and ask them what operation they want to perform (addition/subtraction/multiplication/division) Ask them what the first operand is Ask them what the second operand is Give them the answer Important things to think about: How will you remember what the users entered? How do you want the user to choose their operation? What happens if the user doesn t enter a valid operation or how can you let them know that they didn t enter valid input? P a g e 21

22 How can you write your code to reduce repetition? Discussion Questions Can you think of some more examples of using conditional logic in real life? What are some limitations associated with conditional logic (can you think of something that would involve long or complicated conditionals)? Additional resources/faq: Small Basic Tutorial: P a g e 22

23 P a g e 23

24 Loop and Conquer Create your own adventure with variables, conditionals, and loops. What s a Loop? A loop is a way of repeating something, like a command or action, over and over. Let's imagine that you've been given the important task of eating 4 candy bars. You take one candy bar, unwrap it, and start eating it. When you're done with the first one, you grab another candy bar and do the same thing over again. Once you're out of candy bars, you've completed your task! In computer science, we call this kind of loop a While loop. While you have candy bars to eat, you eat them. When you don't have any to eat anymore, you're done with your task. We can write this exact process in Small Basic like this: candy_bars = 4 TextWindow.WriteLine("I have 4 candy bars!" ) While (candy_bars > 0) TextWindow.WriteLine("*unwraps candy bar*") TextWindow.WriteLine("*eats candy bar*") candy_bars = candy_bars - 1 TextWindow.WriteLine("I have " + candy_bars + " candy bars left!") EndWhile And this is what happens when you run the code from above: P a g e 24

25 Note: Don t forget the EndWhile keyword! The code above shows a variable called candy_bars being declared and given a value of 4. After, we write "I have 4 candy bars!". This is being stated outside of the loop, because everything that's inside the while loop is being run from top to bottom each time the loop runs. You can see this in action in the picture of the code after it runs. If we said "I have 4 candy bars!" Inside the while loop, the program would say it has 4 candy bars each time the loop ran. Once the while loop has been started, we give the loop a condition in parentheses. While this condition is true (in this case, while the amount of candy bars is not equal to 0), the loop will run. Each time the loop runs, we write out the steps of consuming the candy bars, and then we write how many candy bars we have left. We can calculate this by subtracting 1 from candy_bars each time we get to the end of the loop. This tracks how many candy bars we have left to eat. Once the loop reaches its end, we use the keyword EndWhile to signal that the while loop will end. That way the loop doesn't continue on forever, creating an infinite loop. Challenge: Choose Your Own Adventure Using your knowledge of variables, conditionals, and now loops, you'll be creating a multi-choice choose your own adventure story! Here are some tips and reminders to help you start off your program: You're going to need to keep your story in a loop. That way if the user answers a question in a way your program can't understand, the program doesn't just stop, it gives the user another chance to answer the question with one of the choices you give it and continue on in the story. With that in mind, you need to prompt the user to answer questions. But, you also need to save their answers. You can prompt a user to answer by using TextWindow.Write() to ask a question, and then collect the users answer with: TextWindow.Read() P a g e 25

26 You're also going to need to use conditionals to allow users to make multiple choices. Discussion Questions What can you use to save the input from the TextWindow.Read()? How are you going to keep track of the users choices? Where might you use a loop in real life? Knowing what you know now, what are some examples of how loops could simplify everyday tasks? P a g e 26

27 P a g e 27

28 Making Your Program Eventful In this lesson we ll introduce the GraphicsWindow and how to interact with it using events like keyboard strokes or mouse clicks. GraphicWindow First let s start by making the GraphicWindow appear: GraphicsWindow.Width=300 GraphicsWindow.Height=300 GraphicsWindow.Title = "Graphics Window" Run the code and you should see a white window pop up, with the title Graphics Window at the top. Feel free to change the width, height, or title to suite your liking. The Graphic Window can be used to do draw objects and allow you to create a program that reacts to mouse clicks or key presses. We ll cover the basics of drawing shapes and some basic events. Now let s add a shape to the GraphicsWindow: GraphicsWindow.Width=300 GraphicsWindow.Height=300 GraphicsWindow.Title = "Graphics Window" shape1 = Shapes.AddRectangle(100, 50) Shapes.Move(shape1, 100, 125) The Shapes.AddRectangle(100, 50) adds a rectangle of width 100 and height 50 to the screen. The function Shapes.Move(shape1, 100, 125) moves the rectangle to the (x,y) position (100,125). Feel free to move around the shape or try to change its dimensions. But what do we do if we want to add something happening if someone the Enter/Return key? The code looks like this: GraphicsWindow.Height = 300 GraphicsWindow.Width = 300 GraphicsWindow.Title = "Graphics Window" shape1 = Shapes.AddRectangle(100, 50) Shapes.Move(shape1, 100, 125) P a g e 28

29 return = "Return" GraphicsWindow.KeyDown = keydown GraphicsWindow.KeyUp = keyup Sub keydown If GraphicsWindow.LastKey = return then Shapes.Rotate(shape1, 90) EndIf EndSub Sub keyup If GraphicsWindow.LastKey = return then Shapes.Rotate(shape1, 0) EndIf EndSub The key aspect here is the idea of sub-routines. Sub-routines are a series of instructions that are executed only if a specific action is taken. In this case the subroutines are triggered if a key is pressed up or down. When this happens the series of instructions that rotate the rectangle are executed. Discussion Questions Can you think of how subroutines are used in real life? What are some limitations of this event-based programming style? Additional Resources SmallBasic Events Article: P a g e 29

30 P a g e 30

31 Loop and Conquer Let s make a list! There are lots of reasons you might want to make a list: a wish list, a bucket list, a list of chores, etc. In code, when you want to store a numbered (indexed) list of items, you use an Array. In lesson 4, you learned about variables. You can think of an Array as a series of numbered variables..what s an Array? Let s take a moment to think about how we would do this using individual variables (from lesson 4), storing each item individually: todo1 = "Learn to skateboard" todo2 = "Visit Tokyo" todo3 = "Stand on the Equator" todo4 = "Skydiving" todo5 = "Travel to Paris" An array is a special kind of variable which can hold more than one value at a time. Basically, what it means is that instead of having to create 5 variables (todo1, todo2, etc.), we can use todo (the Array) to store all five items. The way we store multiple values is by use of this thing called index. For example, todo[1], todo[2], todo[3], todo[4] and todo[5] can all store a value each. The numbers 1, 2, 3, 4 and 5 are called indices for the array. You can now store all the items in your list in a single Array named todo: todo[1] = "Learn to skateboard" todo[2] = "Visit Tokyo" todo[3] = "Stand on the Equator" todo[4] = "Go Skydiving" todo[5] = "Travel to Paris" Next let s combine this with loops that we learned about in lesson 9, so the number of items in your list depend on user input. Here is an example, that reads what you input to create your to do list: input = TextWindow.Read() index = 1 While(Text.GetLength(input) > 0) todo[index] = input P a g e 31

32 index = index + 1 EndWhile What if you want to know the 10th item in your to do list? todo10 = todo[10] Challenge Can you use a loop to print out your to do list to the TextWindow? Congratulations! You can use Arrays to store and read items! Discussion Questions Where might you use an Array in real life? When using an array, can you think of things that might go wrong? Hint: what different things can you use for index? Gotcha: When a software developer engineer refers to a list, they are referring to a different data type than an Array. What do you think is the difference between a list and an array? Additional Resources Small Basic Getting Started Guide Chapter 10: Arrays Small Basic Array Basics Small Basic Documentation: Array P a g e 32