27
リッチクライアントのための UI 基盤

JavaFX 2.0 - リッチクライアントのためのUI基盤

  • Upload
    skrb

  • View
    12.989

  • Download
    5

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: JavaFX 2.0 - リッチクライアントのためのUI基盤

リッチクライアントのための UI 基盤

Page 2: JavaFX 2.0 - リッチクライアントのためのUI基盤

Agenda

なぜ Java?

Key Features

What is JavaFX 2.0

基本構造

Conclusion

Page 3: JavaFX 2.0 - リッチクライアントのためのUI基盤
Page 4: JavaFX 2.0 - リッチクライアントのためのUI基盤
Page 5: JavaFX 2.0 - リッチクライアントのためのUI基盤

JavaFX 2.0 UI API of Java by Java for Java

=

Page 6: JavaFX 2.0 - リッチクライアントのためのUI基盤

JavaFX 2.0 ?

Page 7: JavaFX 2.0 - リッチクライアントのためのUI基盤

JavaFX Script

for Applicationfor Making API

Page 8: JavaFX 2.0 - リッチクライアントのためのUI基盤
Page 9: JavaFX 2.0 - リッチクライアントのためのUI基盤

JavaFX for Java

Adv. JavaFX の開発スピード

パフォーマンス

JavaFX を使える言語

Page 10: JavaFX 2.0 - リッチクライアントのためのUI基盤

JavaFX for Java

Dis. 記述量

複雑さ

言語でサポートした機能

宣言 バインド トリガー

関数型 型推論 I18N

Page 11: JavaFX 2.0 - リッチクライアントのためのUI基盤

基本構造

Page 12: JavaFX 2.0 - リッチクライアントのためのUI基盤

基本構造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.setVisible(true); } public static void main(String[] args) { Application.launch(Hello.class, null); }}

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.setVisible(true); } public static void main(String[] args) { Application.launch(Hello.class, null); }}

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.setVisible(true); } public static void main(String[] args) { Application.launch(Hello.class, null); }}

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(); } public static void main(String[] args) { Application.launch(Hello.class, null); }}

SceneGraph

Page 13: JavaFX 2.0 - リッチクライアントのためのUI基盤

Stage

StageScene

Scene

VBox

VBox

HBox

HBox

TableView

TableView

Label

TextBox

Button

Page 14: JavaFX 2.0 - リッチクライアントのためのUI基盤

Node

Control Pane Shape

Page 15: JavaFX 2.0 - リッチクライアントのためのUI基盤

SceneGraph の表現

構造 手続き

宣言的文法

XML

手続き型言語

Page 16: JavaFX 2.0 - リッチクライアントのためのUI基盤

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>

Page 17: JavaFX 2.0 - リッチクライアントのためのUI基盤

MVC

Model

View

ControllerEvent

Observer Pattern

Page 18: JavaFX 2.0 - リッチクライアントのためのUI基盤

MVC

Model

View

Controller

Bind

Page 19: JavaFX 2.0 - リッチクライアントのためのUI基盤

MVC

Model

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);

Page 20: JavaFX 2.0 - リッチクライアントのためのUI基盤

Key Features

EffectEffect AppDesign

Page 21: JavaFX 2.0 - リッチクライアントのためのUI基盤

Animation

Page 22: JavaFX 2.0 - リッチクライアントのためのUI基盤

Effect

Page 23: JavaFX 2.0 - リッチクライアントのためのUI基盤

HTML5WebView view = new WebView();

WebEngine engine = view.getEngine();engine.load("http://google.com/");

Page 24: JavaFX 2.0 - リッチクライアントのためのUI基盤

Media

Media media = new Media(url);MediaPlayer player = new MediaPlayer(media);MediaView view = new MediaView(player);

player.play();

Page 25: JavaFX 2.0 - リッチクライアントのためのUI基盤

その他にも ...

Prism

非同期処理

JSONパーサー

Swing との連携

Page 26: JavaFX 2.0 - リッチクライアントのためのUI基盤

ConclusionJavaFX Script を捨てて ...

Desktop に集中JavaFX 1.x + αWebKit 付き

期待の新人 FXMLツール開発が促進 ?

リリース Q3Win Mac Linux

Page 27: JavaFX 2.0 - リッチクライアントのためのUI基盤

リッチクライアントのためのUI 基盤