APPLICATIEBOUW 2E COLLEGE: ONTWERPEN, GEBRUIKERSINTERFACES, VARIABELEN & EXPRESSIES Onderdeel van SmartProducts INHOUD COLLEGE 2 Software ontwerpen Gebruikersinterfaces, in- en uitvoer met tekstvelden Variabelen, expressies, type conversie {3 - 4.2} Math class Opdracht 2 Opdrachten en presentaties: vanslooten.com/applicatiebouw Applicatiebouw, Industrieel Ontwerpen 1-5-2014 2 www.shakespeak.com We gaan stemmen Internet SMS 1 Ga naar shakeq.com 2 Log in met APPL 1 presentatie SMS naaris06 4250 0030 Deze geladen zonder de Shakespeak plug-in. Plug-in gratis downloaden? Ga naar http://shakespeak.com/en/freeuw keuze (bv. Antw b) 2 Typ Antw <spatie> download/ Twitter 1 Begin uw tweet met #APPL <spatie> het vraagnummer 2 Typ daarna <spatie> uw keuze (bv. #APPL 1 b) Geen extra kosten per bericht Applicatiebouw, Industrieel Ontwerpen 1-5-2014 3 Opdracht 1 was: A. Moeilijk B. Redelijk goed te doen C. Makkelijk De vraag gaat open zodra u een sessie en diavoorstelling start. Stemmen: 0 Gesloten Internet Ga naar shakeq.com en log in met APPL Deze presentatie is geladen zonder de Shakespeak plug-in. SMS Stuur naar 06 4250 0030: Antw <spatie> uw keuze (bv. Antw b) Plug-in gratis downloaden? naar uw http://shakespeak.com/en/free-download/ Applicatiebouw, 1-5-2014 Twitter Tweet #APPL <spatie> 0 Ga <spatie> keuze (bv. #APPLIndustrieel 0 b) Ontwerpen 4 Opdracht 1 was: A. Moeilijk Deze voorbeeld resultaten zullen op 0 gezet worden zodra een sessie en diavoorstelling gestart zijn. 33,3% Voel u vrij om ondertussen de layout van de resultaten te veranderen (bv. de kleur) B. Redelijk goed te doen C. Makkelijk 66,7% 100,0% Gesloten Internet Ga naar shakeq.com en log in met APPL Deze presentatie is geladen zonder de Shakespeak plug-in. SMS Stuur naar 06 4250 0030: Antw <spatie> uw keuze (bv. Antw b) Plug-in gratis downloaden? naar uw http://shakespeak.com/en/free-download/ Applicatiebouw, 1-5-2014 Twitter Tweet #APPL <spatie> 0 Ga <spatie> keuze (bv. #APPLIndustrieel 0 b) Ontwerpen 5 SOFTWARE ONTWERPEN Opdrachtgever: "Maak een applicatie die een of meer figuren kan tekenen in een door de gebruiker te bepalen kleur" • Gebruikersinterface ontwerpen: schetsen (Ergonomie) • Specificaties opstellen (DPU1) Applicatiebouw, Industrieel Ontwerpen 1-5-2014 6 DPU1 : SPECIFICATIES Opsomming van de data (wat het programma weet/onthoudt) Invoer/uitvoer: Wat wordt er ingevoerd/doet de gebruiker? Wat wordt er uitgevoerd? Beschrijving algoritmes (hoe het handelt) en/of (vormen van) gedrag Rekenen/bewerken: Wat gebeurd er met de invoer? Resultaat/opslag/communicatie: Moet er iets gebeuren? Hoe wordt het resultaat gepresenteerd/afgeleverd? Opzet module indeling: de hoofdonderdelen en verbanden daar tussen Applicatiebouw, Industrieel Ontwerpen 1-5-2014 7 OBJECTEN: SCHRIJF EEN RECEPT Analyseer de 'wereld' om je heen Klassen (eigenschappen en methoden) specificeren in een klassendiagram (UML) {hst 6 boek} Methoden uitwerken in pseudo-code In “gewone taal” instructies opschrijven, stapsgewijs detailleren Applicatiebouw, Industrieel Ontwerpen 1-5-2014 8 KLASSENDIAGRAM TEKENEN Bijv. online, draw.io Data (wat het programma weet/onthoudt) Beschrijving algoritmes (hoe het handelt) en/of (vormen van) gedrag class Hond { // eigenschappen: int haarlengte; int leeftijd; // methoden: loop(int snelheid); blaf(int volume); zit(); } DPU1 Applicatiebouw, Industrieel Ontwerpen 1-5-2014 9 PSEUDO CODE: METHODEN UITWERKEN PSEUDO DPU2 // methode die het lopen regelt: loop(int snelheid) { als de hond zit, sta dan op (motoren achterbenen aansturen) stel vermogen naar motoren in afhankelijk van snelheid beweeg motoren voorwaarts } CODE: // methode die het lopen regelt: loop(int snelheid) { // als de hond zit, sta dan op (motoren achterbenen aansturen) if (sitting) Motor.A.rotate(60); // stel vermogen naar motoren in afhankelijk van snelheid Motor.A.power(snelheid); Motor.C.power(snelheid); // beweeg motoren voorwaarts Motor.A.forward(); Motor.C.forward(); } Pseudocode komt terug als commentaar Applicatiebouw, Industrieel Ontwerpen 10 THEORIE: GEBRUIKERSINTERFACES KNOPPEN, TEKSTVAKKEN ENZ. Hoofdstuk 2.8 en 2.9 boek Applicatiebouw, Industrieel Ontwerpen 1-5-2014 11 THEORIE: GEBRUIKERSINTERFACES KNOPPEN, TEKSTVAKKEN ENZ. Label Button TextField Invoer: tekstveld is editable (=true) Uitvoer (resultaat): tekstveld is niet editable Hoofdstuk 2.8 en 2.9 boek Applicatiebouw, Industrieel Ontwerpen 1-5-2014 12 GEBEURTENISSEN: EVENT-AFHANDELING HOOFDSTUK 2.8 EN 2.9 BOEK dubbelklik Wat is een event? Muisklik Druk op knop Toetsaanslag Wat gebeurd er? Speciale methode gaat event ‘afhandelen’: Event Handler btnTeken.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { // hier code EventHandler } }); Applicatiebouw, Industrieel Ontwerpen 1-5-2014 13 IN- EN UITVOER MET TEKSTVELDEN HOOFDSTUK 2.8 EN 2.9 BOEK JTextField invoerVeld; Invoer uit tekstvak lezen: getText() methode String invoer = invoerVeld.getText(); JTextField uitvoerVeld; Uitvoer naar tekstvak: setText() methode double getal = 26.0; uitvoerVeld.setText(""+getal); Applicatiebouw, Industrieel Ontwerpen 1-5-2014 14 THEORIE HOOFDSTUK 3 EN 4 TM. 4.2 BOEK Variabelen Expressies Type conversie Mathematische functies Math class Niet in boek… Applicatiebouw, Industrieel Ontwerpen 1-5-2014 15 VARIABELEN DECLAREREN, TOEKENNEN int x, y; Variabele declaratie x = 20; x y = 25; x = y * 2; 50 20 y 25 Variabele: geheugenplaats met een naam Variabele toekenning of assignment Applicatiebouw, Industrieel Ontwerpen 1-5-2014 16 DE TYPEN INT EN DOUBLE int i; double d; i = 3; d = 3.141592653; i = 10; d = 10; i = i / 3; d = d / 3; int: geheel getal i 10 3 d 3.141592653 3.333333333 10.0 double: double precision floating point getal Applicatiebouw, Industrieel Ontwerpen 1-5-2014 17 EXPRESSIES Expressie = Stukje programma met een waarde Gebruik: Rechterkant van een assignment x3 = x2+40 ; Parameterwaarde van een methode aanroep g.fillRect(0, y1+yTop, x1, y2-(y1+yTop) ) ; Applicatiebouw, Industrieel Ontwerpen 1-5-2014 18 OPBOUW VAN EXPRESSIES constante 5 variabele hoogte ... operator ... x+y +1 ( ... ) x - (y + 1) expressie expressie Applicatiebouw, Industrieel Ontwerpen 1-5-2014 19 OPERATOREN +-*/% + optellen Bij deling van int-waarden: cijfers achter de komma - aftrekken worden afgekapt! * vermenigvuldigen / delen % rest bij deling (modulo) 14 / 3 geeft 4 14 % 3 geeft 2 modulo operator want 14 is 4*3 + 2 Applicatiebouw, Industrieel Ontwerpen 1-5-2014 20 PRIORITEIT VAN OPERATOREN Vermenigvuldigen en delen gaat voor optellen en 1+2*3 aftrekken Bij gelijke prioriteit: van links naar rechts 10 - 5 - 2 Wil je ’t anders: (1+2) * 3 gebruik haakjes geeft 7 geeft 3 geeft 9 Applicatiebouw, Industrieel Ontwerpen 1-5-2014 21 TYPE CONVERSIE double d; int i, n; d = 5.0; i = 5.0; d = 5; i = 5; d = n; i = n; d = i; i = d; …van klein naar groot mag altijd, van groot naar klein alleen met een typecast i = (int) d; typecast : expliciete conversie van double naar int Applicatiebouw, Industrieel Ontwerpen 1-5-2014 22 TEKST UITVOER VAN VARIABELEN Print een regel naar de standaard uitvoer System.out.println("Hallo wereld!"); Strings mag je aan elkaar plakken met + operator… System.out.println("gewicht=" + gewicht ); Verklarende tekst Waarde van de variabele Applicatiebouw, Industrieel Ontwerpen 1-5-2014 23 CONVERSIE VAN STRINGS PARAGRAAF 3.9 EN 4.2.6 BOEK String str; int n; str = ”Hallo”; n = 5; str = ”5”; n = str; …er bestaat geen cast voor string naar int of double str = String.valueOf(n); str = n; n = Integer.parseInt(str); double d = Double.parseDouble(str); parse voor expliciete conversie van string naar int of double Applicatiebouw, Industrieel Ontwerpen 1-5-2014 24 MATHEMATISCHE FUNCTIES NIET IN BOEK! Verzameling mathematische functies: Math O.a. sinus (sin), cosinus (cos), wortel (sqrt), machtsverheffen (pow) Resultaat meestal double double s; s = Math.sin(0.78); Applicatiebouw, Industrieel Ontwerpen 1-5-2014 25 MATH: INGEBOUWDE DOCUMENTATIE Nadat je de punt achter Math getypt hebt, verschijnt de ingebouwde hulp met documentatie: Applicatiebouw, Industrieel Ontwerpen 1-5-2014 26 MATH: AFRONDEN VAN GETALLEN double mijnVariable = Math.PI; System.out.println("mijnVariable=" + mijnVariable ); Wat is de uitvoer? mijnVariable=3.141592653589793 double mijnVariable = Math.PI; mijnVariable = Math.round(mijnVariable); System.out.println("mijnVariable=" + mijnVariable ); Wat is de uitvoer? mijnVariable=3.0 Op 2 getallen achter komma afronden? Paragraaf 4.6 boek Applicatiebouw, Industrieel Ontwerpen 1-5-2014 27 DECLARATIE VARIABELE EN TOEKENNING Berekening oppervlakte 3D-object: bol Formule van Wiki-pagina: 4πr2 Java variant formule: 4 * Math.PI * Math.pow(r,2) Complete versie met variabele om waarde resultaat in op te slaan: double oppervlak = 4 * Math.PI * Math.pow(r,2); declaratie toekenning Applicatiebouw, Industrieel Ontwerpen 1-5-2014 28 AAN DE SLAG OPDRACHT 2 Opdracht 2: “Maak een applicatie die een of meer figuren kan tekenen in een door de gebruiker te bepalen kleur” Opdrachten en presentaties: vanslooten.com/applicatiebouw Applicatiebouw, Industrieel Ontwerpen 1-5-2014 29 Hoe ver ben je met Opdracht 2? A. Is af B. Bijna klaar C. Moet nog veel doen D. Ik maak deze opdracht niet De vraag gaat open zodra u een sessie en diavoorstelling start. Stemmen: 0 Gesloten Internet Ga naar shakeq.com en log in met APPL Deze presentatie is geladen zonder de Shakespeak plug-in. SMS Stuur naar 06 4250 0030: Antw <spatie> uw keuze (bv. Antw b) Plug-in gratis downloaden? naar uw http://shakespeak.com/en/free-download/ Applicatiebouw, 1-5-2014 Twitter Tweet #APPL <spatie> 0 Ga <spatie> keuze (bv. #APPLIndustrieel 0 b) Ontwerpen 30 Hoe ver ben je met Opdracht 2? A. Is af B. Bijna klaar C. Moet nog veel doen D. Ik maak deze opdracht niet Deze voorbeeld resultaten zullen op 0 gezet worden zodra een sessie en diavoorstelling gestart zijn. 25,0% Voel u vrij om ondertussen de layout van de resultaten te veranderen (bv. de kleur) 50,0% 75,0% 100,0% Gesloten Internet Ga naar shakeq.com en log in met APPL Deze presentatie is geladen zonder de Shakespeak plug-in. SMS Stuur naar 06 4250 0030: Antw <spatie> uw keuze (bv. Antw b) Plug-in gratis downloaden? naar uw http://shakespeak.com/en/free-download/ Applicatiebouw, 1-5-2014 Twitter Tweet #APPL <spatie> 0 Ga <spatie> keuze (bv. #APPLIndustrieel 0 b) Ontwerpen 31 Heb je vragen of opmerkingen over deze les? 1. Dit is een voorbeeld bericht met het max. aantal tekens. Pas dit aan naar de gewenste grootte, lettertype etc. Dit wordt onthouden. Start dan uw sessie. 2. Dit is een voorbeeld bericht met het max. aantal tekens. Pas dit aan naar de gewenste grootte, lettertype etc. Dit wordt onthouden. Start dan uw sessie. 3. Dit is een voorbeeld bericht met het max. aantal tekens. Pas dit aan naar de gewenste grootte, lettertype etc. Dit wordt onthouden. Start dan uw sessie. Berichten: 0 Internet Ga naar shakeq.com en log in met APPL Deze presentatie is geladen zonder de Shakespeak plug-in. SMS Stuur naar 06 4250 0030: Antw <spatie> uw bericht Plug-in gratis#APPL downloaden? naar http://shakespeak.com/en/free-download/ Applicatiebouw, Industrieel Ontwerpen 1-5-2014 Twitter Verwerk en #Q in Ga uw tweet 32
© Copyright 2024 ExpyDoc