Detta är del 2 av 4 i vår genomgång av programmeringsspråket Scratch.

Innehållsförteckning till genomgången hittar du här.

Jack-Benny Persson från Cyberinfo Sverige fortsätter genomgången av Scratch och visar hur man kan skapa ett nyttoprogram.

I det förra inlägget, En introduktion till Scratch, fick vi lära oss grunderna i hur programmeringsspråket Scratch fungerar. Vi skapade också några enklare exempel för att få känna på hur det är att programmera med Scratch.

Nu har det blivit dags att gå vidare och skapa vårt första nyttoprogram i Scratch, ett program som faktiskt kommer att utföra något åt oss. Vi kommer faktiskt att skapa två program, men de bygger båda på samma idé och formel. Programmen kommer att omvandla temperaturer från Celsius till Fahrenheit. I samband med dessa två program kommer vi också att få lära oss några nya begrepp inom programmeringen. Vi kommer att gå vidare lite mer med variabler och aritmetiska operationer med variabler. Vi kommer också att få lära oss hur man sätter samman textsträngar och uträkningar till en enda textsträng. Därefter kommer det kanske viktigaste för denna delen, nämligen loopar. Loopar är en väsentlig del av all programmering och här kommer vi få en naturlig introduktion till just detta.

Dags att programmera

Det första programmet vi ska göra är ett kort litet program som frågar efter en temperatur i Celsius. När vi har angett en temperatur kommer programmet att utföra alla nödvändiga beräkningar åt oss och skriva ut temperaturen i Fahrenheit åt oss på skärmen.

För att omvandla en temperatur i Celsius till Fahrenheit använder man formeln F = C * 9 / 5 + 32. För att till exempel omvandla 20 grader Celsius till Fahrenheit får vi 20 * 9 / 5 + 32 = 68. Alltså 20C = 68F.

När programmet är klart kommer det att se ut som på bilden nedan.

Vårt första omvandlingsprogram i Scratch

Vårt första omvandlingsprogram i Scratch

Skapa programmet steg för steg

För en beskrivning av hur Scratch fungerar och var de olika kodblocken kan hittas, se gärna En introduktion till Scratch.

  1. Börja med att dra ut blocket when [flag] clicked (finns under Events). Detta är starten för vårt program, och gör så att koden börjar köras så fort vi klickar på startflaggan.
  2. Dra ut ett ask [ ] and wait-block (finns under Sensing). Detta gör att programmet kommer att fråga efter temperaturen.
  3. Gå till Data och skapa två variabler som vi döper till c och f. Dra sedan ut två styck set [] to [] block, som också finns under Data. Sätt det ena blocket till variabeln c i rullgardinsmenyn för blocket. Det andra blocket sätter du till f.
  4. Gå tillbaks till Sensing och dra ut ett answer-block som du placerar i den vita rutan i blocket som nu heter set c to [ ], så att det i blocket står set c to answer. Detta gör att variabeln c kommer att sättas till det svar vi anger till programmet på frågan “Ange temperatur i Celsius”. Om du inte redan gjort det så koppla ihop pusselbitarna som vi gjort än så länge, det vill säga från when [flag] clicked fram till set c to answer så att det ser ut som på bilden ovan.
  5. Nu kommer vi till själva uträkningen. Växla till Operators och dra ut ett divisionsblock, ett multiplikationsblock och ett additionsblock. Växla till Data och dra ut en till c-variabel. Koppla nu ihop de olika delar enligt bilden här nedanför så att vi får formeln F = C * 9 / 5 + 32. Passa också på att fylla i siffrorna för de olika fälten enligt nedan.

    Formeln för att omvandla Celsius till Fahrenheit i Scratch

    Formeln för att omvandla Celsius till Fahrenheit i Scratch

  6. Placera nu hela formel-blocket i det vita fältet i blocket set f to [ ] så att det ser ut som på bilden ovan över det kompletta programmet. Passa även på att koppla ihop denna nya pusselbit med resten av koden.
  7. Nu återstår bara ett steg och det är att få programmet att säga hur mycket det angivna värdet i Celsius blir i Fahrenheit. Här får vi pussla ihop en massa textsträngar och variabler så att det hela blir en lång sträng som katten på kanvasen kommer att säga.
    1. Börja med att växla till Operators igen och dra ut tre styck join-block och ett styck round-block. Join-blocken kommer vi att använda för att pussla ihop alla de olika texterna och variablerna med. Round-blocket kommer vi att använda för att avrunda svaret så att vi inte ska få en massa decimaler i svaret. Vill man utelämna round-blocket så går det bra.
    2. Växla nu till Data och dra ut både en c- och en f-variabel.
    3. Växla till Looks och dra ut ett say-block.
    4. Koppla ihop alla dessa blocken vi precis dragit ut enligt bilden nedan. Passa också på att skriva in texterna i rutorna enligt nedan.

      En beskrivning hur alla delarna i textsträngen hänger samman

      En beskrivning hur alla delarna i textsträngen hänger samman

  8. Koppla nu ihop hela det sista say-blocket med resten av programmet som på den översta bilden. Nu är allting klart!

Nu kan du testköra programmet genom att klicka på den gröna flaggan ovanför kattens kanvas. Om allt har blivit korrekt så kommer katten att fråga efter en temperatur i Celsius. Ange exempelvis 20 grader Celsius genom att skriva 20 i rutan under kanvasen. Nu ska katten svara med “20 Celsius = 68 Fahrenheit”.

Vi har nu skapat vårt första nyttoprogram i Scratch, ett program för att snabbt och enkelt omvandla en temperatur från Celsius till Fahrenheit.

Loopa igenom en lång rad temperaturer

Nu när vi har både formeln och textsträngen (say-blocket) klara, kan vi enkelt modifiera programmet för att istället läsa upp en lång rad temperaturer för oss. Exempelvis kan vi omvandla alla temperatur från 5 till 40 grader Celsius i steg om 5 grader till Fahrenheit.

Men för att slippa skriva samma kod om och om igen för alla temperaturer mellan 5 och 40 grader kommer vi att använda oss av en loop. Det är precis detta som programmering handlar om; att låta datorn göra jobbet åt oss. För visst hade det väl varit tråkigt och repetitivt att behöva skriva samma kod åtta gånger på raken? Med en loop behöver vi bara skriva koden en gång, och sedan låta programmet köra koden om och om igen tills våra villkor är uppfyllda.

Det modifierade programmet

Spara en kopia av ditt nuvarande program med File > Save as a copy. Nu har du kvar originalprogrammet och arbetar istället med en kopia av programmet. Om du vill kan du ändra namn på kopian till något annat än det föreslagna, till exempel “omvandlingsloop”.

När vi är klara med modifieringarna av programmet kommer programmet att se ut som på bilden nedanför. Som du ser så är formeln densamma, likaså det långa say-blocket på slutet (bortsett från att vi istället använder ett say-block med två sekunders paus).

Loopa igenom en lång rad temperaturer

Loopa igenom en lång rad temperaturer

Vi börjar med en liten kort genomgång av vad som händer i programmet innan vi börjar skapa det. På så sätt förstår vi hela tiden vad det är vi gör.

Först så sätts c-variabeln till noll. Direkt efter går programmet in en loop vars villkor är att köras tills dess att variabeln c är exakt lika med 40. Väl inne i loopen ökar vi variabeln c med 5 varje gång loopen körs.

På första loopen kommer alltså c vara just 5 (eftersom 0 + 5 = 5). Därefter körs själva uträkningen för att omvandla 5 grader Celsius till Fahrenheit. Slutligen skrivs resultatet ut för hur mycket 5 grader Celsius är i Fahrenheit. Nu kommer loopen att köras igen, och denna gång blir variabeln c = 10 eftersom den redan är 5 och 5 + 5 = 10. Nu kommer formeln räkna ut hur mycket 10 grader Celsius blir i Fahrenheit. Slutligen skrivs svaret för 10 grader Celsius ut i Fahrenheit.

Så kommer loopen att fortsätta, om och om igen, tills dess att variabeln c har nått 40 grader. Då upphör loopen. Nedan visas en illustration av de första tre varven i loopen.

De tre första varven i loopen

De tre första varven i loopen

Dags att koda och modifiera

Här följer steg för steg-anvisningar hur du modifierar programmet så att det blir som ovan.

  1. Börja med att växla till Control och dra ut en repeat until-block.
  2. Växla till Data och dra ut en c-variabel och ett styck set [] to-block och ett change [] by-block.
  3. Växla till Operators och dra ut ett [] = []-block (likhetstecken).
  4. Växla till Looks och dra ut ett say [] for [] secs.
  5. Dra nu loss den gamla koden från startblocket when [flag] clicked.
    1. Börja med att koppla ihop det nya set [] to-blocket till startblocket och ändra till c-variabeln om det inte redan är gjort. Skriv också en nolla i rutan.
    2. Koppla sedan ihop repeat until-blocket med koden ovan. I rutan för villkoret i repeat until drar du in [] = []-blocket (likhetstecknet). På ena sidan av likhetstecknet drar du in variabeln c och på andra sidan skriver du 40.
    3. Dra in change [] by-blocket i repeat until-blocket och ändra variabeln till c om det inte redan är gjort och skriv 5 i rutan.
    4. Dra nu in den gamla formeln (set f to c * 9/5 + 32) i loopen och sätt den direkt efter change by-blocket.
    5. Dra in det nya say [] for 2 secs-blocket i loopen och sätt det efter formeln. Dra också in hela den gamla join-strängen och placera det i den nya say [] for 2 secs-blocket så att det ser ut som på bilden ovan över det färdiga programmet. Anledningen till att vi vill ha en paus på två sekunder är att vi ska hinna se alla temperaturerna.

Om någon av instruktionerna ovan är oklara så kika på det färdiga programmet i bilden ovan för en hint om hur allting ska hänga ihop.

Nu är hela programmet klart och det är dags att starta programmet. Klicka på den gröna flaggan i kanvasen. Se nu hur katten berättar hur mycket varje temperatur mellan 5 till 40 grader Celsius blir i Fahrenheit i steg om 5 grader. Häftigt, inte sant?

Testa gärna att modifiera programmet genom att utöka hur många temperaturer som ska läsas upp. Öka till exempel 40 till 100 grader. Eller varför inte minska stegen, till exempel till ett, så att varje enskild temperatur läses upp. Vill du öka hastigheten på uppläsningarna kan du minska från två sekunders paus till bara en sekund i say-blocket.

Liknelse med andra språk

Precis som vi gjorde förra gången, kommer vi även här att jämföra våra Scratch-program med andra programmeringssspråk. Det är bra att se hur lik Scratch-koden faktiskt är andra språk.

Första programmet (fråga efter temperatur)

I Python kommer det första programmet se ut ungefär så här. Kom ihåg att man kan skriva ett program på en mängd olika sätt, och det här är bara ett av många olika sätt att skriva det första programmet på.

#!/usr/bin/env python3

c = float(input("Ange temperatur i Celsius: "))
f = c*9/5+32
print(str(c) + " Celsius = " + str(f) + " Fahrenheit")

Och här nedan visas det första programmet fast i programmeringsspråket PHP.

<?php

$c = readline("Ange temperatur i Celsius: ");
$f = $c*9/5+32;
printf("$c Celsius = $f Fahrenheit\n");

?>

Andra programmet (loopa igenom temperaturer)

Här visas först det andra programmet vi gjorde i Scratch i språket Python och sedan i PHP. Här kommer däremot looparna inte att se riktigt likadana ut som i Scratch. I Python och Scratch och används istället while-loopar. Loopen fungerar däremot enligt samma principer, det är bara själva villkoret som skiljer sig lite åt. I Scratch är villkoret att upprepa koden “tills C är lika med 40”. I Python och PHP upprepar vi istället koden “så länge som C är mindre än 40”. Förutom denna skillnad är looparnas principer detsamma. Övrig kod är också väldigt lik. Återigen så är dessa exempel bara en variant, det finns många andra sätt man kan skriva programmen på.

#!/usr/bin/env python3

c = 0
while (c < 40):
    c = c+5
    f = c*9/5+32
    print(str(c) + " Celsius = " + str(f) + " Fahrenheit")
<?php

$c = 0;
while ($c < 40)
{
    $c = $c + 5;
    $f = $c*9/5+32;
    printf("$c Celsius = $f Fahrenheit\n");
}

?>

Länkar till Scratch-programmen

Om du behöver hjälp på traven med något av programmen kan du kopiera programmen direkt från mitt Scratch-konto. Klicka på Remix-knappen längst upp till höger för att kopiera mina program till ditt egna konto.