public class Hello extends Application {
}
public static void main(String[] args) { Application.launch(args); }
アプリケーションスレッドの起動
@Override public void start(Stage stage) {
}
// コンテナ Group container = new Group(); // Scene Graph のルートを生成し、コンテナを貼る Scene scene = new Scene(container, 100, 20); stage.setScene(scene);
// ラベルを生成しコンテナに貼る Label label = new Label("Hello, World!"); container.getChildren().add(label); stage.show(); SceneGraph
はまりそうなところ
コンテナへの追加pane.add(comp);pane.getChildren().add(comp);
イベント リスナは1種類のみbutton.setOnAction( new EventHandler<ActionEvent>() { public void handle(ActionEvent event) { // イベント処理 }});
BindModel
View
Controller
Bind
// モデルDoubleProperty xProperty = new DoubleProperty();
Slider slider = new Slider(50, 300, 0);// モデルにスライダの値をバインドさせるxProperty.bind(slider.valueProperty());
Rectangle rect = new Rectangle(50, 10, 50, 30); // 四角の x座標にモデルをバインドさせるrect.xProperty().bind(xProperty);
シナリオで考えるマイグレーション
シナリオ 1 JavaFX in Swing
シナリオ 2 Swing to JavaFX w/o FXML
シナリオ 3 Swing to JavaFX w/ FXML
JFXPanelJFXPanel
Swing に貼れる JavaFX 部品JFXPanel にはシーングラフを記述
final JFXPanel fxPanel = new JFXPanel(); jframe.add(fxPanel);
Platform.runLater(new Runnable() { @Override public void run() { AnchorPane root = new AnchorPane(); Scene scene = new Scene(root); root.getChildren().add(new Button("JavaFX Button")); fxPanel.setScene(scene); } });
Swing EDT
JavaFX App Thread
Swing to JavaFX w/o FXML
Swing を JavaFX に書き換える
使い方がほとんど同じもの
やり方は違うが、概念は同じもの
使い方が違うもの
Label,Button,TextField, et al.
レイアウト
TableView,TreeView,ListView
Swing
JavaFX
Button
JButton = new JButton(”Swing”);
button.addActionListener(new ActionListener() { @Override public void actionPerformed(new ActionEvent event) { // イベント処理 } });
Button = new Button(”JavaFX”);
button.setOnAction(new EventHandler<ActionEvent>() { @Override public void handle(ActionEvent event) { // イベント処理 } });
LayoutLayout
Swing: コンテナ + レイアウトマネージャ
JPanel panel = new JPanel();panel.setLayout(new BorderLayout());
panel.add(comp, BorderLayout.CENTER);
JavaFX: コンテナがレイアウトを含む
BorderPane pane = new BorderPane();
pane.setCenter(comp);
TableTableSwing: TableModelJavaFX: Bean を Column にバインド
class Student { ...... } // Java Bean
TableView<Student> table = new TableView<>();
TableColumn col1 = new TableColumn("Name");col1.setCellValueFactory( new PropertyValueFactory<Student, String>("name"));TableColumn col2 = new TableColumn("Grad Year");col2.setCellValueFactory( new PropertyValueFactory<Student, Integer>("gradYear"));
table.setItems(students);table.getColumns().addAll(col1, col2);
class Student { ...... } // Java Bean
TableView<Student> table = new TableView<>();
TableColumn col1 = new TableColumn("Name");col1.setCellValueFactory( new PropertyValueFactory<Student, String>("name"));TableColumn col2 = new TableColumn("Grad Year");col2.setCellValueFactory( new PropertyValueFactory<Student, Integer>("gradYear"));
table.setItems(students);table.getColumns().addAll(col1, col2);
<AnchorPane prefHeight="400.0" prefWidth="600.0"> <children> <HBox alignment="CENTER" prefHeight="50.0" prefWidth="572.0" spacing="20.0"> <children> <TextField prefWidth="200.0" style="-fx-font-size: 24;" /> <Button style="-fx-font-size: 24;" text="Load" /> </children> </HBox> <WebView prefHeight="302.0" prefWidth="572.0" /> </children></AnchorPane>
<AnchorPane prefHeight="400.0" prefWidth="600.0"> <children> <HBox alignment="CENTER" prefHeight="50.0" prefWidth="572.0" spacing="20.0"> <children> <TextField prefWidth="200.0" style="-fx-font-size: 24;" /> <Button style="-fx-font-size: 24;" text="Load" /> </children> </HBox> <WebView prefHeight="302.0" prefWidth="572.0" /> </children></AnchorPane>
<AnchorPane prefHeight="400.0" prefWidth="600.0"> <children> <HBox alignment="CENTER" prefHeight="50.0" prefWidth="572.0" spacing="20.0"> <children> <TextField prefWidth="200.0" style="-fx-font-size: 24;" /> <Button style="-fx-font-size: 24;" text="Load" /> </children> </HBox> <WebView prefHeight="302.0" prefWidth="572.0" /> </children></AnchorPane>
<AnchorPane prefHeight="400.0" prefWidth="600.0"> <children> <HBox alignment="CENTER" prefHeight="50.0" prefWidth="572.0" spacing="20.0"> <children> <TextField prefWidth="200.0" style="-fx-font-size: 24;" /> <Button style="-fx-font-size: 24;" text="Load" /> </children> </HBox> <WebView prefHeight="302.0" prefWidth="572.0" /> </children></AnchorPane>
AnchorPane pane = FXMLLoader.load( this.getClass().getResource("browser.fxml"));
<AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="contents.BrowserController"> <children> <HBox> <children> <TextField fx:id="textfield" /> <Button onAction="#handleAction" /> </children> </HBox> <WebView fx:id="webview" /> </children></AnchorPane>
<AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="contents.BrowserController"> <children> <HBox> <children> <TextField fx:id="textfield" /> <Button onAction="#handleAction" /> </children> </HBox> <WebView fx:id="webview" /> </children></AnchorPane>
<AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="contents.BrowserController"> <children> <HBox> <children> <TextField fx:id="textfield" /> <Button onAction="#handleAction" /> </children> </HBox> <WebView fx:id="webview" /> </children></AnchorPane>
public class BrowserController implements Initializable { @FXML private TextField textfield; @FXML private WebView webview; private WebEngine engine; @FXML public void handleAction(ActionEvent event) { engine.load(textfield.getText()); } @Override public void initialize(URL url, ResourceBundle rb) { engine = webview.getEngine(); } }
public class BrowserController implements Initializable { @FXML private TextField textfield; @FXML private WebView webview; private WebEngine engine; @FXML public void handleAction(ActionEvent event) { engine.load(textfield.getText()); } @Override public void initialize(URL url, ResourceBundle rb) { engine = webview.getEngine(); } }
Conclusion
マイグレーション 3 つのシナリオ
Component ベースなら それほど違いはないFXML
今日やらなかったことCSS, Animaction, EffectShape, 非同期処理
Top Related