Uppsala universitet, inst. f. Informationsteknologi, avd. f. teknisk databehandling.
Programmeringsteknik I.

Laboration 1

Del 1

Syfte: Förberedelse för att komma igång med kursen
Att göra innan labben: Du bör ha gjort introkursen för UNIX-datorer
Redovisning: Enskilt arbete under labtid

  1. Logga in på en av Sun-datorerna.

  2. Öppna ett terminalfönster (klicka t ex på Konsole-ikonen på Panelen).

  3. Kommandon (Unix) skall matas in i terminalfönstret i den ordningen de står här. Tryck på <Return>-knappen efter varje rad du skrivit. Var noggrann med mellanslag och stavning (skillnad mellan gemener och VERSALER).

  4. Starta en webläsare, t ex mozilla med kommandot:
    > mozilla &

    I mozilla, öppna den websida som är kursens hemsida http://www.it.uu.se/edu/course/homepage/prog1/fht04/

    Titta vad som finns på kurshemsidan. Du kommer antagligen att använda den en hel del under kursen. En del saker är ganska tomma i början och kommer att fyllas på under kursen. Lägg gärna in kurshemsidan som ett bokmärke i mozilla: Klicka på Bookmarks och välj Bookmark This Page.

  5. Välj laborationer -> laboration 1 på kurshemsidan. Det är bra att kunna se den elektroniska varianten av laborationen, med tanke på att det finns färgbilder. (OBS: om du vill kan du markera kommandona nedan i webläsaren, och sedan klistra in dem i terminalfönstret genom att t ex klicka på musens mellan-knapp på terminalfönstrets inmatningsrad.)

  6. Innan du börjar skall datorn förberedas för javakursen. Detta behöver du bara göra första gången.

    Öppna filen .bashrc (OBS! en punkt före bashrc)

    > emacs .bashrc &

    Lägg till raderna:

    # En sökväg för Java-programmen så att de hittar paket export CLASSPATH=.:/it/kurs/java/skansholm/extra # En sökväg för Java-programmen så att de hittar Skansholms # paket som innehåller Swing export CLASSPATH=.:/it/kurs/java/skansholm/extra.jar

    Spara!

    Logga in på nytt.

    Då var det klart.

  7. Skapa en ny katalog med namnet java:

    > mkdir java

    I din java-katalog kan du lägga dina java-program.

  8. Skapa också en katalog med namnet BlueJ:

    > mkdir BlueJ

    Förflytta dig till BlueJ-katalogen med kommandot

    > cd BlueJ

    Om du inte vet i vilken katalog du för tillfället befinner dig i, prova med
    > pwd

  9. Nu skall du hämta filer som du behöver för kursens inledande laborationer. Dessa finns i katalogen /it/kurs/prog1/public_html/qnvht04/BlueJ/examples och skall kopieras till en katalog examples i din BlueJ-katalog. Med kommandot

    > cp -r /it/kurs/prog1/public_html/qnvht04/BlueJ/examples examples

    skapas katalogen examples med ett antal underkataloger (exvis shapes, picture och lab-classes) i din BlueJ-katalog. Kontrollera detta.


Del 2

Syfte: Introduktion till BlueJ. Introduktion till Objekt och Klasser samt några andra centrala begrepp.
Att göra innan labben: Se läsanvisning til föreläsning 1 och 2
Redovisning: Frågorna som står i laborationen skall besvaras på papper och lämnas in till labhandledaren för godkännande senast två dagar efter laborationstillfället.

Övningarna nedan skall göras på datorn. Svaren på frågorna skall lämnas in senast två dagar efter laborationstillfället.

BlueJ är en utvecklingsmiljö för Java speciellt lämpad för undervisning på en grundkurs. BlueJ har utvecklats vid Monash University, i Melbourne, Australien. Mer om BlueJ finns att läsa på http://www.bluej.org/.

BlueJ är fritt att ladda ned och använda på egen dator (PC, Mac) i undervisningen, läs mer på http://www.bluej.org/

Ni kan använda BlueJ för all programmering under kursen, både laborationer, övningar och projektet. Den som vill kan välja att arbeta i någon annan utvecklingsmiljö, t ex emacs. BlueJ ger dig som programmerare visst stöd, men tänk på att när du skrivit ditt program så är det bara en vanlig text innan det är kompilerat, dvs du kan i princip använda vilket ordbehandlingsprogrm som helst så länge du sparar koden som en ren textfil. Vi rekommenderar ändå att du använder BlueJ eller emacs.

  1. Starta BlueJ, gör så här:

  2. Flytta dig till BlueJ-katalogen som du nyss skapade (om du inte redan är där) med kommandot

    cd BlueJ

    Om du inte vet i vilken katalog du för tillfället befinner dig i, prova med

    pwd

    Starta sedan BlueJ med kommandot

    bluej &

    Tecknet & innebär att ditt Unix-fönster fortfarande är mottagligt för kommandon. Följande fönster dyker upp

    test

  3. Öppna ett projekt
    I Project-menyn, klicka på Open Project och ett nytt fönster dyker upp. Sök i din katalog BlueJ efter examples och där skall det finnas ett antal kataloger (s.k. projekt). Välj att öppna projektet shapes.

    Följande visas när projektet shapes öppnas:

    Projektet består av fyra klasser och dessa visas i ett diagram (klassdiagrammet) som fyra färgade rektanglar, en för varje klass. Namnen på klasserna är Circle, Square, Triangle och Canvas. Pilarna i diagrammet anger hur klasserna relateras till varandra, streckade pilar betyder att klassen består av en annan klass och heldragna pilar betyder anger en arvsrelation.

  4. Skapa objekt

    Övning 1: Högerklicka på klassen Circle och välj new Circle() i popup-menyn. Nu efterfrågas "name of the instance". Klicka OK och låt den få defaultnamnet "circle_1" (alt. kan du hitta på ett eget namn). Du har nu skapat ditt första objekt av klassen Circle. Man kan också säga att du skapat en instans av klassen Circle. Den röda rektangeln i nedre delen av fönstret visar att ett objekt skapats, vad det heter och vilken klass objektet skapats av. Objektfönstret längst ned är samlingsplatsen för alla skapade objekt.

    Skapa en annan cirkel på samma sätt, dvs skapa ytterligare en instans av klassen Circle. Kalla det nya objektet med ett namn, t ex Torsten. Skapa även några instanser av klassen Square.
    Du har nu använt klasserna Circle och Square som mall och skapat flera Circle- och Square-objekt.

  5. Anropa metoder

    Övning 2: Högerklicka på en av Circle-objekten (inte klassen!). I popup-menyn finns flera operationer, s.k. metoder listade. Dessa används för att kommunicera med objekt och för att få objekten att utföra olika uppgifter i programmet.

    Prova, dvs klicka på metoden makeVisible som visar (ritar ut) objektet i ett separat fönster. Observera att de röda rektanglarna i objektfönstret bara visar att objekt är skapade, inte hur de ser ut. I det här exemplet kan man även rita upp själva objekten. Det visar sig att objektet circel_1 är en liten blå cirkel som är placerad till vänster i fönstret.

    Prova att anropa moveRight och moveDown ett par gånger för att få objektet att hamna mer centrerat i fönstret. Prova också att anropar metoden makeInvisible två gånger. Gör cirkeln synlig igen genom att anropa lämplig metod.

  6. Parametrar till metoder

    Övning 3: Anropa moveHorizontal:

    Här förväntas att ett tal skall matas in. Prova med 50 och tryck OK. Prova med -50.

    Raden void moveHorizontal(int distance) (i bilden ovan) kallas för metodens huvud och den anger hur man använder metoden. I parentesen ser man att metoden har en parameter. Parametern anger vilken information som kan skickas till ett objekt. Parametern har en datatyp int (förkortning för integer) och ett namn distance . Vi återkommer till datatyper under senare föreläsningar. Anropet ser ut som
    circle_1.moveHorizontal( )
    vilket betyder att metoden anropas för objektet med namnet circle_1, dvs att det är objektet circle_1 som skall flyttas horisontellt. Notera att det högst upp finns en kommentar i kursiv stil som anger vad metoden gör för något.

    Övning 4: Anropa moveVertical, slowMoveVertical och changeSize för objektet circle_1.


    Fråga 1:
    Gör ett av dina andra cirkelobjekt synligt. Flytta det 80 pixlar horisontellt. Hur ser metodanropet ut nu?
    Även klassen Kvadrat har en moveHorizontal( )-metod. Hur kan anropet att flytta en av dina kvadrater horisontellt se ut?

    Övning 5: Skapa ett Triangel-objekt, se till att objektet ritas upp och anropa sedan metoden changeSize. Denna metod har två parametrar.

    Om en metod saknar parameter är parentesen tom, vilket innebär en begränsning i möjligheten att kommunicera med hjälp av metoden.

  7. Datatyper
    Parametrar har alltid en datatyp som anger vilken sorts värde som parametern kan ha. Datatypen int betyder heltal. Metoden changeColor har en parameter av datatypen String. Det är en text (även kallad sträng eller textsträng) som skrivs mellan citationstecken exempelvis "red".

    Övning 6: Anropa changeColor för ett av objekten. Testa några av de korrekta värdena för parametern (se metodens kommentar).


    Fråga 2:
    Vad händer om du anger ett felaktigt värde mellan citationstecknen? Vad händer om du ej skriver citationstecken, exempelvis red?

  8. Multipla instanser av objekt
    Man kan skapa hur många objekt, dvs instanser som helst av en klass. När objekten skapas (konstrueras) används en speciell typ av metod som kallas konstruktorer. De används bara vid skapandet av objekten, och de heter alltid likadant som klassen själv. Om du högerklickar på symbolen för klassen Circle ser du att det finns två metoder som är konstruktorer. De skapar objekten på olika sätt. Om du väljer new Circle() använder du en standardkonstruktor för att konstruera en standardcirkel, vilket i det här fallet alltid ger dig en blå osynlig cirkel, 30 pixlar i diameter, 20 pixlar in från vänstra kanten och 60 pixlar ned från övre kanten. Om du i stället själv vill bestämma hur cirkel-objektet skall se ut när det konstrueras skall du använda en överlagrad konstruktor. I klassen Circle finns en sådan. Den ger dig möjlighet att välja storlek och läge på det nya objektet. Det betyder att den har tre parametrar: diametern d, läget i x-led, xPos samt läget i y-led, yPos.

    Övning 7: Skapa nu en stor cirkel som ligger ungefär i mitten av fönstret. Gör den synlig. Som du ser får du en blå cirkel.

  9. Status för ett objekt
    Ett objekts status bestäms av värdena för objektets alla instansvariabler. För ex.vis ett Cirkel-objekt är det instansvariablerna x-position, y-position, diameter, färg och synlighet som anger dess status. Man kan läsa av statusen för ett objekt genom att i popup-menyn välja Inspect. Fönstret Object Inspector visas då.

    Övning 9: Se till att du har flera objekt skapade och inspektera dem; högerklicka på objektets symbol i objektfönstret och välj Inspect. Stäng inte inspektionsfönstren. Försök att ändra statusen på ett objekt genom att anropa en metod (låt fönstret Object Inspector vara öppet när du anropar metoden). Notera att datatypen för alla instansvariabler finns angivna i Object Inspector.


    Fråga 3: Inspektera ett Cirkel-objekt och notera att där finns en ny datatyp förutom int och String - vilken?

    Fråga 4: a) Vad händer i datorns minne när ett objekt skapas?
    b) Vad händer med objektet när man stänger programmet?
    c) Vad händer med klassen när man stänger programmet?


  10. Vad innehåller ett objekt?

    Objekt av samma klass har exakt lika många instansvariabler och exakt samma namn på instansvariablerna. Det enda som kan skilja är värdet på instansvariablerna, dvs statusen. Varje objekt har ett eget utrymme i datorns minne.

    Objekt av olika klasser kan däremot ha olika innehåll vad beträffar antal instansvariabler och namn på dessa.

    När ett objekt skapas (du valde exvis new Circle()) så erhåller objektet automatiskt alla de instansvariabler som är associerade med klassen och instansvariablerna får initiala värden.

    Alla objekt i en klass har samma antal metoder, men metoderna används av objekten (ej klassen). När en metod anropas är det för ett specifikt objekt, t ex circel_1.moveUp() eller torsten.moveUp(). Objekten använder metoderna för att utföra det programmet är tänkt att utföra.
    Olika klasser har olika antal metoder som utför olika saker. Om du högerklickar på objekten ser du att Circle-, Square- och Triangle-objekten har olika antal metoder som kan göra olika saker.

    Övning 10: Använd klasserna Triangle, Circle och Rectangle för att skapa och rita en bild som föreställer ett hus och sol ungefär som bilden nedan.


    Fråga 5: Vilka metoder använder du? Finns det olika sätt att lösa det? Kan du ge förslag på nya metoder i respektive klass som skulle lösa det effektivare? Vad skulle dessa metoder kunna heta och vilka skulle parametrarna vara?


  11. Interaktion mellan objekt (klassen Picture)
    Stäng shapes-projektet och öppna projektet picture som innehåller klasserna Picture, Triangle, Circle och Canvas. De streckade pilarna i klassdiagrammet anger att Picture består av och därmed använder de klasser som pilarna pekar på. Denna relation mellan klasser betecknas med "Uses" i View-menyn, dvs Picture Uses Triangle, etc. Du kan välja om du vill se denna relation i klassdiagrammet eller inte genom att klicka på knappen Uses.

    Övning 11: Skapa en instans (ett objekt) av klassen Picture och anropa metoden draw. Testa även metoderna setBlackandWhite och setColor. Hur tror du att klassen Picture skapar den bild som ritas upp?

  12. Källkod
    Till varje klass hör en källkod. Det är en text som i detalj definierar en klass. För att se källkoden, dubbelklicka på klassen (eller högerklicka på klassen och välj Open Editor).

    Övning 12: Titta på källkoden i klassen Picture mha Open Editor. Källkoden visas nu i ett nytt fönster - en texteditor. Editorn är en ordbehandlare som är anpassad för programmering.

    Källkoden är skriven i programmeringsspråket Java. Källkoden definierar instansvariablerna och metoderna i klassen, dvs klassens struktur och beteende.

    Övning 13: Försök urskilja beståndsdelarna i klassen Picture's källkod: Instansvariablerna finns överst och metoderna längre ned.

    Övning 14: Leta rätt på den del av källkoden i Picture som ritar ut bilden. Ändra denna del så att solen blir blå istället för gul.

    Innan du kan prova din nya Picture-klass måste du se till att källkoden kontrolleras så att den är korrekt enligt Java-språket och dessutom - om källkoden var korrekt - översättas till s.k. maskinkod som datorn kan tolka. Dessa två steg kallas för kompilering.

    Övning 15: I texteditorn klickar du på Compile för att kompilera. Om du får meddelandet Class compiled - no syntax errors innebär det att du allt gick bra och du kan nu prova din uppdaterade Picture-klass (gör det). Annnars meddelade kompilatorn att den upptäckt fel, grunna inte för mycket på det för tillfället, utan fråga gärna labledaren eller läraren om råd.

    Om du hinner under labben kan du göra övning 16 och 17.

    Övning 16: Ändra Picture-klassens källkod så att den simulerar en solnedgång, dvs solen skall sakta röra sig ned mot horisonten när bilden ritas upp. Tips - använd metoden slowMoveVertical och ändra i metoden draw. Kom ihåg att kompilera innan du testar

    Övning 17: Ändra källkoden så att det skapas två solar. Tips - leta rätt på de fyra attributen wall, window, roof och sun. Lägg till en rad som skapar den andra solen i källkoden. Granska sedan de metoder där den första solen används. Lägg till nya rader i metoderna så att även den andra solen hanteras.


    Fråga 6: Förklara med egna ord begreppen:

    • Objekt
    • Klass
    • Instans
    • Instansvariabel
    • Metod
    • Parameter
    • Källkod
    • Kompilering
    • Editor


Last modified: Mon Oct 4 11:07:41 MEST 2004