| Labb 2, Introduktion till grafik och applets |
|
|
Målet med denna labb är att introducera enklare grafikkomponenter, både i fristående program och i applets. Vi tittar också på paket. |
| Del E |
|
För godkänt till betyg E på denna labb krävs att samtliga uppgifter i denna del skall vara utförda, samt att båda i labbgruppen kan svara på samtliga frågor.
|
|
E1. En enkel knappkomponent |
|
|
Rekommenderad läsning: JButton, setText och setBackground.
OBS ---> För att man ska kunna sätta bakgrundsfärg på sin knapp i MacOS måste man anropa JButton.setOpaque(true) <--- OBS
I detta moment ska vi skapa en klass för en ny grafisk komponent som är en utvidgad knapp, dvs en klass som ärver från JButton. Knappen ska ha två olika tillstånd. Ett tryck på knappen ska ändra tillståndet och det ska synas. Två tryck ska föra knappen tillbaka till starttillståndet. De olika tillstånden ska visas genom att färgen och/eller texten på knappen ändras. För att använda komponenter och funktionalitet som beskrivs här måste man importera javax.swing.*, java.awt.* och java.awt.event.*.
Uppgift E1.1 Definiera klassen MyButton som ärver från JButton. Lägg till nödvändiga fält för att hålla reda på vilket tillständ knappen befinner sig i, och vilken information den ska visa i dessa tillstånd.
Uppgift E1.2 Definiera konstruktorn MyButton(Color col1, Color col2, String text1, String text2) där man kan ange vilken färg respektive text som skall visas i varje tillstånd. Konstruktorn bör sätta knappen till det första tillståndet, och sätta färg och text. Definiera också en konstruktor utan argument, som anropar den första konstruktorn med förutbestämda argument.
Uppgift E1.3 Definiera metoden toggleState(). Ett anrop av denna metod skall byta tillståndet som knappen befinner sig i, och sätta färg och text i enlighet med det nya tillståndet.
|
|
E2. Ett grafiskt ramprogram |
|
|
Rekommenderad läsning: Using top-level containers
I detta moment ska vi skapa ett körbart program som visar upp knappen på skärmen. För att göra dett måste vi skapa en ram som knappen kan finnas i, och sedan skapa en knapp och placera i ramen.
Uppgift E2.1 Skriv ett ramprogram som skapar en JFrame och en myButton. Använd add för att lägga till knappen till ramen, pack för att placera den, och setVisible för att göra den synlig. Om du kör programmet skall knappen synas i ett eget fönster.
Fråga E2.2 Vad gör egentligen pack och setVisible? Vad händer om man inte anropar dessa metoder?
Fråga E2.3 Man kan ställa in vilket beteende man vill programmet ska ha när man stänger ramfönstret, tex genom att anropa metoden setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE). Hur beter sig programmet om man inte gör detta anrop? Hur blir det med anropet?
|
|
E3. En knapp man kan trycka på |
|
|
Rekommenderad läsning: How to Use Buttons, Check Boxes, and Radio Buttons.
I detta moment ska vi lägga till händelselyssnare som väntar på knapptryckningar och byter tillstånd på knappen när någon trycker på den. Interfacet ActionListener deklarerar att en klass implementerar metoden actionPerformed(ActionEvent e). Denna metod anropas av det objekt som man lyssnar på.
Uppgift E3.1 Låt ramprogrammet implementera interfacet ActionListener, och låt dess actionPerformed anropa knappens toggleState(). Tänk på att anropa addActionListener så att knappen vet vem som lyssnar på den. Kontrollera att knappen byter tillstånd när man klickar på den.
Uppgift E3.2 Låt i stället myButton implementera ActionListener, och lyssna på sig själv. Kontrollera att knappen byter tillstånd när man klickar på den.
|
|
E4. En applet |
|
|
Rekommenderad läsning: Getting started with applets.
I detta moment ska vi flytta ut vårt knapprogram på webben. Vi ersätter ramprogrammet med en applet, men låter funktionaliteten vara oförändrad. En applet kan inte köras helt fristående, utan måste vara en del av en html-fil. Den minimala mängden kod som behövs för detta är:
<![CDATA[<applet code = Lab2.class width = 300 height = 150></applet>]]>
Här kör vi appleten Lab2.class som är den kompilerade versionen av Lab2.java i ett fönster som är 300 pixlar brett och 150 pixlar högt. html-filen kan man titta på i en vanlig webbläsare, eller i programmet appletviewer som man anropar från terminalen.
Uppgift E4.1 Ersätt ert ramprogram med en applet, dvs låt det nya ramprogrammet ärva från JApplet. Kom ihåg att spara det nya programmet i en ny fil, så att ni inte skriver över de tidigare uppgifterna. Visa att appleten fungerar likadant som det fristående programmet.
|
|
E5. Paket och programstruktur |
|
|
Rekommenderad läsning: Hur gör man paket? och Sharing project libraries.
För att förenkla hanteringen vid återanvändning av kod kan man skapa paket, som man sedan importerar i början av sina program. Har man mycket kod kan det vara mer översiktligt och lätthanterligt än att ha alla källkodsfiler i samma katalog. Ett annat bra sätt att ge överskådlighet till program är förstås att rita UML-diagram! För en genomgång av UML, se föreläsning 2.
Uppgift E5.1 Lägg den nya knappklassen i ett eget paket, som kan vara en underkatalog paket och skriv lämpliga package och import överst i inblandade javafiler så att det hela fungerar igen. Se till att ni inte har kvar de ursprungliga filerna för myButton i samma katalog som ramprogramsfilerna! Just denna uppgift kan vara lurig om ni använder NetBeans, eftersom mycket av pakethanteringen sker automatiskt.
Uppgift E5.2 Rita UML-klassdiagram över knappkomponent, applet och fristående program. Alla relevanta klasser (nya och från bibliotek) ska vara med men det räcker att skriva klassernas namn i rutorna. Inga detaljer om insidorna, dvs metoder och variabler, behövs.
|
|
|
| Del C |
|
För godkänt till betyg C på denna labb krävs - utöver godkänd E-del - att samtliga uppgifter i denna del skall vara utförda, samt att båda i labbgruppen kan förklara hur koden fungerar, och varför ni löste problemen som ni gjorde.
|
|
Uppgift C1 Gör en ny ramklass, som innehåller flera knappar. Antalet knappar ska man kunna ange från kommandoraden. Varje knapp ska ha ett unikt text- och färgpar, och fungera som den ensamma knappen ovan. Använd paketet som definierats ovan.
|
|
Uppgift C2 Låt ramklassen återigen innehålla flera knappar, med antalet angivet från kommandoraden. Varje knapp ska ha ett unikt text- och färgpar, men när man trycker på en knapp ska den inte ändras, utan alla andra knappar ska ändras. Använd paketet som definierats ovan.
|
|
Fråga C3 I de två uppgifterna ovan, är det lämpligast att använda strukturen från uppgift E3.1 eller från E3.2? Förklara varför!
|
|
Fråga C4 Hur kan man styra layouten för knapparna i uppgift C1 och C2 på ett rationellt vis?
|
