JavaFX 2.0 への誘い
8 likes2,226 views
![SceneGraph の構築
public class Hello extends Application {
@Override
public void start(Stage stage) {
// コンテナ
Group container = new Group();
// シーングラフのルート要素を生成し、コンテナを貼る
Scene scene = new Scene(container, 100, 20);
stage.setScene(scene);
// ラベルを生成しコンテナに貼る
Label label = new Label("Hello, World!");
container.getChildren().add(label);
}
stage.show();
SceneGraph の構築
public static void main(String[] args) {
Application.launch(Hello.class, null);
}
}](https://image.slidesharecdn.com/jjugcccjavafx-111021064432-phpapp01/85/JavaFX-2-0-12-320.jpg)
JavaFX 2.0 への誘い
- 1. への誘い
- 2. Agenda Java の UI の歴史 JavaFX 2.0 UI General Purpose Conclusion
- 3. History
- 4. JDK/JRE AWT Swing JavaFX3.0 Java 2D Java SwingX JAI/ImageIO Java 3D LG3D JOGL SWT JavaFX2.0 Non-Java GWT F3 JavaFX
- 5. JavaFX 2.0 第 3 の Java の GUI ライブラリ 高性能レンダリングエンジン アニメーション / エフェクト JVM で動作する言語から利用可
- 6. JavaFX UI General Purpose SceneGraph
- 7. Stage Scene VBox HBox TableView Stage Scene VBox HBox Label TextBox Button TableView
- 8. Node Control Pane Shape
- 9. Node Control Pane Shape Web Media Chart
- 10. Web WebView view = new WebView(); WebEngine engine = view.getEngine(); engine.load("http://google.com/");
- 11. Media Media media = new Media(url); MediaPlayer player = new MediaPlayer(media); MediaView view = new MediaView(player); player.play();
- 12. SceneGraph の構築 public class Hello extends Application { @Override public void start(Stage stage) { // コンテナ Group container = new Group(); // シーングラフのルート要素を生成し、コンテナを貼る Scene scene = new Scene(container, 100, 20); stage.setScene(scene); // ラベルを生成しコンテナに貼る Label label = new Label("Hello, World!"); container.getChildren().add(label); } stage.show(); SceneGraph の構築 public static void main(String[] args) { Application.launch(Hello.class, null); } }
- 13. SceneGraph の構築 FXML <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <FlowPane xmlns:fx="http://javafx.com/fxml"> <children> <Label text="Label" /> <TextBox fx:id="textBox" text="TextBox" /> <Button fx:id="button" text="Button" /> </children> </FlowPane>
- 14. JavaFX UI General Purpose SceneGraph FXML Animation Node Effect CSS Control Region Shape Web Media Chart
- 15. Animation 自動補完
- 16. Animation
- 17. Effect Node image = ...; Node image = ...; GaussianBlur blur = new GaussianBlur(); DropShadow shdw= new DropShadow(); blur.setRadius(10.0); shdw.setOffsetX(5); shdw.setOffsetY(5); image.setEffect(blur); image.setEffect(shdw); Node image = ...; Node image = ...; image.setEffect(new Reflection()); image.setEffect(new SepiaTone());
- 18. CSS Scene scene = new Scene(container, 400, 100); // スタイルシートの設定 scene.getStylesheets().add("/style.css"); .button { .button { -fx-font: 24pt "SansSerif"; -fx-font: 16pt "SansSerif"; -fx-text-fill: #006666; -fx-text-fill: #00FF33; -fx-background-color: orange; -fx-background-color: #0066FF; -fx-border-radius: 20; -fx-border-radius: 0; -fx-background-radius: 20; -fx-background-radius: 0; -fx-padding: 5; -fx-padding: 20; } }
- 19. CSS Scene scene = new Scene(container, 400, 100); // スタイルシートの設定 scene.getStylesheets().add("/style.css"); .button { .button { -fx-font: 24pt "SansSerif"; -fx-font: 16pt "SansSerif"; -fx-text-fill: #006666; -fx-text-fill: #00FF33; -fx-background-color: orange; -fx-background-color: #0066FF; -fx-border-radius: 20; -fx-border-radius: 0; -fx-background-radius: 20; -fx-background-radius: 0; -fx-padding: 5; -fx-padding: 20; } }
- 20. JavaFX UI General Purpose SceneGraph FXML Property Async Animation Node Effect Bind Collection CSS Control Region Shape Web Media Chart
- 21. MVC View Observer Pattern Model Event Controller
- 22. MVC View Model Bind Controller // モデル 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);
- 23. JavaSE8 JavaFX OpenJDK UI General Purpose SceneGraph FXML Property Async Animation Node Effect Bind Collection CSS Tool Control Region Shape NetBeans 7.1 Scene Builder Web Media Chart デザイナ向けツールが ...
- 24. への誘い