Você está na página 1de 87

Microsoft Small Basic

Uma introduo programao

Captulo 1

Introduo
Small Basic e Programao
Programao de Computadores definida como o processo de criar
aplicativos de computador utilizando linguagens de programao. Assim
como ns falamos e entendemos ingls, espanhol ou francs, computadores
podem entender programas escritos em certas linguagens. Essas so
chamadas de linguagens de programao. No comeo existiam apenas
algumas linguagens de programao e elas eram muito fceis de aprender e
compreender. Mas como computadores e aplicativos se tornaram mais e
mais sofisticados, linguagens de programao evoluram rapidamente,
acumulando conceitos mais complexos com o passar do tempo. Como
resultado, a maioria das modernas linguagens de programao e seus
conceitos so bastante difceis de entender para um iniciante. Este fato
comeou a desencorajar as pessoas de aprenderem ou tentarem programar.
Small Basic uma linguagem de programao que desenhada para tornar
a programao extremamente fcil, acessvel e divertida para iniciantes. A
inteno do Small Basic derrubar a barreira e servir como trampolim para o
incrvel mundo da programao.

O Ambiente do Small Basic


Vamos comear com uma rpida introduo ao ambiente do Small Basic.
Quando SmallBasic.exe lanado pela primeira vez, voc ver uma janela
parecida com a da seguinte figura.

Figura 1 O ambiente do Small Basic

Este o ambiente do Small Basic, onde escreveremos e executaremos


nossos programas Small Basic. Este ambiente tem vrios elementos distintos
que esto identificados por nmeros.
O Editor, identificado pelo [1] aonde escreveremos nossos programas
Small Basic. Quando voc abre um programa exemplo ou um programa
salvo anteriormente, ele ser exibido neste editor. Voc pode ento
modific-lo e salv-lo para uso posterior.
Voc tambm pode abrir e trabalhar com mais de um programa ao mesmo
tempo. Cada programa com o qual voc est trabalhando ser exibido em
um editor separado. O editor que contm o programa que voc est
atualmente trabalhando chamado de editor ativo.
A Barra de ferramentas, identificada pelo [2] usada para gerar
comandos tanto para o editor ativo como para o ambiente. Ns
aprenderemos sobre os vrios comandos da barra de ferramentas conforme
avanamos.

A Superfcie, identificada pelo [3] o lugar aonde todas as janelas do editor


se encontram.

Nosso Primeiro Programa


Agora que voc est familiarizado com o ambiente do Small Basic, ns
iniciaremos a programar nele. Como indicado anteriormente, o editor o
lugar aonde escrevemos nossos programas. Portanto digite a seguinte linha
no editor.
TextWindow.WriteLine("Ol Mundo")

Este o nosso primeiro programa em Small Basic. E se voc digitou


corretamente, voc deveria ver algo similar seguinte figura.

Figura 2 Primeiro Programa

Agora que digitamos nosso novo programa, vamos execut-lo para ver o que
acontece. Ns podemos executar nosso programa clicando no boto
Executar na barra de ferramentas ou atravs do uso da tecla de atalho F5 no

teclado. Se tudo correr bem, nosso programa deveria executar com o


resultado como mostrado abaixo.

Figura 3 Resultado do Primeiro Programa

Parabns! Voc acabou de escrever


e executar seu primeiro programa
em Small Basic. Um programa bem
pequeno e simples, mas, no entanto,
um grande passo rumo a tornar-se
um verdadeiro programador! Agora,
tem apenas mais um detalhe antes
de criar programas maiores. Ns
temos que entender o que acabou
de acontecer o que exatamente
ns dissemos ao computador para
fazer e como o computador sabe o
que fazer? No prximo captulo,
analisaremos o programa que
acabamos de escrever, para
alcanar este entendimento.

Figura 4 - Intellisense

Salvando nosso programa


Se voc deseja fechar o Small Basic e voltar mais tarde para trabalhar no
programa que voc acabou de digitar, voc pode salvar o programa. De
fato, uma boa prtica salvar os programas de tempos em tempos, para que
voc no perca informaes caso o computador seja desligado
acidentalmente ou uma falha de energia. Voc pode salvar o programa atual
clicando no cone Salvar na barra de ferramentas ou atravs da tecla de
atalho Ctrl+S (pressione a tecla S enquanto pressionando a tecla Ctrl).

Captulo 2

Entendendo Nosso Primeiro Programa


O que realmente um programa de computador?
Um programa um conjunto de instrues para o computador. Essas
instrues dizem ao computador exatamente o que fazer, e o computador
sempre segue essas instrues. Assim como pessoas, computadores s
podem seguir instrues se especificadas numa linguagem que eles possam
entender. Elas so chamadas de linguagens de programao. Existem
muitas linguagens que o computador pode entender e Small Basic uma
delas.
Imagine uma conversa entre voc e seu amigo. Voc e seus amigos usariam
palavras, organizadas em frases para trocar informaes. Da mesma forma,
linguagens de programao contm colees de palavras que podem ser
organizadas em frases para transmitir informaes ao computador. E
programas so basicamente conjuntos de frases (algumas vezes poucas e
outras vezes milhares) que juntas fazem sentido tanto para o programador
como para o computador.

Programas Small Basic


Um programa tpico em Small Basic
consiste em um conjunto de
instrues. Cada linha do programa
representa uma instruo e cada
instruo um comando para o
computador. Quando pedimos ao
computador para executar um
programa em Small Basic, ele pega o
programa e l a primeira instruo.
Ele entende o que estamos tentando
dizer e ento executa nossa
instruo. Uma vez que ele termina
a execuo da primeira instruo,
ele retorna ao programa e l e
executa a segunda linha. Ele
continua fazendo isso at que ele
alcana o fim do programa. Nosso
programa ento termina.

Retomando o Nosso
Primeiro Programa
Aqui est o primeiro programa que
escrevemos:
TextWindow.WriteLine("Ol
Mundo")

Este um programa muito simples


que consiste de uma instruo. Essa
instruo diz ao computador para
escrever uma linha de texto, que
Ol Mundo, na janela de texto.
Essa instruo traduz literalmente
no computador como:
Escrever (Write) Ol Mundo

Voc pode j ter observado que a instruo pode ser dividida em segmentos
menores assim como frases podem ser divididas em palavras. A primeira
instruo contm 3 segmentos distintos:
a) TextWindow
b) WriteLine
c) Ol Mundo

O ponto, os parnteses e as aspas duplas so pontuaes que devem ser


colocadas nas posies corretas na instruo, para o computador entender
nossa inteno.

Voc pode ter notado a janela preta


que apareceu quando executamos
nosso primeiro programa. Esta
janela preta chamada de
TextWindow (janela Texto) ou
algumas vezes tambm chamada
de Console. ali que o resultado do
programa sai. TextWindow, no
nosso programa, chamado de
objeto. Existem diversos objetos
disponveis para usarmos em nossos
programas. Podemos realizar
diversas operaes nesses objetos.
Ns j utilizamos a operao
WriteLine (Escrever Linha) no nosso
programa. Voc tambm pode ter
notado que a operao WriteLine
seguida de Ol Mundo entre aspas.
Esse texto passado como entrada
para a operao WriteLine, que
ento imprime este texto para o
usurio. Isso chamado de entrada
para uma operao. Algumas
operaes aceitam um ou mais
parmetros enquanto algumas
operaes no aceitam nenhum.

Nosso Segundo Programa


Agora que voc entendeu nosso
primeiro programa, vamos seguir
adiante e adicionar algumas cores
ao programa.
TextWindow.ForegroundColor =
"Yellow"
TextWindow.WriteLine("Ol
Mundo")

Figura 5 Adicionando Cores

Quando voc executa o programa acima, voc ir notar que ele imprime a
mesma frase Ol Mundo dentro da janela Texto (TextWindow), mas desta
vez ele imprime o texto em amarelo (Yellow) ao invs de cinza como foi
anteriormente.

Figura 6 Ol Mundo em Amarelo

Note a nova instruo que adicionamos ao nosso programa original. Ela


utiliza uma nova palavra, ForegroundColor (cor de fundo) que ns igualamos
ao valor de Yellow (amarelo). Isso significa que ns atribumos Yellow a
ForegroundColor. Agora, a diferena entre ForegroundColor e a operao
WriteLine que ForegroundColor no aceita nenhum parmetro de entrada e
tambm no necessitou de parnteses. Ao invs disso, foi seguido de um
smbolo de igual a e uma palavra. Ns definimos ForegroundColor como
uma Propriedade de TextWindow. Aqui est uma lista de valores que so
vlidos para a propriedade ForegroundColor. Tente substituir Yellow com
um destes e veja os resultados no se esquea das aspas duplas, elas so
pontuao obrigatria.

Black
Blue
Cyan
Gray
Green
Magenta
Red
White
Yellow
DarkBlue
DarkCyan
DarkGray
DarkGreen
DarkMagenta
DarkRed
DarkYellow

Captulo 3

Introduzindo Variveis
Usando Variveis no nosso programa
No seria bacana se nosso programa pudesse dizer Ol com o nome dos
usurios ao invs de dizer o genrico Ol Mundo? Para fazer isso, ns
precisamos primeiro perguntar ao usurio o seu nome e ento armazen-lo
em algum lugar e ento imprimir Ol com o nome do usurio. Vejamos
como podemos fazer isso:
TextWindow.Write("Digite seu Nome: ")
nome = TextWindow.Read()
TextWindow.WriteLine("Ol " + nome)

Quando voc digita e executa seu programa, voc ver uma sada parecida
com a sada a seguir:

Figura 7 Pergunte o nome do usurio

E quando voc digita seu nome e pressiona a tecla ENTER, voc ver a
seguinte sada:

Figura 8 Um Ol Caloroso

Agora, se voc executar o programa novamente, a mesma pergunta ser


feita novamente. Voc pode digitar um nome diferente e o computador ir
dizer Ol com aquele nome.

Anlise do programa
No programa que voc acabou de executar, a linha que pode ter chamado
sua ateno esta:
nome = TextWindow.Read()

Read() se parece com WriteLine(), porm sem entradas. Read (ler) uma
operao e basicamente diz ao computador para esperar que o usurio
digite algo e pressione a tecla ENTER. Uma vez que o usurio pressiona a
tecla ENTER, ele pega o que o usurio digitou e o retorna para o programa.
O ponto interessante que tudo aquilo que o usurio digitou agora est
armazenado numa varivel chamada nome. Uma varivel definida como
um lugar onde voc pode armazenar valores temporariamente e us-los
mais tarde. Na linha acima, nome foi usado para armazenar o nome do
usurio.
A prxima linha tambm interessante:
TextWindow.WriteLine("Ol " + nome)

Este o lugar onde ns usamos o


valor armazenado na nossa varivel,
nome. Ns pegamos o valor em
nome e o anexamos ao fim de Ol
e escrevemos isso na TextWindow.
Uma vez que uma varivel
definida, voc pode reus-la
inmeras vezes. Por exemplo, voc
pode fazer o seguinte:
TextWindow.Write("Digite seu
Nome: ")
nome = TextWindow.Read()
TextWindow.Write("Ol " + nome
+ ". ")
TextWindow.WriteLine("Como
voc est " + nome + "?")

E voc ver a seguinte sada:

Figura 9 Reusando uma Varivel

Regras para nomear Variveis


Variveis tm nomes associados a elas e assim que voc as identifica.
Existem algumas regras simples e diretrizes muito boas para nomear essas
vriaveis. Elas so:
1. O nome deve comear com uma letra e no deve colidir com nenhuma outra
palavra-chave como por exemplo if, for, then, etc.
2. Um nome pode conter qualquer combinao de letras, dgitos e sublinhados
(_).
3. til nomear variveis de forma significativa j que variveis podem ser
to compridas quanto voc desejar, use nomes de variveis para descrever
sua inteno.

Brincando com Nmeros


Ns acabamos de ver como voc pode usar variveis para armazenar o
nome do usurio. Nos programas a seguir, ns veremos como podemos
armazenar e manipular nmeros em variveis. Vamos comear com um
programa bem simples:
numero1 = 10
numero2 = 20
numero3 = numero1 + numero2
TextWindow.WriteLine(numero3)

Quando voc executar este programa, voc obter a seguinte sada:

Figura 10 Somando Dois Nmeros

Na primeira linha do programa, voc


est atribuindo varivel numero1
o valor 10. E na segunda linha, voc
est atribuindo varivel numero2
o valor 20. Na terceira linha, voc
est somando numero1 e numero2
e ento atribuindo o resultado da
soma varivel numero3.
Portanto, neste caso, numero3 ter
o valor 30. E isso o que ns
imprimimos em TextWindow.
Agora, vamos modificar ligeiramente
esse programa e ver os resultados:
numero1 = 10
numero2 = 20
numero3 = numero1 * numero2
TextWindow.WriteLine(numero3)

O programa acima multiplicar


numero1 por numero2 e
armazenar o resultado em
numero3. E voc pode ver o
resultado deste programa abaixo:

Figura 11 Multiplicando Dois Nmeros

Da mesma forma, voc pode subtrair ou dividir nmeros. Aqui est a


subtrao:
numero3 = numero1 - numero2

E o smbolo para a diviso /. E o programa se parecer com isso:


numero3 = numero1 / numero2

E o resultado da diviso seria:

Figura 12 Dividindo Dois Nmeros

Um Simples Conversor de Temperatura


Para o prximo programa, ns usaremos a frmula

para

converter temperaturas em Fahrenheit para temperaturas em Clsius.


Primeiro, ns obteremos a temperatura em Fahrenheit do usurio e a
armazenaremos em uma varivel. Existe uma operao que nos deixa ler
nmeros digitados pelo usurio que TextWindow.ReadNumber.
TextWindow.Write("Digite a temperatura em Fahrenheit: ")
fahr = TextWindow.ReadNumber()

Uma vez que temos a temperatura em Fahrenheit armazenada em uma


varivel, ns podemos convert-la para Clsius assim:
celsius = 5 * (fahr - 32) / 9

Os parnteses dizem ao computador para calcular a primeira parte fahr 32


e ento processar o resto. Agora tudo que temos que fazer imprimir o
resultado para o usurio. Juntando tudo isto, ns temos este programa:
TextWindow.Write("Digite a temperatura em Fahrenheit: ")
fahr = TextWindow.ReadNumber()
celsius = 5 * (fahr - 32) / 9
TextWindow.WriteLine("Temperatura em Clsius " + celsius)

E o resultado do programa seria:

Figura 13 Converso de Temperatura

Captulo 4

Condies e Ramificao
Voltando ao nosso primeiro programa, no seria legal que ao invs de dizer o
genrico Ol Mundo, ns pudssemos dizer Bom Dia Mundo, ou Boa Tarde
Mundo dependendo da hora do dia? Para o nosso prximo programa, ns
faremos o computador dizer Bom Dia Mundo se o horrio for antes do meiodia; e Boa Tarde se o horrio for aps o meio-dia.
If (Clock.Hour < 12) Then
TextWindow.WriteLine("Bom Dia Mundo")
EndIf
If (Clock.Hour >= 12) Then
TextWindow.WriteLine("Boa Tarde Mundo")
EndIf

Dependendo de quando voc executa o programa, voc ver uma das


seguintes sadas:

Figura 14 Bom Dia Mundo

Figura 15 Boa Tarde Mundo

Vamos analisar as trs primeiras


linhas do programa. Essas linhas
dizem ao computador que se
Clock.Hour menor que 12, imprima
Bom Dia Mundo. As palavras If,
Then e EndIf so palavras especiais
que so entendidas pelo computador
quando o programa executa. A
palavra If (se) sempre seguida de
uma condio, que neste caso
(Clock.Hour < 12). Lembre que os
parnteses so necessrios para o
computador entender suas
intenes. A condio seguida da
palavra Then (ento) e a real
operao para executar. E depois da
operao vem a palavra EndIf (final
da condio if). Ela diz ao
computador que a execuo
condicional terminou.
Entre a palavra Then e a palavra
EndIf, poderiam existir mais de uma
operao e o computador ir
executar todas se a condio for
vlida. Por exemplo, voc poderia
escrever algo similar a isto:
If (Clock.Hour < 12) Then
TextWindow.Write("Bom Dia. ")
TextWindow.WriteLine("Como
estava o caf da manh?")
EndIf

Else
No programa do incio do captulo,
voc pode ter notado que a segunda
condio um pouco redundante. O

valor Clock.Hour poderia ser maior que 12 ou no. Ns no precisaramos


realmente fazer a segunda checagem. Nessas situaes, ns podemos
encurtar as duas instrues if..then..endif para ser apenas uma usando
uma nova palavra, Else (caso contrrio).
Se tivssemos que escrever o programa usando Else, ele seria parecido com
este:
If (Clock.Hour < 12) Then
TextWindow.WriteLine("Bom Dia Mundo")
Else
TextWindow.WriteLine("Boa Tarde Mundo")
EndIf

E esse programa far exatamente o mesmo que o outro, o que nos leva para
uma importante lio em programao de computadores:
Em programao, existem diversas maneiras de fazer a
mesma coisa. s vezes, um jeito faz mais sentindo que
o outro. A escolha fica a cargo do programador.
Conforme voc for escrevendo mais programas e ficando
mais experiente, voc comear a notar as diferentes
tcnicas e suas vantagens e desvantagens.

Recuo

Em todos os exemplos voc pode ver que as instrues entre If, Else e EndIf
esto recuadas. Este recuo no necessrio. O computador ir entender o
programa normalmente sem o recuo. Entretanto, o recuo nos ajuda a ver e
entender a estrutura do programa mais facilmente. Portanto, geralmente
considerado boa prtica recuar as instrues entre este tipo de bloco de
instrues.

Par ou mpar

Agora que ns temos a instruo If..Then..Else..EndIf na nossa mala de


truques, vamos escrever um programa que, dado um nmero, o programa
dir se o nmero par ou mpar.
TextWindow.Write("Digite um nmero: ")
num = TextWindow.ReadNumber()
resto = Math.Remainder(num, 2)

If (resto = 0) Then
TextWindow.WriteLine("O nmero Par ")
Else
TextWindow.WriteLine("O nmero mpar ")
EndIf

E quando voc executa esse programa, voc ver uma sada como esta:

Figura 16 Par ou mpar

Nesse programa, ns introduzimos outra poderosa operao,


Math.Remainder (resto da diviso). Math.Remainder, como voc pode
imaginar, ir dividir o primeiro nmero pelo segundo nmero e ento
retornar o resto da diviso.

Ramificao
Lembre-se, no segundo captulo voc aprendeu que o computador processa
um programa uma instruo por vez, em ordem do incio ao fim. Entretanto,
existe uma instruo especial que pode fazer o computador pular para outra
instruo fora de ordem. Vamos examinar o prximo programa.
i=1
inicio:
TextWindow.WriteLine(i)
i=i+1
If (i < 25) Then
Goto inicio
EndIf

Figura 17 - Usando Goto

No programa acima, ns atribumos o valor 1 varivel i. E ento ns


adicionamos uma nova instruo que termina em dois-pontos (:)
inicio:

Isto chamado de rtulo. Rtulos so como indicadores que o computador


entende. Voc poder dar o nome que voc quiser para o indicador e voc
pode adicionar quantos rtulos voc quiser no programa, desde que todos
eles tenham nomes nicos.
Outra instruo interessante esta aqui:
i=i+1

Isso apenas diz ao computador para adicionar 1 varivel i e atribuir o


resultado de volta a i. Portanto, se o valor de i era 1 antes dessa instruo,
ele ser 2 depois que essa instruo executada.
E finalmente,
If (i < 25) Then
Goto inicio
EndIf

Essa a parte que diz ao computador que se o valor de i for menor que 25, o
computador deve comear a processar as instrues a partir do indicador
inicio.

Execuo sem fim


Usando a instruo Goto, voc pode fazer o computador repetir algo
qualquer nmero de vezes. Por exemplo, voc pode pegar o programa Par
ou mpar e modific-lo como no exemplo abaixo, e o programa ir executar
sem parar. Voc pode parar o programa, clicando no boto Fechar (X) no
canto superior direito da janela.
inicio:
TextWindow.Write("Digite um nmero: ")
num = TextWindow.ReadNumber()
resto = Math.Remainder(num, 2)
If (resto = 0) Then
TextWindow.WriteLine("O nmero Par ")
Else
TextWindow.WriteLine("O nmero mpar ")
EndIf
Goto inicio

Figura 18 Par ou mpar executando sem parar

Captulo 5

Loops
Loop For
Vamos examinar o programa que escrevemos no captulo anterior.
i=1
inicio:
TextWindow.WriteLine(i)
i=i+1
If (i < 25) Then
Goto inicio
EndIf

Este programa imprime nmeros de 1 a 24 em ordem. Este processo de


incrementar uma varivel muito comum na programao que linguagens
de programao geralmente fornecem um mtodo mais fcil de fazer isto. O
programa acima equivalente ao programa abaixo:
For i = 1 To 24
TextWindow.WriteLine(i)
EndFor

E o resultado :

Figura 19 Usando o Loop For

Note que reduzimos o programa de 8 linhas para um programa de 4 linhas, e


ele ainda faz exatamente o mesmo que o programa de 8 linhas! Lembra que
antes dissemos que geralmente existem vrias maneiras de fazer a mesma
coisa? Este um timo exemplo.
For..EndFor , em termos de programao, chamado de loop. Ele permite
que voc pegue uma varivel, d um valor inicial e final e deixe que o
computador incremente a varivel para voc. Toda vez que o computador
incrementa a varivel, ele roda os comandos entre For e EndFor.
Mas se voc quisesse que a varivel fosse incrementada de 2 em 2 ao invs
de 1 em 1 por exemplo, se voc quiser imprimir todos os nmeros mpares
entre 1 e 24, voc pode usar o loop para fazer isso tambm.
For i = 1 To 24 Step 2
TextWindow.WriteLine(i)
EndFor

Figura 20 Somente Nmeros mpares

A parte Step 2 do comando For diz ao computador para incrementar o valor


de i em 2 ao invs do usual 1. Ao utilizar Step voc pode especificar
qualquer incremento que voc quiser. Voc pode at especificar um valor
negativo para o passo e fazer o computador contar de trs para frente, como
no exemplo abaixo:
For i = 10 To 1 Step -1
TextWindow.WriteLine(i)
EndFor

Figura 21 Contando de Trs pra Frente

Loop While
O loop While (enquanto) outro mtodo de looping, que especialmente
til quando o contador de loop no conhecido de antemo. Enquanto um
loop For executado um nmero pr-determinado de vezes, o loop While
executado at que uma dada condio seja verdadeira. No exemplo abaixo,
ns estamos dividindo um nmero ao meio enquanto o resultado maior
que 1.
numero = 100
While (numero > 1)
TextWindow.WriteLine(numero)
numero = numero / 2

EndWhile

Figura 22 Loop de Diviso ao Meio

No programa acima, ns atribumos o valor 100 a numero e executamos o


loop While enquanto o nmero for que 1. Dentro do loop, ns imprimimos o
nmero e ento o dividimos por dois, efetivamente dividindo-o ao meio. E
como esperado, a sada do programa nmeros que so progressivamente
divididos ao meio um aps o outro.
Seria muito difcil escrever este programa usando um loop For, porque ns
no sabemos quantas vezes o loop ir executar. Com um loop While fcil
checar a condio e pedir ao computador que ou continue o loop ou pare.
interessante observar que todo loop While pode ser desembrulhado num
comando If..Then. Por exemplo, o programa abaixo pode ser rescrito como
segue, sem afetar o resultado final.
numero = 100
inicio:
TextWindow.WriteLine(numero)
numero = numero / 2
If (numero > 1) Then
Goto inicio
EndIf

Captulo 6

Introduo a Grficos
At agora nos nossos exemplos, ns temos usado a TextWindow para
explicar os conceitos bsicos da linguagem Small Basic. Entretanto, Small
Basic vem com um conjunto poderoso de recursos grficos que ns
comearemos a explorar neste captulo.

Apresentando a GraphicsWindow
Assim como ns temos a TextWindow (janela Texto) que nos permite
trabalhar com texto e nmeros, Small Basic tambm fornece uma
GraphicsWindow (janela Grficos) que podemos usar para desenhar coisas.
Vamos comear mostrando a GraphicsWindow.
GraphicsWindow.Show()

Quando voc executar este programa, voc ir notar que ao invs da usual
janela de texto preta, voc obter uma janela branca como a mostrada
abaixo. Ainda no tem muita coisa para fazer nesta janela. Mas esta ser a
janela base na qual iremos trabalhar neste captulo. Voc pode fechar esta
janela clicando no boto X no canto superior direito.

Figura 23 Uma janela Grficos vazia

Configurando a janela Grficos


A janela Grficos permite que voc personalize sua aparncia como voc
desejar. Voc pode alterar o ttulo, a cor de fundo e seu tamanho. Vamos
seguir adiante e modific-la um pouco, apenas para se familiarizar com a
janela.
GraphicsWindow.BackgroundColor = "SteelBlue"
GraphicsWindow.Title = "Minha Janela Grficos"
GraphicsWindow.Width = 320
GraphicsWindow.Height = 200
GraphicsWindow.Show()

Aqui est como a janela Grficos personalizada se parece. Voc pode alterar
a cor de fundo por um dos diferentes valores listados no Apndice B. Brinque
com essas propriedades para ver como voc pode modificar a aparncia da
janela.

Figura 24 Uma janela Grficos Personalizada

Desenhando Linhas
Uma vez que temos a GraphicsWindow ativa, ns podemos desenhar figuras,
texto e at imagens nela. Vamos comear desenhando algumas figuras
simples. Aqui est um programa que desenha algumas linhas na janela
Grficos.
GraphicsWindow.Width = 200
GraphicsWindow.Height = 200
GraphicsWindow.DrawLine(10, 10, 100, 100)
GraphicsWindow.DrawLine(10, 100, 100, 10)

Figura 25 Linhas Cruzadas

As primeiras duas linhas do programa configuram a janela e as duas


prximas linhas desenham as linhas cruzadas. Os primeiros dois nmeros
que seguem DrawLine (desenhar linha) especificam as coordenadas iniciais x

e y e os outros dois nmeros


especificam as coordenadas finais x
e y. interessante observar que
com computadores as coordenadas
(0,0) iniciam no canto superior
esquerdo da janela. Na verdade, no
sistema de coordenadas a janela
considerada estando no 2
quadrante.

Figura 26 O mapa de coordenadas

Se voltarmos ao programa da linha,


interessante notar que o Small
Basic permite que voc modifique as
propriedades da linha, tais como a
cor e sua espessura. Primeiro,
vamos modificar as cores das linhas
como mostrado no programa abaixo.
GraphicsWindow.Width = 200
GraphicsWindow.Height = 200
GraphicsWindow.PenColor =
"Green"
GraphicsWindow.DrawLine(10, 10,
100, 100)
GraphicsWindow.PenColor =
"Gold"
GraphicsWindow.DrawLine(10,
100, 100, 10)

Figura 27 Alterando a Cor da Linha

Agora, vamos modificar o tamanho tambm. No programa abaixo, ns


alteramos a largura da linha para 10, ao invs do valor padro que 1.
GraphicsWindow.Width = 200
GraphicsWindow.Height = 200
GraphicsWindow.PenWidth = 10
GraphicsWindow.PenColor = "Green"
GraphicsWindow.DrawLine(10, 10, 100, 100)
GraphicsWindow.PenColor = "Gold"
GraphicsWindow.DrawLine(10, 100, 100, 10)

Figura 28 Linhas Grossas e Coloridas

PenWidth (largura da caneta) e PenColor (cor da caneta) modificam a caneta


com que essas linhas so desenhadas. Eles no apenas afetam linhas mas
qualquer figura que seja desenhada depois que essas propriedades foram
atualizadas.
Atravs do uso das instrues de loop que ns aprendemos nos captulos
anteriores, ns podemos facilmente escrever um programa que desenha
mltiplas linhas aumentando a grossura da caneta.
GraphicsWindow.BackgroundColor = "Black"

GraphicsWindow.Width = 200
GraphicsWindow.Height = 160
GraphicsWindow.PenColor = "Blue"
For i = 1 To 10
GraphicsWindow.PenWidth = i
GraphicsWindow.DrawLine(20, i * 15, 180, i * 15)
endfor

Figura 29 Mltiplas Larguras de Caneta

A parte interessante deste programa o loop, onde ns incrementamos


PenWidth toda vez que o loop executado e ento desenhamos uma nova
linha abaixo da anterior.

Desenhando e Preenchendo Figuras


Quando se trata de desenhar figuras, geralmente existem dois tipos de
operaes para cada figura. Elas so as operaes Draw para desenho e Fill
para preenchimento. Operaes Draw desenham o contorno da figura
usando uma caneta, e operaes Fill pintam a figura usando um pincel. Por
exemplo, no programa abaixo, existem dois retngulos, um que desenhado
usando uma caneta vermelha (Red) e outro que preenchido usando o
pincel verde (Green).
GraphicsWindow.Width = 400
GraphicsWindow.Height = 300
GraphicsWindow.PenColor = "Red"
GraphicsWindow.DrawRectangle(20, 20, 300, 60)
GraphicsWindow.BrushColor = "Green"
GraphicsWindow.FillRectangle(60, 100, 300, 60)

Figura 30 Desenhando e Preenchendo

Para desenhar ou preencher um retngulo, voc precisa de quatro nmeros.


Os dois primeiros nmeros representam as coordenadas X e Y para o canto
superior esquerdo do retngulo. O terceiro nmero especifica a largura do
retngulo enquanto o quarto especifica sua altura. Na verdade, o mesmo se
aplica para desenhar e preencher elipses, como mostrado no programa
abaixo.
GraphicsWindow.Width = 400
GraphicsWindow.Height = 300
GraphicsWindow.PenColor = "Red"
GraphicsWindow.DrawEllipse(20, 20, 300, 60)
GraphicsWindow.BrushColor = "Green"
GraphicsWindow.FillEllipse(60, 100, 300, 60)

Figura 31 Desenhando e Preenchendo Elipses

Crculos so apenas um tipo especial de elipses. Se voc deseja desenhar


crculos, voc teria que especificar a mesma largura e altura para a elipse.
GraphicsWindow.Width = 400
GraphicsWindow.Height = 300
GraphicsWindow.PenColor = "Red"
GraphicsWindow.DrawEllipse(20, 20, 100, 100)
GraphicsWindow.BrushColor = "Green"
GraphicsWindow.FillEllipse(100, 100, 100, 100)

Figura 32 Crculos

Captulo 7

Diverso com as Figuras


Ns iremos nos divertir neste captulo com tudo que aprendemos at agora.
Este captulo contm exemplos que mostram algumas maneiras
interessantes de combinar tudo que voc aprendeu at agora para criar
alguns programas visualmente bacanas.

Retangular
Aqui ns desenhamos mltiplos retngulos em um loop, enquanto
aumentamos seu tamanho.
GraphicsWindow.BackgroundColor = "Black"
GraphicsWindow.PenColor = "LightBlue"
GraphicsWindow.Width = 200
GraphicsWindow.Height = 200
For i = 1 To 100 Step 5
GraphicsWindow.DrawRectangle(100 - i, 100 - i, i * 2, i * 2)
EndFor

Figura 33 - Retangular

Circular
Uma variante do programa anterior que desenha crculos ao invs de
quadrados.
GraphicsWindow.BackgroundColor = "Black"
GraphicsWindow.PenColor = "LightGreen"
GraphicsWindow.Width = 200
GraphicsWindow.Height = 200
For i = 1 To 100 Step 5
GraphicsWindow.DrawEllipse(100 - i, 100 - i, i * 2, i * 2)
EndFor

Figura 34 Circular

Aleatrio
Este programa usa a operao GraphicsWindow.GetRandomColor (obter cor
aleatria) para atribuir cores aleatrias para o pincel e ento usa
Math.GetRandomNumber (obter nmero aleatrio) para atribuir as
coordenadas x e y aos crculos. Essas duas operaes podem ser

combinadas de maneiras interessantes para criar programas atraentes que


do diferentes resultados cada vez que eles so executados.
GraphicsWindow.BackgroundColor = "Black"
For i = 1 To 1000
GraphicsWindow.BrushColor = GraphicsWindow.GetRandomColor()
x = Math.GetRandomNumber(640)
y = Math.GetRandomNumber(480)
GraphicsWindow.FillEllipse(x, y, 10, 10)
EndFor

Figura 35 Aleatrio

Fractais
O programa a seguir desenha um simples tringulo fractal usando nmeros
aleatrios. Um fractal uma figura geomtrica que pode ser subdividida em
partes, cada uma delas se parece com a figura original exatamente. Neste
caso, o programa desenha centenas de tringulos, onde cada um se parece
com o tringulo original. E j que o programa executa por alguns segundos,
voc pode realmente ver os tringulos se formando lentamente a partir de
meros pontos. A lgica em si um pouco difcil de descrever e deixaremos
como um exerccio para voc explorar.

GraphicsWindow.BackgroundColor = "Black"
x = 100
y = 100
For i = 1 To 100000
r = Math.GetRandomNumber(3)
ux = 150
uy = 30
If (r = 1) then
ux = 30
uy = 1000
EndIf
If (r = 2) Then
ux = 1000
uy = 1000
EndIf
x = (x + ux) / 2
y = (y + uy) / 2
GraphicsWindow.SetPixel(x, y, "LightGreen")
EndFor

Figura 36 - Triangulo Fractal

Se voc quiser realmente ver os pontos lentamente formando o fractal, voc


pode introduzir um atraso no loop atravs do uso da operao

Program.Delay. Essa operao tem como parmetro um nmero que


especifica em milissegundos quanto tempo retardar. Aqui est o programa
modificado, com a linha alterada em negrito.
GraphicsWindow.BackgroundColor = "Black"
x = 100
y = 100
For i = 1 To 100000
r = Math.GetRandomNumber(3)
ux = 150
uy = 30
If (r = 1) then
ux = 30
uy = 1000
EndIf
If (r = 2) Then
ux = 1000
uy = 1000
EndIf
x = (x + ux) / 2
y = (y + uy) / 2
GraphicsWindow.SetPixel(x, y, "LightGreen")
Program.Delay(2)
EndFor

Aumentando o atraso far seu programa executar mais lentamente.


Experimente com os nmeros para ver qual voc gosta mais.
Outra modificao que voc pode fazer substituir a seguinte linha:
GraphicsWindow.SetPixel(x, y, "LightGreen")

por
color = GraphicsWindow.GetRandomColor()
GraphicsWindow.SetPixel(x, y, color)

Essa mudana far com que o programa desenhe os pixels do tringulo


usando cores aleatrias.

Captulo 8

Tartaruga Grfica
Logo
Nos anos 70, existia uma linguagem de programao bem simples mas
poderosa chamada Logo que foi usada por alguns pesquisadores. Isso foi at
que algum adicionou o que foi chamado de Tartaruga Grfica linguagem
e tornou disponvel uma tartaruga que era visvel na tela e respondia a
comandos tais como v para frente, vire direita, vire esquerda, etc.
Usando a tartaruga, as pessoas eram capazes de desenhar formas
interessantes na tela. Isso fez a linguagem imediatamente acessvel e
atraente para pessoas de todas as idades, e foi amplamente responsvel por
sua grande popularidade nos anos 80.
Small Basic vem com um objeto Turtle (tartaruga) com vrios comandos que
podem ser chamados a partir de programas Small Basic. Neste captulo, ns
usaremos a tartaruga para desenhar grficos na tela.

A Tartaruga
Para comear, ns precisamos fazer a tartaruga visvel na tela. Isso pode ser
alcanado atravs de uma simples linha de programa.
Turtle.Show()

Quando voc executa este programa, voc observar uma janela branca,
assim como a que vimos no captulo anterior, exceto que esta tem uma
tartaruga no centro. esta tartaruga que ir seguir nossas instrues e
desenhar o que pedirmos a ela.

Figura 37 A tartaruga est visvel

Movendo e Desenhando
Uma das instrues que a tartaruga entende Move (mover). Esta
operao recebe um nmero como entrada. Este nmero diz tartaruga o
quanto se mover. Digamos, no exemplo abaixo, ns pediremos tartaruga
para se mover 100 pixels.
Turtle.Move(100)

Quando voc executa este


programa, voc pode realmente ver
a tartaruga se mover lentamente
uns 100 pixels para cima. Conforme
ela se move, voc tambm
perceber que ela est desenhando
uma linha atrs dela. Quando a
tartaruga tiver parado de se mover,
o resultado se parecer com o da
figura abaixo.

Figura 38 Movendo cem pixels

Desenhando um Quadrado
Um quadrado tem quatro lados, dois verticais e dois horizontais. Para
desenhar um quadrado, ns precisamos ser capazes de fazer a tartaruga
desenhar uma linha, virar direita e desenhar outra linha e continuar isso
at que os quatro lados estejam terminados. Se traduzssemos isso em um
programa, assim como ele se pareceria.
Turtle.Move(100)
Turtle.TurnRight()
Turtle.Move(100)
Turtle.TurnRight()
Turtle.Move(100)
Turtle.TurnRight()
Turtle.Move(100)
Turtle.TurnRight()

Quando voc executa este programa, voc pode ver a tartaruga desenhando
um quadrado, uma linha por vez, e o resultado se parece com a figura
abaixo.

Figura 39 A tartaruga desenhando um quadrado

Ser interessante notar que ns estamos emitindo as mesmas duas


instrues uma vez aps a outra quatro vezes para sermos mais precisos.
E ns j aprendemos que tais comandos repetitivos podem ser executados
usando loops. Portanto, se pegarmos o programa anterior e o modificarmos
para usar o loop For..EndFor, ns terminaremos com um programa muito
mais simples.
For i = 1 To 4
Turtle.Move(100)
Turtle.TurnRight()
EndFor

Mudando as Cores
A tartaruga desenha na mesma GraphicsWindow (janela Grficos) que ns
vimos no captulo anterior. Isso significa que todas as operaes que ns
aprendemos no captulo anterior ainda so vlidas aqui. Por exemplo, o
programa a seguir desenhar o quadrado com cada lado com uma cor
diferente.
For i = 1 To 4
GraphicsWindow.PenColor = GraphicsWindow.GetRandomColor()

Turtle.Move(100)
Turtle.TurnRight()
EndFor

Figura 40 Mudando as Cores

Desenhando figuras mais complexas


A tartaruga, alm das operaes TurnRight (virar direita) e TurnLeft
(virar esquerda), possui uma operao Turn (virar). Esta operao recebe
uma entrada que especifica o ngulo de rotao. Usando esta operao,
possvel desenhar um polgono com qualquer quantidade de lados. O
programa a seguir desenha um hexgono (um polgono de seis lados).
For i = 1 To 6
Turtle.Move(100)
Turtle.Turn(60)
EndFor

Experimente este programa para ver se ele realmente desenha um


hexgono. Observe que como o ngulo entre os lados de 60 graus, ns
usamos Turn(60). Para tal polgono, cujos lados so todos iguais, o ngulo
entre os lados pode ser facilmente obtido dividindo 360 pelo nmero de
lados. Munidos com esta informao e usando variveis, ns podemos

escrever um programa bastante genrico para desenhar um polgono com


qualquer nmero de lados.
lados = 12
comprimento = 400 / lados
angulo = 360 / lados
For i = 1 To lados
Turtle.Move(comprimento)
Turtle.Turn(angulo)
EndFor

Usando este programa, ns podemos desenhar qualquer polgono apenas


modificando a varivel lados. Colocando 4 aqui nos daria o quadrado que
ns comeamos. Colocando um valor suficiente grande, digamos 50, faria o
resultado indistinguvel de um crculo.

Figura 41 Desenhando um polgono de 12 lados

Usando a tcnica que acabamos de aprender, ns podemos fazer a tartaruga


desenhar crculos cada vez com um pequeno movimento resultando em uma
sada interessante.
lados = 50

comprimento = 400 / lados


angulo = 360 / lados
Turtle.Speed = 9
For j = 1 To 20
For i = 1 To lados
Turtle.Move(comprimento)
Turtle.Turn(angulo)
EndFor
Turtle.Turn(18)
EndFor

O programa acima tem dois loops


For..EndFor, um dentro do outro. O
loop interno (i = 1 to lados) similar
ao programa do polgono e
responsvel por desenhar um
crculo. O loop externo (j = 1 to 20)
responsvel por virar a tartaruga
um pouco cada vez que um crculo
desenhado. Isso diz tartaruga para
desenhar 20 crculos. Quando
colocados juntos, este programa
resulta num padro muito
interessante, como o mostrado
abaixo.

Figura 42 Indo em crculos

Movendo
Voc pode fazer a tartaruga no desenhar usando a operao PenUp
(levantar a caneta). Isso permite que voc mova a tartaruga para qualquer
lugar na tela sem desenhar uma linha. Usando PenDown (abaixar a caneta)
far a tartaruga desenhar novamente. Isso pode ser usado para obter
alguns efeitos interessantes, como por exemplo, linhas pontilhadas. Aqui
est um programa que usa isso para desenhar um polgono com linhas
pontilhadas.
lados = 6
comprimento = 400 / lados
angulo = 360 / lados
For i = 1 To lados
For j = 1 To 6
Turtle.Move(comprimento / 12)
Turtle.PenUp()
Turtle.Move(comprimento / 12)
Turtle.PenDown()
EndFor
Turtle.Turn(angulo)
EndFor

Novamente, este programa tem dois loops. O loop interno desenha uma
linha pontilhada, enquanto o loop externo especifica quantas linhas
desenhar. No nosso exemplo, ns usamos 6 para a varivel lados e portanto
ns obtivemos um hexgono de linhas pontilhadas, como mostra a figura
abaixo.

Figura 43 - Usando PenUp e PenDown

Captulo 9

Sub-rotinas
Muito frequentemente, enquanto escrevemos programas, ns encontramos
casos onde teremos que executar os mesmos passos repetidamente. Nesses
casos, no faria muito sentido reescrever as mesmas instrues mltiplas
vezes. ento que sub-rotinas se tornam teis.
Uma sub-rotina uma poro de cdigo dentro de um programa maior que
geralmente faz algo bastante especfico, e pode ser chamada de qualquer
ponto no programa. Sub-rotinas so identificadas por um nome que segue a
palavra-chave Sub e so terminadas pela palavra-chave EndSub. Por
exemplo, o fragmento de cdigo a seguir representa uma sub-rotina cujo
nome ImprimirHora, e ela realiza a tarefa de imprimir a hora atual na
TextWindow.
Sub ImprimirHora
TextWindow.WriteLine(Clock.Time)
EndSub

A seguir est um programa que inclui a sub-rotina e a chama a partir de


vrios lugares.
ImprimirHora()
TextWindow.Write("Digite seu nome: ")
nome = TextWindow.Read()

TextWindow.Write(nome + ", a hora agora : ")


ImprimirHora()
Sub ImprimirHora
TextWindow.WriteLine(Clock.Time)
EndSub

Figura 44 Chamando uma simples sub-rotina

Voc executa uma sub-rotina chamando NomeSubrotina (). Como sempre,


os parnteses () so necessrios para dizer ao computador o que fazer
quando executar a sub-rotina.

Vantagens de usar subrotinas


Como acabamos de ver, sub-rotinas
ajudam a reduzir a quantidade de
cdigo que voc tem que digitar.
Uma vez que voc tem a sub-rotina
ImprimirHora escrita, voc pode
cham-la a partir de qualquer ponto
no seu programa e ela imprimir a
hora atual.
Alm disso, sub-rotinas ajudam a
decompor problemas complexos em
peas mais simples. Digamos que
voc tenha uma equao complexa
para resolver, voc pode escrever
diversas sub-rotinas que resolvem
peas menores da equao
complexa. Ento voc pode juntar
os resultados para obter a soluo
para a equao complexa original.
Sub-rotinas tambm podem auxiliar
a melhorar a legibilidade de um
programa. Em outras palavras, se
voc nomear bem as sub-rotinas
para pores que so executadas
frequentemente no seu programa,
seu programa se torna fcil de ler e
compreender. Isto muito
importante se voc quiser entender
o programa de outra pessoa ou se
voc quer que seu programa seja
entendido por outros. Algumas
vezes, til mesmo quando voc
quer ler seu prprio programa,
digamos uma semana depois que
voc o escreveu.

Usando variveis
Voc pode acessar e usar qualquer varivel que voc tem em um programa
de dentro de uma sub-rotina. Por exemplo, o programa a seguir aceita dois
nmeros e imprime o maior dos dois. Observe que a varivel maior usada
tanto dentro como fora da sub-rotina.
TextWindow.Write("Digite o primeiro nmero: ")
num1 = TextWindow.ReadNumber()
TextWindow.Write("Digite o segundo nmero: ")
num2 = TextWindow.ReadNumber()
DescobrirMaior()
TextWindow.WriteLine("O maior nmero : " + maior)
Sub DescobrirMaior
If (num1 > num2) Then
maior = num1
Else
maior = num2
EndIf
EndSub

E a sada do programa se parece com isso:

Figura 45 O maior de dois nmeros usando sub-rotina

Vamos examinar outro exemplo que ilustrar o uso de sub-rotinas. Desta vez
usaremos um programa grfico que calcula vrios pontos que ele
armazenar nas variveis x e y. Ento ele chama uma sub-rotina
DesenharCirculoUsandoCentro que responsvel por desenhar um
crculo usando x e y como o centro.
GraphicsWindow.BackgroundColor = "Black"
GraphicsWindow.PenColor = "LightBlue"
GraphicsWindow.Width = 480
For i = 0 To 6.4 Step 0.17
x = Math.Sin(i) * 100 + 200
y = Math.Cos(i) * 100 + 200

DesenharCirculoUsandoCentro()
EndFor
Sub DesenharCirculoUsandoCentro
inicioX = x - 40
inicioY = y - 40
GraphicsWindow.DrawEllipse(inicioX, inicioY, 120, 120)
EndSub

Figura 46 Exemplo Grfico para sub-rotinas

Chamando sub-rotinas dentro de Loops


Algumas vezes sub-rotinas so chamados de dentro de um loop, durante o
qual elas executam o mesmo conjunto de instrues mas com diferentes
valores em uma ou mais variveis. Por exemplo, digamos que voc tenha
uma sub-rotina chamada VerificarPrimo e esta sub-rotina determina se um
nmero primo ou no. Voc pode escrever um programa que deixa o
usurio digitar um valor e voc pode ento dizer se primo ou no, usando
esta sub-rotina. O programa abaixo ilustra isso.
TextWindow.Write("Digite um nmero: ")
i = TextWindow.ReadNumber()

primo = "True"
VerificarPrimo()
If (primo = "True") Then
TextWindow.WriteLine(i + " um nmero primo ")
Else
TextWindow.WriteLine(i + " no um nmero primo ")
EndIf
Sub VerificarPrimo
For j = 2 To Math.SquareRoot(i)
If (Math.Remainder(i, j) = 0) Then
primo = "False"
Goto FimLoop
EndIf
Endfor
FimLoop:
EndSub

A sub-rotina VerificarPrimo recebe o valor de i e tenta dividi-lo por nmeros


menores. Se um nmero divide i e tem resto zero, ento i no um nmero
primo. Neste ponto, a sub-rotina configura o valor de primo para False
(falso) e sai. Se o nmero era indivisvel por nmeros menores ento o valor
de primo permanece como True (verdadeiro).

Figura 47 Verificando se um nmero primo

Agora que temos uma sub-rotina que pode fazer a verificao de nmeros
primos para ns, voc pode querer usar isso para listar todos os nmeros
primos menores que, por exemplo, 100. muito fcil modificar o programa
anterior e chamar VerificarPrimo de dentro de um loop. Isso d sub-rotina
um valor diferente para calcular toda vez que o loop executa. Vejamos como
isso feito no exemplo a seguir.
For i = 3 To 100
primo = "True"
VerificarPrimo()
If (primo = "True") Then
TextWindow.WriteLine(i)
EndIf
EndFor

Sub VerificarPrimo
For j = 2 To Math.SquareRoot(i)
If (Math.Remainder(i, j) = 0) Then
primo = "False"
Goto FimLoop
EndIf
Endfor
FimLoop:
EndSub

No programa anterior, o valor de i atualizado toda vez que o loop


executado. Dentro do loop, uma chamada para a sub-rotina VerificarPrimo
feita. A sub-rotina VerificarPrimo ento recebe o valor de i e calcula se i ou
no um nmero primo. Este resultado armazenado na varivel primo onde
ento acessada pelo loop fora da sub-rotina. O valor de i ento impresso
se ele for um nmero primo. E j que o loop inicia em 3 e vai at 100, ns
obtemos a lista de todos os nmeros primos que esto entre 3 e 100. Abaixo
est o resultado do programa.

Figura 48 Nmeros Primos

Captulo 10

Matrizes
A esta altura, voc deve estar bem acostumado em como usar variveis
afinal voc chegou at este ponto e ainda est se divertindo, certo?
Vamos, por um momento, revisitar o primeiro programa que voc escreveu
com variveis:
TextWindow.Write("Digite seu Nome: ")
nome = TextWindow.Read()
TextWindow.WriteLine("Ol " + nome)

Neste programa, ns recebemos e armazenamos o nome do usurio numa


varivel chamada nome. Depois ns dissemos Ol ao usurio. Agora,
vamos dizer que existam mais de um usurio digamos que existam 5
usurios. Como iramos armazenar todos esses nomes? Uma maneira de
fazer isso :
TextWindow.Write("Usuario1,
nome1 = TextWindow.Read()
TextWindow.Write("Usuario2,
nome2 = TextWindow.Read()
TextWindow.Write("Usuario3,
nome3 = TextWindow.Read()
TextWindow.Write("Usuario4,
nome4 = TextWindow.Read()

digite nome: ")


digite nome: ")
digite nome: ")
digite nome: ")

TextWindow.Write("Usuario5, digite nome: ")


nome5 = TextWindow.Read()
TextWindow.Write("Ol ")
TextWindow.Write(nome1 + ", ")
TextWindow.Write(nome2 + ", ")
TextWindow.Write(nome3 + ", ")
TextWindow.Write(nome4 + ", ")
TextWindow.WriteLine(nome5)

Quando voc executar este cdigo, voc obter um resultado similar a este:

Figura 49 Sem usar matrizes

Claramente deve existir um forma mais fcil de escrever um programa to


simples, certo? Especialmente j que o computador muito bom ao fazer
tarefas repetitivas, porque deveramos se dar ao trabalho de escrever o
mesmo cdigo vez aps outra para cada novo usurio? O truque aqui
armazenar e recuperar mais de um nome de usurio usando a mesma
varivel. Se pudermos fazer isso, ento podemos usar o loop For que
aprendemos em captulos anteriores. Aqui aonde matrizes vm nos ajudar.

O que uma matriz?


Uma matriz um tipo especial de varivel que pode armazenar mais de um
valor ao mesmo tempo. Basicamente, isso significa que ao invs de ter que
criar nome1, nome2, nome3, nome4 e nome5 para armazenar cinco
nomes de usurio, ns podemos apenas usar nome para armazenar os cinco
nomes de usurio. A maneira como armazenamos valores mltiplos
atravs do uso de uma coisa chama ndice. Por exemplo, nome[1],
nome[2], nome[3], nome[4] e nome[5] podem armazenar um valor cada
um. Os nmeros 1, 2, 3, 4 e 5 so chamados ndices para a matriz.
Apesar de nome[1], nome[2], nome[3], nome[4] e nome[5] parecerem
que so variveis diferentes, eles so na realidade apenas uma varivel. E

qual a vantagem disso, voc pode perguntar. A melhor parte de armazenar


valores em uma matriz que voc pode especificar o ndice usando outra
varivel que nos permite acessar matrizes dentro de loops.
Agora, vamos ver como podemos colocar nosso novo conhecimento em
prtica rescrevendo nosso programa anterior com matrizes.
For i = 1 To 5
TextWindow.Write("Usuario" + i + ", digite nome: ")
nome[i] = TextWindow.Read()
EndFor
TextWindow.Write("Ol ")
For i = 1 To 5
TextWindow.Write(nome[i] + ", ")
EndFor
TextWindow.WriteLine("")

Muito mais fcil de ler, no? Observe as duas linhas em negrito. A primeira
armazena um valor na matriz e a segunda l um valor da matriz. O valor
que voc armazena em nome[1] no sera afetado pelo que voc armazenar
em nome[2]. Portanto, para a maioria dos casos, voc pode tratar nome[1]
e nome[2] como duas variveis diferentes com a mesma identidade.

Figura 50 Usando matrizes

O programa acima d quase exatamente o mesmo resultado que o programa


sem matrizes, exceto pela virgule aps Louva-a-Deus. Ns podemos
consertar isso rescrevendo o loop de impresso assim:
TextWindow.Write("Ol ")
For i = 1 To 5
TextWindow.Write(nome[i])
If i < 5 Then
TextWindow.Write(", ")
EndIf

EndFor
TextWindow.WriteLine("")

Indexando uma matriz


No nosso programa anterior, voc viu que usamos nmeros como ndices
para armazenar e recuperar valores da matriz. Acontece que ndices no so
restritos apenas a nmeros e na verdade muito til usar ndices textuais
tambm. Por exemplo, no programa a seguir, ns solicitamos e
armazenamos vrias informaes a respeito de um usurio e ento
imprimimos a informao que o usurio desejar.
TextWindow.Write("Digite nome: ")
usuario["nome"] = TextWindow.Read()
TextWindow.Write("Digite idade: ")
usuario["idade"] = TextWindow.Read()
TextWindow.Write("Digite cidade: ")
usuario["cidade"] = TextWindow.Read()
TextWindow.Write("Digite CEP: ")
usuario["CEP"] = TextWindow.Read()
TextWindow.Write("Que informao voc deseja? ")
indice = TextWindow.Read()
TextWindow.WriteLine(indice + " = " + usuario[indice])

Figura 51 Usando ndices no numricos

Mais de uma dimenso


Digamos que voc queira armazenar o nome e o telefone de todos seus
amigos e ento ser capaz de buscar seus telefones quando voc precisar
uma espcie de agenda telefnica. Como voc escreveria tal programa?
Neste caso, existem dois conjuntos de ndices (tambm conhecidos como
dimenso da matriz) envolvidos. Vamos assumir que ns identificamos cada

amigo pelo seu apelido. Isso se


torna nosso primeiro ndice na
matriz. Uma vez que usamos o
primeiro ndice para obtermos a
varivel do nosso amigo, o segundo
dos ndices, nome e telefone nos
ajudariam a obter o nome e telefone
daquele amigo.
A maneira como armazenamos estes
dados seria assim:
amigos["JC"]["Nome"] = "Joo
Carlos"
amigos["JC"]["Telefone"] = "32211234"
amigos["Van"]["Nome"] =
"Vanessa"
amigos["Van"]["Telefone"] =
"3227-4567"
amigos["Carol"]["Nome"] =
"Caroline"
amigos["Carol"]["Telefone"] =
"3224-2345"

J que temos dois ndices na mesma


matriz amigos, esta matriz
chamada de matriz de duas
dimenses.
Uma vez que temos este programa
configurado, ns podemos receber
como entrada o apelido de um
amigo e imprimir a informao que
temos armazenada sobre eles. Aqui
est o programa completo que faz
isso:
amigos["JC"]["Nome"] = "Joo
Carlos"

amigos["JC"]["Telefone"] = "3221-1234"
amigos["Van"]["Nome"] = "Vanessa"
amigos["Van"]["Telefone"] = "3227-4567"
amigos["Carol"]["Nome"] = "Caroline"
amigos["Carol"]["Telefone"] = "3224-2345"
TextWindow.Write("Digite o apelido: ")
apelido = TextWindow.Read()
TextWindow.WriteLine("Nome: " + amigos[apelido]["Nome"])
TextWindow.WriteLine("Telefone: " + amigos[apelido]["Telefone"])

Figura 52 Uma agenda telefnica simples

Usando Matrizes para representar grades


Um uso muito comum de matrizes multidimensionais representar
grades/tabelas. Grades tem linhas e colunas, que podem se ajustar muito
bem em uma matriz de duas dimenses. Um programa simples que dispe
caixas numa grade dado a seguir:
linhas = 8
colunas = 8
tamanho = 40
For l = 1 To linhas
For c = 1 To colunas
GraphicsWindow.BrushColor = GraphicsWindow.GetRandomColor()
caixas[l][c] = Shapes.AddRectangle(tamanho, tamanho)
Shapes.Move(caixas[l][c], c * tamanho, l * tamanho)
EndFor
EndFor

Este programa adiciona retngulos e os posiciona para formarem uma grade


8x8. Alm de posicionar essas caixas, o programa tambm armazena essas

caixas numa matriz. Isso nos permite controlar essas caixas facilmente e
us-las novamente quando necessrio.

Figura 53 Posicionando caixas numa grade

Por exemplo, adicionando o cdigo a seguir no final do programa anterior


faria essas caixas se moverem para o canto superior esquerdo.
For l = 1 To linhas
For c = 1 To colunas
Shapes.Animate(caixas[l][c], 0, 0, 1000)
Program.Delay(300)
EndFor
EndFor

Figura 54 Controlando as caixas na grade

Captulo 11

Eventos e Interatividade
Nos primeiros dois captulos, ns introduzimos objetos que tem Propriedades
e Operaes. Alm de propriedades e operaes, alguns objetos tm o que
chamamos de Eventos. Eventos so como sinais que so are gerados, por
exemplo, em resposta a aes do usurio, tais como mover o mouse ou
clicar em um boto do mouse. De certa forma, eventos so o oposto de
operaes. No caso da operao, voc como um programador chama a
operao para fazer o computador fazer algo; onde no caso de eventos, o
computador lhe informa quando algo interessante aconteceu.

Como os eventos so teis?


Eventos so centrais para introduzir interatividade em um programa. Se
voc quer permitir que um usurio interaja com seu programa, eventos so o
que voc vai usar. Digamos que voc esteja escrevendo um jogo da velha.
Voc quer permitir que o usurio escolha a sua jogada, certo? A onde
eventos entram voc recebe a entrada do usurio de dentro do seu
programa usando eventos. Se isso parece difcil de entender, no se
preocupe, ns examinaremos um exemplo bem simples que ajudar voc a
entender o que so eventos e como eles podem ser usados.
A seguir est um programa bem simples que tem apenas uma instruo e
uma sub-rotina. A sub-rotina usa a operao ShowMessage (mostrar
mensagem) no objeto GraphicsWindow (janela Grficos) para exibir um caixa
de mensagem para o usurio.

GraphicsWindow.MouseDown = OnMouseDown
Sub OnMouseDown
GraphicsWindow.ShowMessage("Voc clicou.", "Ol")
EndSub

A parte interessante de observar no programa acima que a linha onde ns


atribumos o nome da sub-rotina ao evento MouseDown do objeto
GraphicsWindow. Voc observar que o evento MouseDown se parece muito
com uma propriedade exceto que ao invs de atribuirmos um valor, ns
estamos atribuindo a sub-rotina OnMouseDown a ele. Isto que especial a
respeito de eventos quando o evento acontece, a sub-rotina
automaticamente chamada. Neste caso, a sub-rotina OnMouseDown
chamada toda vez que o usurio clica o mouse, na GraphicsWindow. Vamos
l, execute o programa e experimente. Cada vez que clicar na
GraphicsWindow com seu mouse, voc ver uma caixa de mensagem como
a mostrada na figura abaixo.

Figura 55 Resposta a um evento

Este tipo de manipulao de eventos muito poderoso e permite a criao


de programas bem criativos e interessantes. Programas escritos desta forma
so geralmente chamados de programas orientados a eventos.
Voc pode modificar a sub-rotina OnMouseDown para fazer outras coisas
alm de exibir uma caixa de mensagem. Por exemplo, como no programa a
seguir, voc pode desenhar grandes crculos azuis onde o usurio clicar com
o mouse.
GraphicsWindow.BrushColor = "Blue"
GraphicsWindow.MouseDown = OnMouseDown
Sub OnMouseDown
x = GraphicsWindow.MouseX - 10
y = GraphicsWindow.MouseY - 10
GraphicsWindow.FillEllipse(x, y, 20, 20)
EndSub

Figura 556 Manipulando o evento Mouse Down

Observe que no programa acima ns usamos MouseX e MouseY para obter


as coordenadas do mouse. Ns ento usamos isto para desenhar um crculo
usando as coordenadas do mouse como o centro do crculo.

Manipulando mltiplos eventos


No existem limites para quantos eventos voc deseja manipular. Voc pode
at mesmo ter uma sub-rotina que manipula mltiplos eventos. Entretanto,
voc pode manipular um evento apenas uma vez. Se voc tentar atribuir
duas sub-rotinas ao mesmo evento, a segunda vence.
Para ilustrar isso, vamos pegar o exemplo anterior e adicionar uma subrotina que manipula pressionamento de teclas. Alm disso, vamos fazer esta
nova sub-rotina alterar a cor do pincel, para que quando voc clicar com o
mouse, voc obter um crculo de uma cor diferente.
GraphicsWindow.BrushColor = "Blue"
GraphicsWindow.MouseDown = OnMouseDown
GraphicsWindow.KeyDown = OnKeyDown
Sub OnKeyDown
GraphicsWindow.BrushColor = GraphicsWindow.GetRandomColor()
EndSub

Sub OnMouseDown
x = GraphicsWindow.MouseX - 10
y = GraphicsWindow.MouseY - 10
GraphicsWindow.FillEllipse(x, y, 20, 20)
EndSub

Figura 567 Manipulando mltiplos eventos

Se voc executar este programa e clicar na janela, voc obter um crculo


azul. Agora, se voc pressionar qualquer tecla uma vez e clicar novamente,
voc obter um crculo com uma cor diferente. O que est acontecendo
quando voc pressiona uma tecla que a sub-rotina OnKeyDown
executada, mudando a cor do pincel para uma cor randmica. Depois disso
quando voc clica com o mouse, um crculo desenhado usando a nova cor
que foi configurada dando os crculos de cores randmicas.

Um programa de desenho
Munido com eventos e sub-rotinas, ns agora podemos escrever um
programa que deixa usurios desenhar na janela. surpreendentemente
fcil escrever tal programa, dado que ns podemos quebrar o problema em
pequenas partes. Como primeiro passo, vamos escrever um programa que
permite que usurios movam o mouse aonde eles quiserem na janela
Grficos, deixando um rastro por onde eles passam.

GraphicsWindow.MouseMove = OnMouseMove
Sub OnMouseMove
x = GraphicsWindow.MouseX
y = GraphicsWindow.MouseY
GraphicsWindow.DrawLine(prevX, prevY, x, y)
prevX = x
prevY = y
EndSub

Entretanto, quando voc executa este programa, a primeira linha sempre


comea a partir do canto superior esquerdo da janela (0, 0). Ns podemos
consertar este problema manipulando o evento MouseDown e capturando os
valores prevX e prevY quando o evento ocorre.
Alm disso, ns apenas precisamos do rastro quando o usurio est
pressionando o boto do mouse. Nas outras vezes, ns no deveramos
desenhar a linha. Para obter este comportamento, ns usaremos a
propriedade IsLeftButtonDown do objeto Mouse. Esta propriedade diz se o
boto esquerdo do mouse est sendo pressionado ou no. Se o valor for
verdadeiro, desenharemos a linha, seno pularemos.
GraphicsWindow.MouseMove = OnMouseMove
GraphicsWindow.MouseDown = OnMouseDown
Sub OnMouseDown
prevX = GraphicsWindow.MouseX
prevY = GraphicsWindow.MouseY
EndSub
Sub OnMouseMove
x = GraphicsWindow.MouseX
y = GraphicsWindow.MouseY
If (Mouse.IsLeftButtonDown) Then
GraphicsWindow.DrawLine(prevX, prevY, x, y)
EndIf
prevX = x
prevY = y
EndSub

Apndice A

Exemplos Divertidos
Fractal com a Tartaruga

Figura 578 Tartaruga desenhando um fractal em forma de rvore

angulo = 30
delta = 10
distancia = 60

Turtle.Speed = 9
GraphicsWindow.BackgroundColor = "Black"
GraphicsWindow.PenColor = "LightGreen"
DrawTree()
Sub DrawTree
If (distancia > 0) Then
Turtle.Move(distancia)
Turtle.Turn(angulo)
Stack.PushValue("distancia", distancia)
distancia = distancia - delta
DrawTree()
Turtle.Turn(-angulo * 2)
DrawTree()
Turtle.Turn(angulo)
distancia = Stack.PopValue("distancia")
Turtle.Move(-distancia)
EndIf
EndSub

Fotos do Flickr

Figura 589 - Recuperando fotografias do Flickr

GraphicsWindow.BackgroundColor = "Black"

GraphicsWindow.MouseDown = OnMouseDown
Sub OnMouseDown
foto = Flickr.GetRandomPicture("montanhas, rio")
GraphicsWindow.DrawResizedImage(foto, 0, 0, 640, 480)
EndSub

Papel de Parede da rea de Trabalho Dinmico


For i = 1 To 10
foto = Flickr.GetRandomPicture("montanhas")
Desktop.SetWallPaper(foto)
Program.Delay(10000)
EndFor

O Jogo de Paddle

Figura 59 O Jogo de Paddle

GraphicsWindow.BackgroundColor = "DarkBlue"
paddle = Shapes.AddRectangle(120, 12)
bola = Shapes.AddEllipse(16, 16)
GraphicsWindow.MouseMove = OnMouseMove
x=0

y=0
deltaX = 1
deltaY = 1
LoopExecucao:
x = x + deltaX
y = y + deltaY
gw = GraphicsWindow.Width
gh = GraphicsWindow.Height
If (x >= gw - 16 or x <= 0) Then
deltaX = -deltaX
EndIf
If (y <= 0) Then
deltaY = -deltaY
EndIf
padX = Shapes.GetLeft(paddle)
If (y = gh - 28 and x >= padX and x <= padX + 120) Then
deltaY = -deltaY
EndIf
Shapes.Move(bola, x, y)
Program.Delay(5)
If (y < gh) Then
Goto LoopExecucao
EndIf
GraphicsWindow.ShowMessage("Voc Perdeu ", "Paddle")
Sub OnMouseMove
paddleX = GraphicsWindow.MouseX
Shapes.Move(paddle, paddleX - 60, GraphicsWindow.Height - 12)
EndSub

Apndice B

Cores
Aqui est uma lista de nomes de cores suportadas pelo Small Basic,
classificadas pela sua matiz.

Vermelhos
IndianRed
LightCoral
Salmon
DarkSalmon
LightSalmon
Crimson
Red
FireBrick
DarkRed

HotPink
#CD5C5
C
#F08080
#FA8072
#E9967
A
#FFA07A
#DC143
C
#FF0000
#B2222
2
#8B000
0

Rosas
Pink
LightPink

#FFC0C
B
#FFB6C1

#FF69B4

DeepPink
#FF1493
MediumVioletRe #C7158
d
5
#DB709
PaleVioletRed
3

Laranjas
LightSalmon

#FFA07A

Coral

#FF7F50

Tomato

#FF6347

OrangeRed

#FF4500

DarkOrange

#FF8C00

Orange

#FFA500

Amarelos
Gold
Yellow

#FFD70
0
#FFFF0
0

LightYellow

#FFFFE
0

LemonChiffon

#FFFAC
D

LightGoldenrodY
ellow

#FAFAD
2

PapayaWhip

#FFEFD
5

Moccasin
PeachPuff
PaleGoldenrod
Khaki
DarkKhaki

#FFE4B
5
#FFDAB
9
#EEE8A
A
#F0E68
C
#BDB76
B

Roxos
Lavender
Thistle
Plum
Violet
Orchid
Fuchsia
Magenta

#E6E6FA
#D8BFD
8
#DDA0D
D
#EE82EE
#DA70D
6
#FF00FF

#FF00FF
#BA55D
MediumOrchid
3
#9370D
MediumPurple
B
#8A2BE
BlueViolet
2
#9400D
DarkViolet
3
#9932C
DarkOrchid
C
#8B008
DarkMagenta
B
Purple
#800080
#4B008
Indigo
2
#6A5AC
SlateBlue
D
#483D8
DarkSlateBlue
B
MediumSlateBlu #7B68E
e
E

Verdes
#ADFF2
F
Chartreuse
#7FFF00
#7CFC0
LawnGreen
0
Lime
#00FF00
#32CD3
LimeGreen
2
#98FB9
PaleGreen
8
#90EE9
LightGreen
0
MediumSpringG #00FA9
reen
A
SpringGreen
#00FF7F
MediumSeaGree #3CB37
n
1
#2E8B5
SeaGreen
7
#228B2
ForestGreen
2
#00800
Green
0
#00640
DarkGreen
0
#9ACD3
YellowGreen
2
#6B8E2
OliveDrab
3
#80800
Olive
0
#556B2
DarkOliveGreen
F
MediumAquama #66CDA
rine
A
#8FBC8
DarkSeaGreen
F
#20B2A
LightSeaGreen
A
#008B8
DarkCyan
B
Teal
#00808
GreenYellow

Azuis
#00FFFF

Cyan

#00FFFF

LightCyan

#E0FFFF

PaleTurquoise

#AFEEEE

Aquamarine

LightSkyBlue

#7FFFD4
#40E0D
0
#48D1C
C
#00CED
1
#5F9EA0
#4682B
4
#B0C4D
E
#B0E0E
6
#ADD8E
6
#87CEE
B
#87CEFA

DeepSkyBlue

#00BFFF

MediumTurquoi
se
DarkTurquoise
CadetBlue
SteelBlue
LightSteelBlue
PowderBlue
LightBlue
SkyBlue

DodgerBlue

#1E90FF
#6495E
CornflowerBlue
D
MediumSlateBlu #7B68E
e
E
RoyalBlue
#4169E1
Blue
MediumBlue
DarkBlue
Navy

#191970

Marrons

Aqua

Turquoise

MidnightBlue

#0000FF
#0000C
D
#00008
B
#000080

Cornsilk
BlanchedAlmon
d
Bisque
NavajoWhite
Wheat
BurlyWood
Tan
RosyBrown
SandyBrown
Goldenrod
DarkGoldenrod
Peru
Chocolate
SaddleBrown
Sienna
Brown
Maroon

#FFF8DC
#FFEBC
D
#FFE4C4
#FFDEA
D
#F5DEB
3
#DEB88
7
#D2B48
C
#BC8F8F
#F4A460
#DAA52
0
#B8860
B
#CD853
F
#D2691
E
#8B451
3
#A0522
D
#A52A2
A
#800000

Brancos
White

#FFFFFF

Snow

#FFFAFA

Honeydew

#F0FFF0

MintCream

#F5FFFA

Azure

#F0FFFF

AliceBlue

#F0F8FF

GhostWhite

#F8F8FF

WhiteSmoke

#F5F5F5

Seashell

OldLace

#FFF5EE
#F5F5D
C
#FDF5E6

FloralWhite

#FFFAF0

Ivory

Linen

#FFFFF0
#FAEBD
7
#FAF0E6

LavenderBlush

#FFF0F5

MistyRose

#FFE4E1

Beige

AntiqueWhite

Cinzas

Gray

#DCDCD
C
#D3D3D
3
#C0C0C
0
#A9A9A
9
#808080

DimGray

#696969

LightSlateGray

#778899

SlateGray

#708090

DarkSlateGray

#2F4F4F

Black

#000000

Gainsboro
LightGray
Silver
DarkGray

Você também pode gostar