Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Voor het ontwikkelen van de applicatie is Java 17 vereist, evenals de JavaFX 17 SDK. Configuratie van Java staat in de installatiehandleiding beschreven.

Git

todo

Het klonen van de repository

De project-repository wordt door projectgroep ENIAC aangeleverdOm een repository te kunnen klonen moet Git op de computer gedownload zijn. Git is een systeem dat gebruikt wordt om veranderingen in bestanden bij te houden. Het is vooral handig voor mensen die samenwerken aan projecten, zoals softwareontwikkeling, maar het kan ook voor andere soorten projecten gebruikt worden. Git kun je downloaden vanaf de volgende pagina https://www.git-scm.com/downloads

Het opstellen van het project

...

  1. Voeg het project toe aan git via git clone <repo>.
  2. Start IntelliJ.
  3. Open de pom.xml als project en laad alle dependencies.
  4. Zoek in de repository het bestand JaVaFo.jar. Druk met de rechtermuisknop hierop en klik op "Add as library", druk in het pop-upmenu op "ok".
  5. Controleer in module-info.java of van de twee regels die JaVaFo bevatten, degene onder de system scope in gebruik is. Dit staat in het bestand met comments aangegeven. Zie hoofdstuk 8 8 over JaVaFo voor verdere toelichting.
  6. Controleer in de pom.xml of bij de JaVaFo dependency de system scope met bijbehorende filepath aanwezig zijn.
  7. Run Mainwrapper.class of KlukklukApplication.class om de applicatie te compileren. De applicatie zal nu opstarten.

...

  • CREATE.sql, het script waarmee de database aangemaakt kan worden. Mochten er ooit aanpassingen moeten plaatsvinden in de database, dan kunnen die via dit bestand ingevoerd worden. (Zorg er naderhand voor dat de Entity-klassen bijgewerkt worden)
  • JaVaFo.jar, De externe library gebruikt voor de indelingen voor periodecompetities via zwitsers. Hierover later nog meer informatie.

SQLite

Om een SQLite database te maken moet je SQLite geinstalleert hebben."SQLite3 kun je downloaden op https://sqlite.org/download.html. Om een database te maken kun je het commando "sqlite3 klukkluk.db < CREATE.sql" uitvoeren.

JPA

Voor verbinding met de database maakt Klukkluk gebruik van de Jakarta Persistence API. Om data uit de database te benaderen dient gebruik te worden gemaakt van de Repository en Entity-klassen, waarbij de repositories de functie van een DAO uitvoeren en een Entity een java-klasse is die een database tabel representeert. In de repositories kunnen queries op de database uitgevoerd worden in een speciaal dialect genaamd JPQL (Jakarta Persistence Query Language). Het resultaat van een query is altijd ofwel één ofwel een List van Entities. Deze entities kunnen vervolgens via mappers omgezet worden naar DTO's.

...

Om de dependency lokaal te installeren dienen de instructies in de comments van module-info.java gevolgd te worden. Hierna kunnen de JaVaFo modules omgewisseld worden en kan in pom.xml de system scope en filepath uitgecomment worden. Voor een lokale maven dependency zijn deze immers niet van toepassing.

JavaFX

JavaFX is over het algemeen vrij gemakkelijk te gebruiken, wel zijn er een paar belangrijke dingen die een ontwikkelaar moet weten om goed met JavaFX te kunnen werken. 
JavaFX werkt met FXML bestanden. Dit zijn eigenlijk een soort HTML bestanden die het raamwerk van de front-end bevatten. Er kan met CSS bestanden styling gegeven worden aan deze bestanden. Er zijn wel een paar belangrijke regels voor deze FXML bestanden. Zet deze bestanden in een folder genaamd resources die zich bevindt in de src/main van het project. FXML is niet heel lastig om mee te werken door de scene builder, voordat we hiermee beginnen moeten we echter wel eerst een controller linken aan het bestand en andere instellingen instellen. Anders zal het programma niet opstarten. 

Image Added

Zoals te zien is in de bovenstaande screenshot in het rode vakje worden er meerdere dingen aangewezen aan een soort variabelen. Sommige van deze dingen genereert JavaFX zelf met het gebruik van de Scene Builder. Een paar dingen ook niet. Bijvoorbeeld de stylesheets tag bevat de link naar de stylesheet voor het bestand. De styleClass tag bevat een CSS klasse met styling en de fx:controller tag bevat een link naar de controller klasse van deze pagina. De controller bevat al het gedrag van de pagina en maakt gebruik van de fx:id's die aan verschillende velden en objecten meegegeven worden om het gedrag daarover te beheren. 

Image Added

Als er op deze knop wordt gedrukt, de Scene Builder knop, wordt de Scene Builder geopend. De Scene Builder is een drag & drop interface waar buttons en andere elementen van JavaFX op de pagina gezet kunnen worden. Dit kan ook direct in de code en daar is dan ook de text knop voor. In de screenshot is de huidige pagina de text pagina. 

Image Added

In de Scene Builder zijn verschillende blokken met verschillende velden en functionaliteiten. Ik heb deze voor het gemak even onderverdeeld in cijfers waar ik vanaf nu naar zal refereren. 

Blok 1 (linksboven) bevat alle elementen die in de pagina gesleept kunnen worden. Dit zijn bijvoorbeeld buttons, grafieken, een menu, tabellen en nog veel meer. Als er iets geslepen wordt in het veld in het midden (de pagina) gebeuren er twee belangrijke dingen. Één is dat er op de achtergrond in het text tabje de FXML code voor het object wordt aangemaakt. Nummer twee is dat er in vak 2 (linksonder) een nieuw object erbij komt. Het object dat net in het vak is gesleept. Vak 2 is dan ook de navigator waar alle objecten die vanuit blok 1 op de pagina gesleept worden in hiërarchische volgorde worden weergeven. Als laatste is er nog vak 3 (rechts). Dit vak bevat alle instellingen voor het object uit vak 1. Selecteer een object op de pagina en alle opties komen omhoog die aangepast kunnen worden aan dat object. Een hoop van deze instellingen kunnen ook in de text tab aangepast worden en dat is vaak ook makkelijker. 

Image Added

In de bovenstaande button worden een paar belangrijke handelingen gedaan. Allereerst wordt er met fx:id een variabele naam gegeven aan de button die in de controller gebruikt kan worden. Later komt hier meer informatie over. Disable zorgt ervoor dat de knop unclickable wordt. mnemonicParsing wordt automatisch aangemaakt bij het gebruik van de Scene Builder en hoeft niet aangepast te worden. onAction is misschien wel een van de belangrijkste tag's op deze pagina. Naast onAction zijn er meerdere soortgelijke tags die onder andere staan in het kopje "Properties inherited from class javafx.scene.Node". Het is verstandig om deze API documentatie van JavaFX

...

ook nog even goed door te lezen aangezien hier erg handige methodes in beschreven staan. De eerder genoemde onAction en andere tags die daarbij horen triggeren een actie als er een bepaalde interactie met de knop wordt gedaan. onAction activeert in dit geval de methode onDeleteButton die in de controller staat als er op de knop geklikt wordt. De hashtag voor de methode is verplicht. Als laatste is er nog de styleClass tag en deze is hetzelfde als bij de borderPane in een eerder voorbeeld. Hiermee kan een styling klasse gebonden worden aan deze button. 

Image Added

In de controller zijn er een hoop van deze @FXML tags te vinden. Deze binden het FXML object aan een Java object waar de controller gebruik van kan maken. JavaFX kan deze zelf genereren als er een nieuwe fx:id gegeven wordt aan bijvoorbeeld een button door over het gele lijntje dat verschijnt te klikken en op generate in controller te klikken. Ditzelfde kan ook voor methodes en is ook aangeraden aangezien verschillende trigger tags verschillende parameters hebben. 

Dit waren zo een beetje de belangrijkste dingen voor het gebruik van JavaFX. Als laatste is er nog de stylesheet maar deze verandert niet heel veel van normaal CSS. Het is wel belangrijk dat de gebruiker een value assigned aan een CSS functie die begint met -fx. Dit zijn de ingebouwde functies van JavaFX en andere functies die niet beginnen met -fx werken af en toe, maar zijn niet heel betrouwbaar. 

Packaging via Maven

Klukkluk is een maven project, hierdoor kan de applicatie gemakkelijk gepackaged worden als een enkele .jar. Dit gebeurt door middel van de Maven Shade plugin:

Image Added

De configuratie gebruikt door Klukkluk is vrij standaard en hoeft verder niet gewijzigd te worden.

De Maven Shade plugin haakt direct in de gebruikelijke maven commando's, de applicatie kan dus via mvn (clean) package gepackaged worden. Na het uitvoeren van dit commando worden er twee .jar bestanden gegenereerd: een original versie van de .jar (original-klukkluk-0.X.jar), en een zogeheten shaded .jar, genaamd klukkluk-0.X.jar. De shaded .jar bevat alle maven dependencies die nodig zijn om Klukkluk op te starten, waaronder alle onderdelen van JavaFX voor de front end van de applicatie. De original .jar heeft dit niet en zal dus niet opstarten. Deze .jar runnen via java -jar .\original-klukkluk-0.X.jar zal in de opdrachtprompt of terminal de volgende error geven:

Image Added

Noot: Het betreft een ClassNotFoundException, deze wordt veroorzaakt door het ontbreken van module javafx.application.Application. Een klasse vereist door JavaFX om de applicatie te kunnen starten.tekst

jpackage

Om de applicatie als een .msi te packagen kan gebruik worden gemaakt van jpackage. Jpackage werkt via een command line die in de Windows Opdrachtprompt of MacOS Terminal kan worden uitgevoerd. Dit ziet er als volgt uit:

Code Block
jpackage --name Klukkluk --input "<path\to\main\jar\directory>" --type "msi" --app-version "0.4X" --main-jar "klukkluk-0.xX.jar" --win-dir-chooser --dest "<path\to\destination>" --win-shortcut --icon "<path\to\klukkluk.ico>"

...