JavaFX Controller Klasse splitten?

[DefconDev]

Hallo zusammen,

ich habe per Scene Builder meine Gui zusammen gebastelt. Auf einem Anchor Pane befinden sich 18 Buttons.
Die Buttons sind an meine eigene Controller Klasse angebunden im Scene Builder.

Die werden alle mit der Annotation @FXML in meiner Controller Klasse "initalisiert".

Jetzt stell ich mir die Frage aber, wie kann ich die Controller Klasse sinnvoll aufteilen?

Wenn ich eine neue Instanz einer anderen Klasse in der Controller Klasse erstelle, müsste ich in meinem Bsp. 18 Buttons in die andere Klasse übergeben. Mit einem Konstruktor der dann entweder einzeln jeden Button aufnimmt oder ein Array der Buttons. Nur bei einem Button array kann ich keine Buttons explizit aufrufen weil jeder Button ein anderes verhalten auslösen soll.


Ich frage deswegen, bei einer richtig großen GUI sind ja etliche Buttons vorhanden nur kann man das Verhalten nicht komplett in der Controlller Klasse beschreiben. Die Klasse würde explodieren.

 

[wolfgang63]

Vielleicht verstehe ich dein Problem falsch, aber warum musst du deine Programmlogik in die Controllerklasse schreiben?
Es genügt doch in der Ereignisbehandlung deiner Controllerklasse eine Zeile mit einem Methodenaufruf einer anderen Klasse zu schreiben.

 

[dzim]

Und diese andere Klasse könntest du per Dependency Injection oder indem du eine ControllerFactory für den FXMLLoader schreibst, dort hinein bekommen. Oder du triggerst spezifische Events, die dann von entsprechenden Handler bearbeitet werden.

 

[DefconDev]

Vielleicht verstehe ich dein Problem falsch, aber warum musst du deine Programmlogik in die Controllerklasse schreiben?
Es genügt doch in der Ereignisbehandlung deiner Controllerklasse eine Zeile mit einem Methodenaufruf einer anderen Klasse zu schreiben.

Die will ich auch nicht dort rein schreiben. Nur finde ich es schon ziemlich statisch, wenn man eine Conrtolller Klasse nur besitzt, welche evtl 100 Componenten mitbringen muss, die dann auch noch alle interagieren müssen. Allein die Konstruktoren zu schreiben für die anderen Klassen ist ziemlich umständlich.

Daher richtet sich meine Frage auch darauf, wie man das geschickt umgehen kann. Oder wie "Ihr" das praktiziert.

 

[dzim]

Unabhängig davon ob du jetzt Logik im Controller hast oder nicht:

Nur finde ich es schon ziemlich statisch, wenn man eine Conrtolller Klasse nur besitzt, welche evtl 100 Componenten mitbringen muss, die dann auch noch alle interagieren müssen.

Dafuq!? Willst du mir ernsthaft erzählen, du machst die komplette GUI in eine einzelne Oberfläche!? Schon mal etwas von "Devide & Conquer" gehört?

Daher richtet sich meine Frage auch darauf, wie man das geschickt umgehen kann. Oder wie "Ihr" das praktiziert.

Wir umgehen dass, indem wir das grosse Problem in kleine Probleme zerlegen, mit denen man besser umgehene kann.
Dabei spielt es hier keine Rolle, ob man Swing (Frames), SWT (Composites), JavaFX (FXMLs), Android (Activities & Fragmente - und natürlich XML Layouts) oder Frameworks anderer Programmiersprachen verwendet: Man macht einfach keine Monster-GUI die alles enthält, sondern gruppiert nach logischen Bereichen.

In JavaFX könnte es sein, das du ein Root-FXML hast, das vielleicht nur Menü, Content-Bereich und Footer besitzt. Der Content könnte ein SplitPane oder so sein, um Master und Details Details die Daten des ausgewählten Elements). Der Master könnte z.B. eine Liste sein. Details eine VBox oder sonst etwas um die Details darzustellen. Und jedes der genannten Bereiche hat sein eigenes FXML und seinen eigenen Controller.

Savvy?

 

[DefconDev]

In Swing habe ich natürlich nicht alles in eine Klasse gestopft. Das hätte mit OO nichts mehr zu tun gehabt.

Daher bin ich hier und Frage. Beim Scene Builder kann ich für die Componenten die ich dort einbaue nur eine enzige Controller Klasse angeben.

In dieser Controller Klasse müssen alle Compomenten per @FXML angegeben werden. Jetzt kann ich natürlich weitere Controller Klassen erstellen, die müssen aber erst einmal von dem Main Controller die Componenten zugewiesen bekommen, ob über Konstruktor oder Getter-Methoden.

public class MyController{
	
	@FXML private TreeView<Object> spieler_tree;
	@FXML private TreeView<Object> karten_tree;
	@FXML private TreeView<Object> voelker_tree;
	
	@FXML private Button player_Slot_1;
	@FXML private Button player_Slot_2;
	@FXML private Button player_Slot_3;
	@FXML private Button player_Slot_4;
	@FXML private Button player_Slot_5;
	@FXML private Button player_Slot_6;
	@FXML private Button player_Slot_7;
	@FXML private Button player_Slot_8;
	
	@FXML private Button nation_Slot_1;
	@FXML private Button nation_Slot_2;
	@FXML private Button nation_Slot_3;
	@FXML private Button nation_Slot_4;
	@FXML private Button nation_Slot_5;
	@FXML private Button nation_Slot_6;
	@FXML private Button nation_Slot_7;
	@FXML private Button nation_Slot_8;
	
	@FXML private Button map_Slot;
	@FXML private Button save;
	@FXML private Button auslosung;
	
	@FXML private ToggleButton doubleNation;
	@FXML private ToggleButton mirrorNation;
	
	@FXML
	public void pressed(MouseEvent event){
		
		
		
		Auslosung_Controller auslosungsController = new Auslosung_Controller(Button player_Slot_1;Button player_Slot_2,Button player_Slot_3,Button player_Slot_4);

		}
	
	
	
	public void initialize() {
		TreeView_Controller treeController = new    TreeView_Controller(spieler_tree,karten_tree,voelker_tree);    
		
	}

 

[Tom299]

Also ich klinke mich auch einfach mal mit ein, da ich in JavaFX noch neu bin und mich auch schon gefragt habe, wie ich am besten die Controller miteinander in Beziehung bringe.

Die FXMLs trennen und einen Controller dafür anlegen ist ja noch kein Problem (z.B. ein Menü-FXML mit MenueController, dann noch eine List-FXML mit ListController und daneben ein Details-FXML mit DetailsController).

Wie mach ich das am geschicktesten, daß der Menü-Controller dem ListContoller sagt, was er auflisten soll und der ListController mit dem Details-Controller dann sagen, was dieser genau anzeigen soll.D.h. die Controller müßten sich irgendwie kennen oder gibts da in JavaFX irgendwas spezielles, was man dafür verwenden soll/kann?

Früher in Swing hätte ich entweder alle Controller in einer statischen Liste gehalten, um auf den entsprechenden zugreifen zu können, oder mit Interfaces gearbeitet und Events gefeuert und abgefangen. Die Frage ist, ob ich das in JavaFX auch machen soll oder ob es was eleganteres gibt?

 

[dzim]

Das ist korrekt: Es besteht stehts eine 1:1-Beziehung zwischen einer FXML und dem dazugehörigen Controller.

In dieser Controller Klasse müssen alle Compomenten per @FXML angegeben werden. Jetzt kann ich natürlich weitere Controller Klassen erstellen, die müssen aber erst einmal von dem Main Controller die Componenten zugewiesen bekommen, ob über Konstruktor oder Getter-Methoden.

Nein müssen sie eben nicht.
Wenn du für eine Sub-Komponenten, beispielsweise einen TreeView, eine eigene FXML definierst, bekommt dieser auch einen eigenen Controller. Oder genauer: eine eigene Klasse als Controller.
Ich würde eben nicht nur eine Controller-Klasse anlegen und sie mehreren FXMLs zuweisen, weil die ganzen Felder der "anderen" FXMLs dann eben unbesetzt blieben. Das ist nicht zielführend.
Getter und Setter (oder eben die weiter oben erwähnte Dependency) brauchst du nur, wenn du in dem konkreten Controller zum Beispiel ein Modell, oder einen Handler für spezielle Logik (also die von dem ViewModel getrennte Businesslogik) diese benötigst.

Bleibe also am Besten immer dabei: Jedes FXML hat seine eigene Controller-Klasse.

 

[DefconDev]

So, wie du das beschreibst, lässt sich das für mich momentan nicht realisieren.

Wenn ich den SceneBuilder benutze, muss ich eine Controller Klasse festlegen, und meines Wissens ist im Scene Builder nur eine möglich.


Hast du schon mal mit den SceneBuilder gearbeitet? Wenn ja, könntest du mir evtl kurz zeigen wie das geht?


EDIT:

Kann es sein, dass man im Scene Builder nicht eine komplette Gui erstellen sollte? Bzw. Muss man jede Schicht, immer einzeln erstellen als einzelnes FXML, einschließlich seiner Componenten? Und am Schluss per Code dass alles zusammenfügt?

 

[dzim]

Ja, so wie du es im Edit beschreibst ist es.

Der Code ist der Glue - der Klebstoff - der die UIs zusammenbringt. Denke immer daran: Was hier mit den FXMLs verfolgt wird ist der Ansatz der deklarativen Oberflächen. Es geht nicht darum, Code obsolet zu machen, sondern die Oberfläche komplett von jeglicher Logik fern zu halten.

Daher meinte ich ja: Mach dir ein Schichtenmodell deiner Oberfläche. Der Controller der Schicht, die weitere Sub-UIs enthält, lädt dann mittels des FXMLLoader die anderen Dateien.

Wenn du deine UIs etwas weniger Code-lastig verbinden willst, könnte das DataFX-Framework interessant für dich sein, aber ich würde dir empfehlen, erst mal den Weg über den FXMLLoader zu gehen.

Der SceneBuilder ist am Ende dafür da ein FXML zu konstruieren - und wenn du einen Controller anbindest, es auch zu testen. Und nein, ich verwende nicht den SceneBuilder. Ich nutze unter Eclipse immer die DSL FXGraph, die zu FXML-Dateien kompiliert wird, sowie den gut integrierten JavaFX-Preview, der auch wunderbar die Controller anbinden kann (aus dem Plugin e(fx)clipse).

 

[dzim]

@Tom299:
Dass ist ein Stück weit dir überlassen.

Der Interface-Weg klingt gut, wird aber schnell unübersichtlich, wenn du eine tiefere Struktur als die von dir beschriebene hast.
Um ehrlich zu sein, bin ich hier auch noch nicht 100%ig endgültig sicher, was der beste Weg ist, obwohl ich auch schon etwas komplexere Projekte (aber auch nicht zu extrem) damit gemacht hab. Bisher war mein Weg, einen zentralen Event-Dispatcher zu verwenden. Den könnte man entweder aus einer Factory erhalten oder via DI (Guice, etc. oder Konstruktor - bei letzeren müsste man aber am FXMLLoader eine ControllerFactory angeben) in den Controller bringen.

Auf StackOverflow gibt es dazu bereits so einige Diskussionen:
dependency injection - Passing Parameters JavaFX FXML - Stack Overflow

(Bitte auch den Links mal folgen, einige sind interessant)

Fazit daraus in Kürze:
- kleine Applikationen: Es genügt, die Parameter beim FXMLLoader zu übergeben
- grössere: DI und/oder EventBus (meine Variante scheint also gar nicht so doof gewesen zu sein )

Bei Interesse kann ich ja mal meinen Event-Dispatcher posten, auch wenn er streng genommen noch ein paar Schwachstellen hat (keine Asynchronität; Listener zwar Parametrisiert, aber keine Unter-Parameter möglich (hab mir schon so wie er ist mit den Generics einen Knoten inst Hirn gemacht))...

 

[Tom299]

Also mir gefällt es eigentlich nicht so, wenn die Controller anfangen, FXMLs zu laden. Aber ok, ich habe noch nicht mit Templates gearbeitet (glaub das nennt man so oder ich verwechsel grad was), wo halt die einzelnen FXMLs (Templates) zusammengebaut werden.
Ich hab mir z.B. eine ScreenManager-Klasse erstellt, die sowas wie loadScreen und setScreen hat. Und jeder Controller hat bei mir 2 statische strings wo der ScreenName (quasi der Key zum Ansprechen in der ArrayList der Screens) und der FXML-Pfad drin steht. Damit melde ich meine Screens beim Manager an und kann sie so von jedem Controller aus laden/setzen.
Und über ein Interface, das meine Controller alle implementieren, wird der ScreenManager jedem Controller bekannt gemacht. Das Interface könnte man natürlich erweitern, um irgendwelche Logik zu steuern, aber ich hab das jetzt erst mal über eine globale Klasse gemacht mit statischen Variablen. Manchmal ist das einfach der schnellste und leichteste Weg

Mit DI hatte ich gestern auch was bei stackoverflow gefunden:
java - How to create multiple javafx controllers with different fxml files? - Stack Overflow
javafx 2 - How to bind controls across two fxml from the Main controller - Stack Overflow
beim 2. Link steht was mit ChildControllern und daß man sie über fx:include einbindet, habs aber noch nicht ausprobiert.

 

[dzim]

Child-Controller sind ziemlich praktisch, wenn man andere FXMLs included. Hab ich schon ein paar Mal verwendet und hier könnte dein Konzept des Interfaces recht praktisch sein. Generell finde ich aber, die machen nur Sinn, wenn sich da nichts mehr ändert. Ich habe an anderer Stelle auch nur leere Container, in die ich dann je nach bedarf verschiedene FXMLs einbinde - da wäre ein im parent-FXML statisch inkludiertes child-FXML eher unpraktisch.
Es kommt wie immer sehr stark auf den Einsatzzweck an.

 

[Tom299]

Ich hatte jetzt bei mir den Fall, daß ich auf allen Screens eine Statusleiste anzeige. Zuerst hab ich die StatusLeiste als eigenes FXML gebaut und dann auf alle anderen FXMLs kopiert (bottom). Konnte das auch im SceneBuilder als Template benutzen. Aber so richtig gewonnen hab ich dadurch nichts, da ja nur das FXML immer kopiert wird und man eine Änderung dann in allen Screens nachziehen muß und alle Controller muß man anfassen für die Status-Felder. Und z.B. eine Image-Resource will der SceneBuilder auch nicht im Template haben, da streikt er.

Jetzt habe ich daraus ein CustomControl gemacht (mit ein paar Anfangsschwierigkeiten). Das funktioniert auch soweit wunderbar. Änderungen am Control werden "automatisch" übernommen, wenn die JAR aktualisiert wird. So brauch ich nur noch mein CustomControl 1x auf alle Screens zu packen und muß am Layout dann nicht mehr auf allen Screens etwas nachziehen. Und in den Controllern gibts dann nur noch 1x @FXML für das Control selbst. Das Ansprechen der Status-Felder muß man dann natürlich noch in den Controllern machen, aber da kommt man eh nicht drum rum.
Die CustomControl-JAR kann man auch im SceneBuilder importieren und dann ganz normal wie andere Standard-Komponenten verwenden.

Was mich allerdings noch interessieren würde, ob es möglich wäre, beim CustomControl z.B. die ImageView "public" zu machen, sodaß ich im SceneBuilder die ImageView anklicken/ansprechen könnte und da z.B. eine Resource setzen könnte. Über den Code gehts natürlich mit einem Getter im CustomController für die ImageView. Aber fürs erste reicht mir das aus

Hier das Tutorial, mit dem ich mein CustomControl schließlich hinbekommen habe:
https://rterp.wordpress.com/2014/07/28/adding-custom-javafx-component-to-scene-builder-2-0-part-2/

 

[Ruzmanz]

Du möchtest eigene Properties definieren? Den Scene Builder nutze ich nicht ... sofern du dem Standard folgst, wird der Scene Builder die Properties wahrscheinlich automatisch hinzufügen. Hast du auch Getter / Setter / *Properties im Control erstellt?

So sieht das in meinem Projekt aus:

FXML:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.*?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.control.Button?>
<?import de.ruzman.newfx.control.IconButton?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.shape.Rectangle?>

<HBox xmlns:fx="http://javafx.com/fxml" alignment="CENTER" spacing="20">
	<IconButton fx:id="englishLanguageButton" text="%language.english">
		<icon>
			<ImageView>
				<image>
					<Image url="@englishFlag.png" />
				</image>
			</ImageView>
		</icon>
	</IconButton>
	<IconButton fx:id="germanLanguageButton" text="%language.german">
		<icon>
			<ImageView>
				<image>
					<Image url="@germanFlag.png" />
				</image>
			</ImageView>
		</icon>
	</IconButton>
</HBox>

public class IconButton extends Button {
	private ObjectProperty<Node> icon;

	public IconButton() {
		super();
	}

	public ObjectProperty<Node> iconProperty() {
		if (icon == null) {
			icon = new ObjectPropertyBase<Node>() {
				@Override
				public Object getBean() {
					return IconButton.this;
				}

				@Override
				public String getName() {
					return "icon";
				}
			};
		}
		return icon;
	}

	public void setIcon(Node icon) {
		iconProperty().setValue(icon);
	}

	public Node getIcon() {
		return icon == null ? null : icon.getValue();
	}
}

 

[Tom299]

Danke erst mal für das Code Snippet. Bin die ganze Zeit schon am probieren, aber ich bekomm es nicht hin. Hab zwar keine Fehlermeldung, aber das Image wird nicht geändert. Vielleicht siehst du einen Fehler in meinem Code?

Mein Custom Control:

public class StatusBar extends GridPane {
	
	//public static final Image imageBenutzerStatusBar = new Image("/icons/user.png");
	
	@FXML
	private GridPane ctrlStatusBar;
	@FXML
	private ImageView imgView;
	@FXML
	private Label lblStatusUser;
	@FXML
	private Label lblStatusText;
	@FXML
	private Label lblStatusServer;
	@FXML
	private Label lblStatusVersion;
	@FXML
	private Line lineSeparator;
	
	private ObjectProperty<Image> icon;
	
	
	public StatusBar() {
		FXMLLoader loader = new FXMLLoader(getClass().getResource("/fxml/StatusBar.fxml"));
		loader.setRoot(this);
		loader.setController(this);
		
		try {
			loader.load();
			Image imageBenutzerStatusBar = new Image(getClass().getResourceAsStream("/icons/user.png"));
			if (imageBenutzerStatusBar != null) {
				imgView.setImage(imageBenutzerStatusBar);
			}
			lineSeparator.endXProperty().bind(ctrlStatusBar.widthProperty());
		}
		catch (IOException ioe) {
			throw new RuntimeException(ioe);
		}
	}
	
	public GridPane getCtrlStatusBar() {
		return ctrlStatusBar;
	}
	
	public ImageView getImgView() {
		return imgView;
	}
	
	public Label getLblStatusUser() {
		return lblStatusUser;
	}
	
	public Label getLblStatusText() {
		return lblStatusText;
	}
	
	public Label getLblStatusServer() {
		return lblStatusServer;
	}
	
	public Label getLblStatusVersion() {
		return lblStatusVersion;
	}
	
	public Line getLineSeparator() {
		return lineSeparator;
	}
	
	public ObjectProperty<Image> iconProperty() {
		if (icon == null) {
			icon = new ObjectPropertyBase<Image>() {
				@Override
				public Object getBean() {
					return StatusBar.this;
				}
 
				@Override
				public String getName() {
					return "icon";
				}
			};
		}
		return icon;
	}
	
	public void setIcon(Image icon) {
		iconProperty().setValue(icon);
	}
 
	public Image getIcon() {
		return icon == null ? null : icon.getValue();
	}
}

FXML-Ausschnitt:

   <bottom>
      <StatusBar fx:id="statusBar" BorderPane.alignment="CENTER">
         <icon>
            <Image url="@../icons/16/dialog-error.png" />
         </icon>
      </StatusBar>
   </bottom>

Ich glaube, das Property weiß nicht, daß es das Image der ImageView ändern soll. Aber ich blick das grad nicht, wie ich das mitteilen kann. Du benutzt ja Node und in eine Node kann man ja alles einfügen. Ich würd gern direkt Image verwenden, da ich ja direkt das Image der ImageView setzen will. Oder geht das so nicht?

 

[Tom299]

Ah, kaum hab ich mein Problem beschrieben, ist mir die Lösung eingefallen

Ich muß natürlich set/get noch überschreiben und schon klappts:

	public ObjectProperty<Image> iconProperty() {
		if (icon == null) {
			icon = new ObjectPropertyBase<Image>() {
				@Override
				public Object getBean() {
					return StatusBar.this;
				}
 
				@Override
				public String getName() {
					return "icon";
				}
				
				@Override
				public void setValue(Image v) {
					imgView.setImage(v);
				}
				
				@Override
				public Image getValue() {
					return imgView.getImage();
				}
			};
		}
		return icon;
	}