¿Es posible importar un JAR que contenga un control JavaFX personalizado en Scene Builder?
Estaba trabajando en un escenario cuando noté que prácticamente tenía exactamente lo mismo tres veces. En lugar de eso (ya que odio eso), decidí tomar lo que tenía esas 3 veces y convertirlo en un componente personalizado.
Ahora sé que puedo agregarlo en el código, pero no puedo predecir el comportamiento del diseño (dos de estos irán directamente a las pestañas y el tercero irá a un panel de cuadrícula).
Intenté importar el .jar que contenía el control en Scene Builder. Apareció un cuadro de diálogo preguntándome qué en el JAR quería importar pero estaba completamente vacío.
He visto antes que algunas personas han agregado "controles personalizados" (un término que utilizo libremente) solo para descubrir que, básicamente, solo descarga un montón de componentes para formar el control. Eso puede funcionar para algunas personas, pero no estoy buscando eso. Para aclarar
lo que SI quiero (si buscara en el código FXML):
<DGCSDefiner //other layout related XML code/>
lo que NO quiero:
<GridPane //bla bla XML layout code>
<columnConstraints>
//bla bla column constraint stuff
</columnConstraints>
//etc, etc
</GridPane>
es posible? Estoy saliendo de C # y VS2010 nuevamente y estoy un poco mimado cuando se trata de controles personalizados, así que si es posible hacer que algo así suceda, ¿alguien puede decirme cómo?
¿Es posible importar un archivo JAR compilado que contenga un control JavaFX personalizado en Scene Builder, de modo que dejarlo caer desde la biblioteca resulte en lo que describí allí?
EDITAR 1 Bien, esto es lo que tengo en mi archivo FXML. De acuerdo con mlody991, necesito 3 archivos para que esto funcione: El archivo FXML (construido con SceneBuilder):
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<fx:root alignment="CENTER" hgap="5.0" styleClass="root" stylesheets="@DGCSDefiner.css" type="GridPane" vgap="5.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="DGCSDefiner.DGCSDefinerController">
<children>
<ComboBox fx:id="cbxColorStyle" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefWidth="150.0" promptText="Select Background Color Style" />
<ColorPicker fx:id="cpSolidColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="32.0" prefWidth="283.0" visible="false" GridPane.rowIndex="1" />
<StackPane fx:id="spSettings" styleClass="Group" GridPane.rowIndex="2" GridPane.vgrow="NEVER">
<children>
<GridPane fx:id="gpLinearSettings" hgap="5.0" styleClass="Group" vgap="20.0" visible="false">
<children>
<Label text="Angle" GridPane.halignment="RIGHT" GridPane.valignment="CENTER">
<font>
<Font name="Arial" size="12.0" />
</font>
</Label>
<ComboBox fx:id="cbxLinearAngle" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefWidth="150.0" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.valignment="CENTER" />
<Label text="1st Color" GridPane.halignment="RIGHT" GridPane.rowIndex="1" />
<ColorPicker fx:id="cpFirstLinearColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="CENTER" />
<Label text="2nd Color" GridPane.halignment="RIGHT" GridPane.rowIndex="2" />
<ColorPicker fx:id="cpSecondLinearColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2" GridPane.valignment="CENTER" GridPane.vgrow="ALWAYS" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="NEVER" />
<RowConstraints minHeight="10.0" vgrow="NEVER" />
<RowConstraints minHeight="10.0" vgrow="NEVER" />
</rowConstraints>
</GridPane>
<TabPane fx:id="tabRadialSettings" styleClass="Group" tabClosingPolicy="UNAVAILABLE" visible="false">
<tabs>
<Tab closable="false" text="Colors">
<content>
<GridPane hgap="5.0" styleClass="Group" vgap="5.0">
<children>
<Label maxHeight="1.7976931348623157E308" text="1st Color" GridPane.vgrow="NEVER" />
<ColorPicker fx:id="cpFirstRadialColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.vgrow="NEVER" />
<Label maxHeight="1.7976931348623157E308" text="2nd Color" GridPane.rowIndex="1" GridPane.vgrow="NEVER" />
<ColorPicker fx:id="cpSecondRadialColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.rowIndex="1" GridPane.vgrow="NEVER" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="NEVER" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</content>
</Tab>
<Tab closable="false" text="Size and Position">
<content>
<GridPane hgap="5.0" styleClass="Group" vgap="5.0">
<children>
<Label text="H Position" />
<Label text="V Position" GridPane.rowIndex="1" />
<Label text="Radius" GridPane.rowIndex="2" />
<Slider fx:id="sliderHPos" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" GridPane.columnIndex="1" />
<Slider fx:id="sliderVPos" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" value="1.0" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<Slider fx:id="sliderRadius" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" value="1.0" GridPane.columnIndex="1" GridPane.rowIndex="2" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="NEVER" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</content>
</Tab>
</tabs>
</TabPane>
</children>
</StackPane>
</children>
<columnConstraints>
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="ALWAYS" />
</rowConstraints>
</fx:root>
El archivo de clase Java (que representará el objeto real en el código):
package DGCSDefiner;
import java.io.IOException;
import static java.util.Arrays.asList;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.control.ColorPicker;
import javafx.scene.control.ComboBox;
import javafx.scene.control.Slider;
import javafx.scene.control.TabPane;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
public class DGCSDefiner extends Pane { //DigiGames Color Settings Definer.
// Values injected by FXMLLoader
//<editor-fold defaultstate="collapsed" desc="FXML Variables">
//<editor-fold defaultstate="collapsed" desc="Containers">
@FXML private GridPane gpLinearSettings; // fx:id="gpLinearSettings"
@FXML private StackPane spSettings; // fx:id="spSettings"
@FXML private TabPane tabsRadialSettings; // fx:id="tabRadialSettings"
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="Color Pickers">
@FXML private ColorPicker cpSolidColor, // fx:id="cpSolidColor"
cpFirstLinearColor, // fx:id="cpFirstLinearColor"
cpSecondLinearColor, // fx:id="cpSecondLinearColor"
cpFirstRadialColor, // fx:id="cpFirstRadialColor"
cpSecondRadialColor; // fx:id="cpSecondRadialColor"
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="Combo Boxes">
@FXML private ComboBox<ColorStyles> cbxColorStyle; // fx:id="cbxColorStyle"
@FXML private ComboBox<Integer> cbxLinearAngle; // fx:id="cbxLinearAngle"
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="Sliders">
@FXMLprivate Slider sliderRadius, // fx:id="sliderRadius"
sliderHPos, // fx:id="sliderHPos"
sliderVPos; // fx:id="sliderVPos"
//</editor-fold>
//</editor-fold>
private FXMLLoader Loader;
@FXML // This method is called by the FXMLLoader when initialization is complete
void initialize() {
//<editor-fold defaultstate="collapsed" desc="Assertions">
//<editor-fold defaultstate="collapsed" desc="Container Assertions">
assert this.gpLinearSettings != null : "fx:id=\"gpLinearSettings\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.spSettings != null : "fx:id=\"spSettings\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.tabsRadialSettings != null : "fx:id=\"tabsRadialSettings\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="ColorPicker Assertions">
assert this.cpSolidColor != null : "fx:id=\"cpSolidColor\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.cpFirstLinearColor != null : "fx:id=\"cpFirstLinearColor\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.cpSecondLinearColor != null : "fx:id=\"cpSecondLinearColor\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.cpFirstRadialColor != null : "fx:id=\"cpFirstRadialColor\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.cpSecondRadialColor != null : "fx:id=\"cpSecondRadialColor\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="ComboBox Assertions">
assert this.cbxColorStyle != null : "fx:id=\"cbxColorStyle\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.cbxLinearAngle != null : "fx:id=\"cbxLinearAngle\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="Slider Assertions">
assert this.sliderRadius != null : "fx:id=\"sliderRadius\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.sliderHPos != null : "fx:id=\"sliderHPos\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
assert this.sliderVPos != null : "fx:id=\"sliderVPos\" was not injected: check your FXML file 'JFXMLColorStyleDefiner.fxml'.";
//</editor-fold>
//</editor-fold>
//<editor-fold defaultstate="collapsed" desc="Initializations">
//<editor-fold defaultstate="collapsed" desc="ComboBox Initializations">
this.cbxColorStyle.getItems().addAll(
asList(ColorStyles.values())
);
for (int x = 0; x < 8; x++)
this.cbxLinearAngle.getItems().add(x * 45);
this.cbxColorStyle.setOnAction(event -> {
ColorStyles CS = this.cbxColorStyle.getValue();
this.cpSolidColor.setVisible(CS == ColorStyles.SOLID);
this.gpLinearSettings.setVisible(CS == ColorStyles.LINEAR);
this.tabsRadialSettings.setVisible(CS == ColorStyles.RADIAL);
});
//</editor-fold>
this.Loader = new FXMLLoader(
this.getClass().getResource("DGCSDefiner.fxml")
);
this.Loader.setRoot(this);
this.Loader.setController(this);
//</editor-fold>
}
public DGCSDefiner(){
try{ this.Loader.load(); }
catch(IOException e){ throw new RuntimeException(e); }
}
/**
* Get the ColorSettings defined by the control.
* @return Defined Color Settings.
*/
public ColorSettings getColorSettings(){
if (this.cbxColorStyle.getSelectionModel().getSelectedIndex() < 0)
return null;
switch(this.cbxColorStyle.getValue()){
case SOLID:
return new ColorSettings(this.cpSolidColor.getValue());
case LINEAR:
return new ColorSettings(
this.cpFirstLinearColor.getValue(),
this.cpSecondLinearColor.getValue(),
this.cbxLinearAngle.getValue()
);
case RADIAL:
return new ColorSettings(
this.cpFirstRadialColor.getValue(),
this.cpSecondRadialColor.getValue(),
(int)this.sliderRadius.getValue(),
(int)this.sliderHPos.getValue(),
(int)this.sliderVPos.getValue()
);
}
return null; //This should never happen.
}
/**
* Load defined color settings.
* @param cs Predefined color settings.
*/
public void setColorSettings(ColorSettings cs){
this.cbxColorStyle.setValue(cs.Style);
switch(cs.Style){
case SOLID:
this.cpSolidColor.setValue(cs.clrPrimary);
break;
case LINEAR:
this.cbxLinearAngle.setValue(cs.intAngle);
this.cpFirstLinearColor.setValue(cs.clrPrimary);
this.cpSecondLinearColor.setValue(cs.clrSecondary);
break;
case RADIAL:
this.sliderRadius.setValue(cs.intSize);
this.sliderHPos.setValue(cs.intHPos);
this.sliderVPos.setValue(cs.intVPos);
this.cpFirstRadialColor.setValue(cs.clrPrimary);
this.cpSecondRadialColor.setValue(cs.clrSecondary);
}
}
}
Y luego este último archivo, cuyo propósito me elude:
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
package DGCSDefiner;
import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.Initializable;
/**
*
* @author Will
*/
public class DGCSDefinerController implements Initializable {
@Override
public void initialize(URL location, ResourceBundle resources) {
}
}
¿Es posible que alguien me explique el propósito de este último archivo? ¿Cuál es su función? Puedo ver en el código de ejemplo con el que se me proporcionó que se configuró como el controlador FXML, pero eso todavía no me dice nada. Nunca antes había configurado un controlador FXML ya que normalmente lo hago en código, entonces, ¿es explícitamente importante hacer que este control se pueda importar al Scene Builder?
EDITAR 2 Bueno. Tuve un presentimiento y resultó correcto, pero no ayudó. Eliminé la referencia de la hoja de estilo CSS de control y me permitió agregar el control, no hay problema.
Sin embargo, cuando lo dejé caer, esto fue lo que sucedió en el archivo FXML:
Pasó de esto (solo se muestra la porción relevante):
<Tab fx:id="tabBGStyle" closable="false" text="Background" />
a esto:
<Tab fx:id="tabBGStyle" closable="false" text="Background">
<content>
<GridPane alignment="CENTER" hgap="5.0" styleClass="root" vgap="5.0">
<children>
<ComboBox fx:id="cbxColorStyle" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefWidth="150.0" promptText="Select Background Color Style" />
<ColorPicker fx:id="cpSolidColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="32.0" prefWidth="283.0" visible="false" GridPane.rowIndex="1" />
<StackPane fx:id="spSettings" styleClass="Group" GridPane.rowIndex="2" GridPane.vgrow="NEVER">
<children>
<GridPane fx:id="gpLinearSettings" hgap="5.0" styleClass="Group" vgap="20.0" visible="false">
<children>
<Label text="Angle" GridPane.halignment="RIGHT" GridPane.valignment="CENTER">
<font>
<Font name="Arial" size="12.0" />
</font>
</Label>
<ComboBox fx:id="cbxLinearAngle" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefWidth="150.0" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.valignment="CENTER" />
<Label text="1st Color" GridPane.halignment="RIGHT" GridPane.rowIndex="1" />
<ColorPicker fx:id="cpFirstLinearColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="CENTER" />
<Label text="2nd Color" GridPane.halignment="RIGHT" GridPane.rowIndex="2" />
<ColorPicker fx:id="cpSecondLinearColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2" GridPane.valignment="CENTER" GridPane.vgrow="ALWAYS" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="NEVER" />
<RowConstraints minHeight="10.0" vgrow="NEVER" />
<RowConstraints minHeight="10.0" vgrow="NEVER" />
</rowConstraints>
</GridPane>
<TabPane fx:id="tabRadialSettings" styleClass="Group" tabClosingPolicy="UNAVAILABLE" visible="false">
<tabs>
<Tab closable="false" text="Colors">
<content>
<GridPane hgap="5.0" styleClass="Group" vgap="5.0">
<children>
<Label maxHeight="1.7976931348623157E308" text="1st Color" GridPane.vgrow="NEVER" />
<ColorPicker fx:id="cpFirstRadialColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.vgrow="NEVER" />
<Label maxHeight="1.7976931348623157E308" text="2nd Color" GridPane.rowIndex="1" GridPane.vgrow="NEVER" />
<ColorPicker fx:id="cpSecondRadialColor" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="1" GridPane.rowIndex="1" GridPane.vgrow="NEVER" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="NEVER" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0"/>
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</content>
</Tab>
<Tab closable="false" text="Size and Position">
<content>
<GridPane hgap="5.0" styleClass="Group" vgap="5.0">
<children>
<Label text="H Position" />
<Label text="V Position" GridPane.rowIndex="1" />
<Label text="Radius" GridPane.rowIndex="2" />
<Slider fx:id="sliderHPos" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" GridPane.columnIndex="1" />
<Slider fx:id="sliderVPos" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" value="1.0" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<Slider fx:id="sliderRadius" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" min="1.0" showTickMarks="true" value="1.0" GridPane.columnIndex="1" GridPane.rowIndex="2" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="NEVER" minWidth="10.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</content>
</Tab>
</tabs>
</TabPane>
</children>
</StackPane>
</children>
<columnConstraints>
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" vgrow="ALWAYS" />
</rowConstraints>
</GridPane>
</content>
</Tab>
que es exactamente lo que yoNO QUIEREN.
Lo que me gustaría ver es algo en el sentido de esto:
<Tab fx:id="tabBGStyle" closable="false" text="Background">
<content>
<DGCSDefiner/>
</content>
</Tab>
en el código FXML después de arrastrar y soltar el control personalizado en el diseñador. ¿Es eso posible? ¿Necesito compilarlo en un frasco?
Editar 3 Para que quede un poco más claro,esta es exactamente lo que quiero ver que suceda. Esto se ve bien, pero el problema es que no hay información sobre cómo importar un control personalizado en Scene Builder, de modo que cuando lo arrastro y lo suelto en el lienzo, solo llego a algún lugar cercano a una sola línea de código, frente libro y medio está escribiendo (lo cual es una tontería. Si quisiera, podría hacerlo (y lo haría) yo mismo).