Modernisering van Swing

Van Swing naar het web, Eén scherm tegelijk

Je Swing-, JavaFX- of SWT-app draait zonder wijzigingen in de broncode in een webbrowser. Daarna bouw je er in webforJ nieuwe schermen omheen en vervang je de oude in je eigen tempo. Het Java-team en de code blijven.

Volg de tutorial Webswing instellen

Desktoptoolkits: Swing, JavaFX en SWT: 3
Broncodewijzigingen om in een browser uit te voeren: 0

Klanten

KlantenSwing
BestellingenwebforJ
RapportenSwing

Swing-app, gestreamd

Klantentabel

BestandBewerkenBekijken

NaamTeamStad

Hyyan Abo FakherVerkoopBerlin

Matthew HawkinsOndersteuningBoston

Eric HandtkeFinanciënHamburg

Ben BrennanVerkoopDenver

Garrison OsteenOndersteuningAustin

Lauren AlamoFinanciënPhoenix

Klant bewerken

NaamEric HandtkeTeamFinanciënStadHamburg

AnnulerenOpslaan

webforJ-dialoogvenster

Een dubbelklik in de Swing-tabel opent een webforJ-dialoogvenster in plaats van het oude Swing-venster. Beide draaien in hetzelfde browsertabblad.

Wat blijft hetzelfde

Alleen de schermen Wijzigen

webforJ is het full-stack Java-framework voor zakelijke webapps: je bouwt de hele app, inclusief schermen, in Java. Een Swing-app overzetten betekent dus ook de schermen overzetten, en alles daaronder gaat mee.

Wat verandert er?

De schermen. Je verplaatst ze één voor één, in de volgorde die voor je bedrijf belangrijk is, terwijl de rest van de Swing-app in hetzelfde browsertabblad blijft draaien.

01
Het team
De mensen die de Swing-app nu onderhouden, bouwen de webschermen in Java. Er is geen tweede team en geen front-endtoolchain om te leren.
02
De code
Webswing voert de app uit zoals die is. Dezelfde codebase werkt als desktopapp en in de browser, zodat je één app onderhoudt in plaats van twee.
03
De logica
Domeinklassen, services en validatieregels die niets met javax.swing te maken hebben, worden rechtstreeks vanuit de nieuwe schermen aangeroepen. Ze worden niet eerst als endpoints beschikbaar gemaakt.
04
De toolchain
Maven, je IDE, je debugger en je bestaande tests blijven van toepassing.

De verhuizing in drie fasen

Speel de zet stap voor stap af van desktop naar web

Elke fase levert iets op dat gebruikers kunnen zien. Kies een fase om het scherm en de bijbehorende code op dat punt te bekijken.

Klantentabel

BestandBewerkenBekijken

NaamTeamStad

Hyyan Abo FakherVerkoopBerlin

Matthew HawkinsOndersteuningBoston

Eric HandtkeFinanciënHamburg

Ben BrennanVerkoopDenver

Garrison OsteenOndersteuningAustin

Lauren AlamoFinanciënPhoenix

Start de desktopapp in de browser

Webswing voert je Swing-, JavaFX- of SWT-app uit op de server en streamt de interface als HTML5-canvas naar de browser. Muis- en toetsenbordinvoer gaat terug naar de echte app. De broncode blijft ongewijzigd.

Neem het op in een webforJ-weergave met WebswingConnector. De connector maakt verbinding met de Webswing-server zodra deze aan de pagina wordt toegevoegd.

SwingAppView.java

@Route
public class SwingAppView extends Composite<Div> {
  private final Div self = getBoundComponent();
  private WebswingConnector connector;

  public SwingAppView() {
    // Initialize the connector with your Webswing application URL
    connector = new WebswingConnector("http://localhost:8080/myapp/");

    // Set the display dimensions
    connector.setSize("100%", "600px");

    // Add to the view container
    self.add(connector);
  }
}

Klanten

KlantenSwing
BestellingenwebforJ
RapportenSwing

WebswingConnector

Klantentabel

BestandBewerkenBekijken

NaamTeamStad

Hyyan Abo FakherVerkoopBerlin

Matthew HawkinsOndersteuningBoston

Eric HandtkeFinanciënHamburg

Ben BrennanVerkoopDenver

Garrison OsteenOndersteuningAustin

Lauren AlamoFinanciënPhoenix

Klant bewerken

NaamEric HandtkeTeamFinanciënStadHamburg

AnnulerenOpslaan

webforJ

Bouw er nieuwe schermen omheen

Nieuwe schermen zijn geschreven in webforJ en staan naast de ingesloten app. Beide kanten sturen elkaar acties: een klik in Swing kan een webformulier openen en een opslagactie op het web werkt de Swing-tabel bij. Gebruikers werken in oude en nieuwe schermen in hetzelfde browsertabblad.

Swing geeft een dubbelklik door als select-customer. webforJ opent een eigen formulier en stuurt bij opslaan update-customer terug.

CustomerTableView.java

connector.onAction(event -> {
  switch (event.getActionName()) {
    case "select-customer":
      event.getActionData().ifPresent(data -> {
        JsonObject customer = JsonParser.parseString(data).getAsJsonObject();
        CustomerForm dialog = new CustomerForm(customer);
        self.add(dialog);
        dialog.onSave(() -> {
          Gson gson = new Gson();
          connector.performAction("update-customer", gson.toJson(customer));
        });
      });
      break;
  }
});

Klanten

KlantenwebforJ
BestellingenwebforJ
RapportenwebforJ

NaamTeamStad

Hyyan Abo FakherVerkoopBerlin

Matthew HawkinsOndersteuningBoston

Eric HandtkeFinanciënHamburg

Ben BrennanVerkoopDenver

Garrison OsteenOndersteuningAustin

Lauren AlamoFinanciënPhoenix

Klant bewerken

NaamEric HandtkeTeamFinanciënStadHamburg

AnnulerenOpslaan

De desktopclient uitfaseren

Vervang de Swing-schermen één voor één, in de volgorde die voor uw bedrijf belangrijk is. Verwijder de acties van een scherm zodra er een webforJ-equivalent is. Na het laatste scherm verdwijnen de Webswing-laag en de desktopclient.

Je kunt na elke fase stoppen en toch iets hebben bereikt. Fase 2 kan doorgaan zolang het budget dat toelaat.

Wat wordt uitgevoerd?: Eén Java-app in de browser, elk scherm geschreven in webforJ.
Wat gaat mee?: De Webswing-server, de gestreamde desktopinterface en de geïnstalleerde client.
Wat blijft er?: Je domeinklassen, services en validatieregels, aangeroepen vanuit de nieuwe schermen als Java-methoden.

Fase 1 van 3

Tweerichtingscommunicatie

Oude en nieuwe schermen Met elkaar praten

Een bericht is een actie: een naam, een optionele tekenreeks als payload en een optionele binaire payload. De naam mag je zelf bedenken. Beide kanten zijn gewoon Java, dus niemand hoeft browserscripts te schrijven voor de uitwisseling.

Swing kondigt aan

Dubbelklikken verzendt select-customer met de rij als JSON. Op desktop opent dezelfde klik nog steeds het Swing-dialoogvenster.

Application.java (Swing)

private void handleDoubleClick(MouseEvent e) {
  int row = table.rowAtPoint(e.getPoint());
  if (row >= 0 && row < customers.size()) {
    Customer customer = customers.get(row);

    if (isWebswing) {
      api.sendActionEvent("select-customer", gson.toJson(customer), null);
    } else {
      showEditDialog(customer);
    }
  }
}

CustomerBridgeView.java (webforJ)

connector.onAction(e -> {
  switch (e.getActionName()) {
    case "select-customer" -> e.getActionData().ifPresent(this::openEditor);
    case "export-ready" -> e.getActionBinaryData()
        .ifPresent(d -> status.setText("Got " + d.length() + " characters"));
    default -> { }
  }
});

webforJ-antwoorden

Bij opslaan stuurt het webformulier update-customer terug, waarna de Swing-app de tabel vernieuwt. Geen van beide kanten roept de interne code van de andere aan.

Application.java (Swing)

private void setupWebswingListeners() {
  api.addBrowserActionListener(event -> {
    if ("update-customer".equals(event.getActionName())) {
      Customer updated = gson.fromJson(event.getData(), Customer.class);
      updateCustomer(updated);
    }
  });
}

CustomerTableView.java (webforJ)

dialog.onSave(() -> {
  // Send updated customer back to Swing
  connector.performAction("update-customer", gson.toJson(customer));
});

Opdrachten naar Swing sturen

performAction() verstuurt alleen een naam of een naam met gegevens. De Swing-app bepaalt wat elke naam betekent.

Acties verzenden

// Trigger a refresh in the Swing application from webforJ
connector.performAction("refresh");

// Send a command with data from webforJ
connector.performAction("selectRecord", "12345");

Weet wanneer Swing klaar is

onInitialize wordt aangeroepen wanneer de verbinding gereed is. onStart wordt aangeroepen zodra de Swing-app volledig is geladen. Verstuur je eerste actie vanuit onStart.

Levenscyclusgebeurtenissen

connector.onInitialize(e -> status.setText("Connected"));
connector.onStart(e -> status.setText("Swing app running"));

Porteren met een AI-assistent

Laat een assistent het porteren, scherm voor scherm

Scherm voor scherm werken is repetitief werk, en dat is precies waar een AI-codeerassistent goed in is. De webforJ AI-plugin verbindt de assistent met de webforJ MCP-server en Agent Skills: gestructureerde workflows die aangeven wanneer en in welke volgorde de assistent deze tools moet gebruiken en hoe het resultaat moet worden gevalideerd.

Installeer de AI-plug-in Lees over Agent Skills

1
Geef het één Swing-scherm
Vraag om het webforJ-equivalent dat je bestaande services aanroept.
2
Het controleert de echte API.
De MCP-server zoekt op verzoek documentatie en API-details van webforJ op, in plaats van te gokken.
3
Je beoordeelt en test.
Vergelijk het gedrag met het Swing-origineel en ga door naar het volgende scherm.

Aan de slag

Uit een JAR-bestand naar een pagina in de browser

Je hebt een Swing-, JavaFX- of SWT-app nodig die als JAR-bestand is verpakt, evenals de Webswing-server en webforJ 25.10 of hoger.

1
Download en start Webswing
Download Webswing, pak het archief uit en start de server met het script voor uw platform. De server is bereikbaar op http://localhost:8080.
```
webswing.sh
```
2
Registreer je app
Stel in de beheerconsole bij http://localhost:8080/admin de applicatienaam, hoofdklasse, classpath, JVM-argumenten en thuismap in. De app is vervolgens beschikbaar op http://localhost:8080/[app-name]/.
CORS
Voeg de origin van je webforJ-app toe aan Toegestane origins, bijvoorbeeld http://localhost:8090.
Poorten
Beide gebruiken doorgaans 8080. Wijzig een van beide om conflicten te voorkomen.

Voeg de afhankelijkheid toe

De module webforj-webswing biedt WebswingConnector en de bijbehorende klassen.

<dependency>
  <groupId>com.webforj</groupId>
  <artifactId>webforj-webswing</artifactId>
  <version>${webforj.version}</version>
</dependency>

4
Insluiten en configureren
Voeg een WebswingConnector toe aan een weergave, net als in fase 1. WebswingOptions verandert het gedrag ervan, bijvoorbeeld door de uitlogknop te verbergen wanneer je webforJ-app het aanmelden afhandelt.
```
WebswingConnector connector = new WebswingConnector("http://localhost:8080/myapp/");

WebswingOptions options = new WebswingOptions()
  .setDisableLogout(true);  // Hide the logout button

connector.setOptions(options);
```

Kies je eerste scherm

Begin met een eenvoudige lijst en een bewerkingsformulier. Integreer de app, verplaats dat ene scherm naar webforJ en kijk hoe het naast de rest werkt.

Alleen de schermen Wijzigen

Het team

De code

De logica

De toolchain

Speel de zet stap voor stap af van desktop naar web

Start de desktopapp in de browser

Oude en nieuwe schermen Met elkaar praten

Swing kondigt aan

webforJ-antwoorden

Opdrachten naar Swing sturen

Weet wanneer Swing klaar is

Laat een assistent het porteren, scherm voor scherm

Uit een JAR-bestand naar een pagina in de browser

Download en start Webswing

Registreer je app

Voeg de afhankelijkheid toe

Insluiten en configureren

Kies je eerste scherm