ゆっちのBlog

2013

ImageGetter (JavaFX) での覚え書き

この前、JavaFX の学習がてらに創った ImageGetter というお遊びプログラムでの覚え書きです。

イメージを取得して画像を表示させる処理と、その画像を保存させる処理を書いておきます。

プログラム全体を載せようと思ったのですが無駄に長いのと JavaFX 初心者ということもあって間違ってるかもしれないので。(^_^;)

見たいって人がいれば暇をみつけてプログラム全体をアップするか考えます。

解説は無いですが何をしているか解るようにコメントをいれてあります。

    @FXML
    public void handleGet(ActionEvent event) {

        // イメージ取得時にこれらを非活性化する
        prpgressIndicator.setVisible(true);
        timeLimit.setDisable(true);
        getButton.setDisable(true);
        slider.setDisable(true);
        effectCombo.setDisable(true);
        saveButton.setDisable(true);
        file.setDisable(true);
        edit.setDisable(true);
        exit.setDisable(true);
        img.setDisable(true);
        imgUrl_1.setDisable(true);
        imgUrl_2.setDisable(true);
        imgUrl_3.setDisable(true);

        // Task クラスを使い Image を取得し、GUI を更新
        Task<Void> task = new Task<Void>() {

            // 戻り値なしの非同期処理 ( キャンセル処理は無し )
            @Override
            protected Void call() throws Exception {
                
                // ExecutorService 設定
                int procs = ManagementFactory.getOperatingSystemMXBean().getAvailableProcessors();
                if (procs > 1) {
                    procs = 2;
                }
                executor = Executors.newFixedThreadPool(procs);
                
                // CompletableFuture を使い Image を取得
                // works は、Image 取得クラスのインスタンス
                image = CompletableFuture.supplyAsync(() -> works.getImg(baseUrl, subUrl), executor);
                image.thenRun(() -> {
                });

                try {
                    target = image.get(limit, TimeUnit.SECONDS);
                } catch (InterruptedException | ExecutionException | TimeoutException ex) {
                    // Good catch! (In the latest Japan, it is an indispensable comment.)
                    Image temp;
                    if (limit < 5) {
                        temp = new Image(getClass().getResource("TimeOut.png").toString());
                    } else {
                        temp = new Image(getClass().getResource("out.png").toString());
                    }
                    image.complete(temp);
                }
                try {
                    target = image.get();
                } catch (InterruptedException | ExecutionException ex1) {
                    // Good catch! (In the latest Japan, it is an indispensable comment.)
                    Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex1);
                }

                // GUI 更新
                Platform.runLater(() -> {
                    imgView.setImage(target);
                    timeLimit.setDisable(false);
                    getButton.setDisable(false);
                    slider.setDisable(false);
                    effectCombo.setDisable(false);
                    saveButton.setDisable(false);
                    file.setDisable(false);
                    edit.setDisable(false);
                    exit.setDisable(false);
                    img.setDisable(false);
                    imgUrl_1.setDisable(false);
                    imgUrl_2.setDisable(false);
                    imgUrl_3.setDisable(false);
                    prpgressIndicator.setVisible(false);
                    Toolkit.getDefaultToolkit().beep();

                    // ExecutorService 止める
                    while (true) {
                        if (image.isDone()) {
                            executor.shutdown();
                        }
                        try {
                            if (!executor.awaitTermination(2, TimeUnit.SECONDS)) {
                                executor.shutdownNow();
                                break;
                            }
                        } catch (InterruptedException ex) {
                            // Good catch! (In the latest Japan, it is an indispensable comment.)
                            Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex);
                        }
                        break;
                    }

                });

                return null;
            }

        };

        new Thread(task).start();

    }

100

101

102

@FXML

public void handleGet(ActionEvent event) {

// イメージ取得時にこれらを非活性化する

prpgressIndicator.setVisible(true);

timeLimit.setDisable(true);

getButton.setDisable(true);

slider.setDisable(true);

effectCombo.setDisable(true);

saveButton.setDisable(true);

file.setDisable(true);

edit.setDisable(true);

exit.setDisable(true);

img.setDisable(true);

imgUrl_1.setDisable(true);

imgUrl_2.setDisable(true);

imgUrl_3.setDisable(true);

// Task クラスを使い Image を取得し、GUI を更新

Task<Void> task = new Task<Void>() {

// 戻り値なしの非同期処理 ( キャンセル処理は無し )

@Override

protected Void call() throws Exception {

// ExecutorService 設定

int procs = ManagementFactory.getOperatingSystemMXBean().getAvailableProcessors();

if (procs > 1) {

procs = 2;

}

executor = Executors.newFixedThreadPool(procs);

// CompletableFuture を使い Image を取得

// works は、Image 取得クラスのインスタンス

image = CompletableFuture.supplyAsync(() -> works.getImg(baseUrl, subUrl), executor);

image.thenRun(() -> {

});

try {

target = image.get(limit, TimeUnit.SECONDS);

} catch (InterruptedException | ExecutionException | TimeoutException ex) {

// Good catch! (In the latest Japan, it is an indispensable comment.)

Image temp;

if (limit < 5) {

temp = new Image(getClass().getResource("TimeOut.png").toString());

} else {

temp = new Image(getClass().getResource("out.png").toString());

}

image.complete(temp);

}

try {

target = image.get();

} catch (InterruptedException | ExecutionException ex1) {

// Good catch! (In the latest Japan, it is an indispensable comment.)

Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex1);

}

// GUI 更新

Platform.runLater(() -> {

imgView.setImage(target);

timeLimit.setDisable(false);

getButton.setDisable(false);

slider.setDisable(false);

effectCombo.setDisable(false);

saveButton.setDisable(false);

file.setDisable(false);

edit.setDisable(false);

exit.setDisable(false);

img.setDisable(false);

imgUrl_1.setDisable(false);

imgUrl_2.setDisable(false);

imgUrl_3.setDisable(false);

prpgressIndicator.setVisible(false);

Toolkit.getDefaultToolkit().beep();

// ExecutorService 止める

while (true) {

if (image.isDone()) {

executor.shutdown();

}

try {

if (!executor.awaitTermination(2, TimeUnit.SECONDS)) {

executor.shutdownNow();

break;

}

} catch (InterruptedException ex) {

// Good catch! (In the latest Japan, it is an indispensable comment.)

Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex);

}

break;

}

});

return null;

}

};

new Thread(task).start();

}

    @FXML
    public void handleSave(ActionEvent event) {

        // ImageView だけのスナップショット
        WritableImage writableImage = imgView.snapshot(null, null);

        // ファイルチューザ
        File outFile = fileChooser.showSaveDialog(null);
        // 保存
        if (outFile != null) {
            try {
                ImageIO.write(SwingFXUtils.fromFXImage(writableImage, null), "png", outFile);
            } catch (IOException ex) {
                Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex);
            }
        }

    }

@FXML

public void handleSave(ActionEvent event) {

// ImageView だけのスナップショット

WritableImage writableImage = imgView.snapshot(null, null);

// ファイルチューザ

File outFile = fileChooser.showSaveDialog(null);

// 保存

if (outFile != null) {

try {

ImageIO.write(SwingFXUtils.fromFXImage(writableImage, null), "png", outFile);

} catch (IOException ex) {

Logger.getLogger(FXMLDocumentController.class.getName()).log(Level.SEVERE, null, ex);

}

    @Override
    public void initialize(URL url, ResourceBundle rb) {

	................................................

        // ファイルチューザ
        fileChooser = new FileChooser();
        // タイトル
        fileChooser.setTitle("Save Image File");
        // フィルター
        fileChooser.getExtensionFilters()
                .addAll(new ExtensionFilter("Image Files", "*.png", "*.jpg", "*.gif"),
                new ExtensionFilter("All Files", "*.*"));
    }

@Override

public void initialize(URL url, ResourceBundle rb) {

................................................

// ファイルチューザ

fileChooser = new FileChooser();

// タイトル

fileChooser.setTitle("Save Image File");

// フィルター

fileChooser.getExtensionFilters()

.addAll(new ExtensionFilter("Image Files", "*.png", "*.jpg", "*.gif"),

new ExtensionFilter("All Files", "*.*"));

}

あと ImageView のサイズ調整に ImageGetter.java の starat メソッドに

        FXMLDocumentController.imgView.fitWidthProperty().bind(stage.widthProperty().multiply(0.75));
        FXMLDocumentController.imgView.fitHeightProperty().bind(stage.heightProperty().multiply(0.75));

1 2	FXMLDocumentController.imgView.fitWidthProperty().bind(stage.widthProperty().multiply(0.75)); FXMLDocumentController.imgView.fitHeightProperty().bind(stage.heightProperty().multiply(0.75));

としてます。

縮小率は適当です。（やってることも適当です）

こんなことしなくても良い方法があるかもしれませんが解らなかったので諦めてこうしました。(^_^;)

あと Dialog でも少しはまったのでそのことも書こうかと思ったのですが標準ライブラリでない無いからやめておきます。

なんで Dialog が標準ライブラリでないのか疑問ですがこの先どうなるのかまだ解らないですしね。

最後に、くどいようですが間違ってるかもしれないのでおかしなところがあれば笑って許してくださいね。(^_^)

Hatena タグ: JavaFX

TAGS: JavaFX | 2013年8月18日6:55 AM | Comment : 0

Image Getter の致命的欠陥を Fix.

JavaFX

昨日のエントリーで紹介した Image Getter ですけど致命的欠陥がありました。

動画をご覧になったか、Java Web Start で動かしてみた人はすぐに気付いたでしょう。

画像取得の待ち時間アプリがフリーズしているような振る舞いをしてます。

学習用のお遊びアプリだからいいやって思っていたのですが気になってしかたなくなり、やっつけで直しました。

非同期処理の実装と画像取得待ちの間、メニューの About 以外のものを非活性化させました。

ついでにプログレスインジケーターも付けてみました。

これで動いてる安心感がでますね。

この非活性化の部分は力技で実装してしまいましたが、JDK6 あたりからだったかな？まとめて非活性化させる方法があったような記憶があります。

ちょっと思い出せないのが残念ですけど JavaFX でもまとめて非活性化させる方法があると便利なんですけどね。

実は ITpro で櫻庭さんが執筆されている「JavaFX2 で始める GUI 開発」を参考に学習してます。

その櫻庭さんが Twitter で来月は非同期処理について執筆されることを教えていただきました。

今回のお遊びサンプルアプリでは戻り値は無しでした。

JavaFX2.2 の API ドキュメントのサンプルでは数種類のパターンが説明されてましたが何しろ英語なので良く解りません。(>_<｡)

来月の櫻庭さんの記事では GUI 開発で絶対に避けて通れない非同期処理を取り上げてくれるとのことで楽しみです！

でも、サンプルと同じようなイメージビューアを創るはずだったんですけど脱線してしまいこんなになって第4回からまだ読めてない。(ヲヒ

まぁ、楽しめているから良し！としよう。(^_^)

Fix した Image Getter の動画と Java Web Start を貼っておきますね～。

Webstart: click to launch this app as webstart （Java 8 実行環境必須）

Hatena タグ: JavaFX

TAGS: JavaFX | 2013年8月16日8:39 PM | Comment : 1

JavaFX 学習がてらにつまらないアプリをつくってしまった。

JavaFX

少し前から JavaFX を遊びながら学習しはじめたのですが情報が古い物から新しい物まであって何が何だか解らなくなります。

それだけ JavaFX は黒歴史なんだなぁって再認識しました。

それは置いといてどんなものを作ったかというと・・・

ついこの間はじめたばかりなのでネット上のサンプルを真似ていろいろ、あーでもない、こーでもない。。。

なんでこのコードで動かないの？

なんでこのコードで動くの？って状態でプログラムくんでます。(^_^;)

そんなこんなで創ったのは、あるサイトの画像を表示させるというプログラムです。

ついでに、1秒から5秒までのタイムリミット機能をつけてみました。

タイムアウト時にはデフォルト画像をお茶を濁す感じで表示させてみました。

無事に画像を表示させたらエフェクトをかけられるようにしました。

さらに、その画像を保存できるようにしてみました。

ただ、お遊びプログラムなので画像取得先サイトは3件だけです。

私の好みの女性タレント堀北真希さんと北川景子さんのブログから一枚取得するようにしました。

あと一つは 5秒以内で取得できない想定のために NASA です。

このプログラムではダミーで3秒のスリープをいれてあります。

以下にスクリーンショットと動画を貼っておきますね。

ちなみに最後の画像のダイアログはお遊びです。

普通はこんな問いかけはないですよね。

動画は仮想マシン上の Windows 8.1 で実行したものをキャプチャしたものなのでちょっと動作が緩慢になっています。

よ～く動画をみるとこのプログラムには致命的な欠点があることに気付きます。

学習用のお遊びサンプルとしては問題ないのですが・・・

そういう理由で今回はコードを晒しません。

そもそも学習し始めた初心者のコードに興味を持つ人はいないだろう。

動画が再生できない、もしくはこの欠陥アプリを使いたい人のために Java Web Start もおいときます。

Java 8 に依存している部分があるので Java 8 の実行環境でないと動かないです。

こちらは 0.5 秒のダミー（スリープ）をいれてあります。

Webstart: click to launch this app as webstart （Java 8 実行環境必須）

Hatena タグ: JavaFX

TAGS: JavaFX | 2013年8月15日7:57 PM | Comment : 0

JavaFX でさらに足し算のお勉強

JavaFX NetBeans

前回のプログラムを利用して今回も JavaFX で足し算アプリに手を加えてみることにしました。

今回追加する機能はアプリのウィンドウサイズの変更をできないようにする。

チェックボックスを利用して BGM を流せるようにする。

問題の難易度を選択できるようにトグルボタンを排他制御して可能にする。

ツールチップを設定する。

ニーモニックを設定する。

結局、こんな感じにできあがりました。

トグルボタンは私の実力ではニーモニックを正しく動作させることができなかったので諦めました。(>_<｡)

素直にラジオボタンを使えばよかったかも・・・

トグルボタンの排他制御のイベント処理はかなり怪しいことをしています。

我ながらこれは無いだろうと思いながら他に良い方法を知らないので動けばいいやってのりでやってます。（オヒ

だからニーモニックが・・・・・　とどのつまりラジオボタンを使おう、今度からは。

いちおう、なんとか動いたので良しとしました。(^_^;)

それではそんなこんなでいい加減ですがプログラムを晒しておきます。

package jp.yucchi.calc;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Calc2 extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("CalcForm.fxml"));

        Scene scene = new Scene(root);

        stage.setTitle("足し算できますか？");
        stage.setScene(scene);
        stage.setResizable(false);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

package jp.yucchi.calc;

import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Parent;

import javafx.scene.Scene;

import javafx.stage.Stage;

public class Calc2 extends Application {

@Override

public void start(Stage stage) throws Exception {

Parent root = FXMLLoader.load(getClass().getResource("CalcForm.fxml"));

Scene scene = new Scene(root);

stage.setTitle("足し算できますか？");

stage.setScene(scene);

stage.setResizable(false);

stage.show();

}

public static void main(String[] args) {

launch(args);

}

package jp.yucchi.calc;

import java.awt.Toolkit;
import static java.lang.Integer.parseInt;
import java.net.URL;
import java.util.Random;
import java.util.ResourceBundle;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.CheckBox;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToggleGroup;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;

public class CalcFormController implements Initializable {

    private int x;
    private int y;
    private int resultAnswer;
    private int modeNumber = 99;

    Random rnd = new Random();

    private final Media start = new Media(getClass().getResource("start.mp3").toExternalForm());
    private final Media ok = new Media(getClass().getResource("ok.mp3").toExternalForm());
    private final Media ng = new Media(getClass().getResource("ng.mp3").toExternalForm());
    private final Media bgm = new Media(getClass().getResource("bgm.mp3").toExternalForm());
    private final Media m_easy = new Media(getClass().getResource("easy.mp3").toExternalForm());
    private final Media m_normal = new Media(getClass().getResource("normal.mp3").toExternalForm());
    private final Media m_hard = new Media(getClass().getResource("hard.mp3").toExternalForm());

    @FXML
    private Label questionLabel;

    @FXML
    private TextField answerField;

    @FXML
    private Label resultLabel;

    @FXML
    CheckBox bgmCheck;

    @FXML
    ToggleGroup mode;

    @FXML
    ToggleButton easy;

    @FXML
    ToggleButton normal;

    @FXML
    ToggleButton hard;

    @FXML
    public void handleAnswer(ActionEvent event) {

        Pattern intPattern = Pattern.compile("[0-9]+");
        Matcher match = intPattern.matcher(answerField.getText());

        if (match.matches() != false || answerField.getText().isEmpty()) {
        } else {
            resultLabel.setText("数値を入力してね！");
            Toolkit.getDefaultToolkit().beep();
        }
        if (answerField.getText().isEmpty()) {
            resultLabel.setText("答えを入力してね！");
            Toolkit.getDefaultToolkit().beep();
        } else {
            boolean result = calc(answerField.getText());
            if (result) {
                resultLabel.setText("正解！");
                MediaPlayer mp_ok = new MediaPlayer(ok);
                mp_ok.play();
            } else {
                resultLabel.setText("不正解！");
                MediaPlayer mp_ng = new MediaPlayer(ng);
                mp_ng.play();
            }
        }
    }

    @FXML
    public void handleClear(ActionEvent event) {
        answerField.clear();
        resultLabel.setText(null);
        x = rnd.nextInt(modeNumber) + 1;
        y = rnd.nextInt(modeNumber) + 1;
        resultAnswer = x + y;
        questionLabel.setText(" " + x + " + " + y + " = ");
    }

    @FXML
    public void handleEasy(ActionEvent event) {
        if (easy.isSelected()) {
            modeNumber = 99;
            answerField.clear();
            resultLabel.setText(null);
            x = rnd.nextInt(modeNumber) + 1;
            y = rnd.nextInt(modeNumber) + 1;
            resultAnswer = x + y;
            questionLabel.setText(" " + x + " + " + y + " = ");
            MediaPlayer mp_easy = new MediaPlayer(m_easy);
            mp_easy.play();
        } else {
            easy.setSelected(true);
        }
    }

    @FXML
    public void handleNormal(ActionEvent event) {
        if (normal.isSelected()) {
            modeNumber = 999;
            answerField.clear();
            resultLabel.setText(null);
            x = rnd.nextInt(modeNumber) + 1;
            y = rnd.nextInt(modeNumber) + 1;
            resultAnswer = x + y;
            questionLabel.setText(" " + x + " + " + y + " = ");
            MediaPlayer mp_normal = new MediaPlayer(m_normal);
            mp_normal.play();
        } else {
            normal.setSelected(true);
        }
    }

    @FXML
    public void handleHard(ActionEvent event) {
        if (hard.isSelected()) {
            modeNumber = 99999;
            answerField.clear();
            resultLabel.setText(null);
            x = rnd.nextInt(modeNumber) + 1;
            y = rnd.nextInt(modeNumber) + 1;
            resultAnswer = x + y;
            questionLabel.setText(" " + x + " + " + y + " = ");
            MediaPlayer mp_hard = new MediaPlayer(m_hard);
            mp_hard.play();
        } else {
            hard.setSelected(true);
        }
    }

    @Override
    public void initialize(URL url, ResourceBundle rb) {

        x = rnd.nextInt(modeNumber) + 1;
        y = rnd.nextInt(modeNumber) + 1;
        resultAnswer = x + y;
        questionLabel.setText(" " + x + " + " + y + " = ");
        MediaPlayer mp_start = new MediaPlayer(start);
        mp_start.play();

        bgmCheck.selectedProperty().addListener(new ChangeListener<Boolean>() {
            MediaPlayer mp_bgm;

            @Override
            public void changed(ObservableValue<? extends Boolean> ov, Boolean oldVal, Boolean newVal) {
                if (newVal.booleanValue()) {
                    mp_bgm = new MediaPlayer(bgm);
                    mp_bgm.setVolume(0.07);
                    mp_bgm.play();
                    mp_bgm.setCycleCount(MediaPlayer.INDEFINITE);
                } else {
                    mp_bgm.stop();
                }
            }

        });

    }

    private boolean calc(String ans) {
        int answer = parseInt(ans);
        return answer == resultAnswer;
    }

}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

package jp.yucchi.calc;

import java.awt.Toolkit;

import static java.lang.Integer.parseInt;

import java.net.URL;

import java.util.Random;

import java.util.ResourceBundle;

import java.util.regex.Matcher;

import java.util.regex.Pattern;

import javafx.beans.value.ChangeListener;

import javafx.beans.value.ObservableValue;

import javafx.event.ActionEvent;

import javafx.fxml.FXML;

import javafx.fxml.Initializable;

import javafx.scene.control.CheckBox;

import javafx.scene.control.Label;

import javafx.scene.control.TextField;

import javafx.scene.control.ToggleButton;

import javafx.scene.control.ToggleGroup;

import javafx.scene.media.Media;

import javafx.scene.media.MediaPlayer;

public class CalcFormController implements Initializable {

private int x;

private int y;

private int resultAnswer;

private int modeNumber = 99;

Random rnd = new Random();

private final Media start = new Media(getClass().getResource("start.mp3").toExternalForm());

private final Media ok = new Media(getClass().getResource("ok.mp3").toExternalForm());

private final Media ng = new Media(getClass().getResource("ng.mp3").toExternalForm());

private final Media bgm = new Media(getClass().getResource("bgm.mp3").toExternalForm());

private final Media m_easy = new Media(getClass().getResource("easy.mp3").toExternalForm());

private final Media m_normal = new Media(getClass().getResource("normal.mp3").toExternalForm());

private final Media m_hard = new Media(getClass().getResource("hard.mp3").toExternalForm());

@FXML

private Label questionLabel;

@FXML

private TextField answerField;

@FXML

private Label resultLabel;

@FXML

CheckBox bgmCheck;

@FXML

ToggleGroup mode;

@FXML

ToggleButton easy;

@FXML

ToggleButton normal;

@FXML

ToggleButton hard;

@FXML

public void handleAnswer(ActionEvent event) {

Pattern intPattern = Pattern.compile("[0-9]+");

Matcher match = intPattern.matcher(answerField.getText());

if (match.matches() != false || answerField.getText().isEmpty()) {

} else {

resultLabel.setText("数値を入力してね！");

Toolkit.getDefaultToolkit().beep();

}

if (answerField.getText().isEmpty()) {

resultLabel.setText("答えを入力してね！");

Toolkit.getDefaultToolkit().beep();

} else {

boolean result = calc(answerField.getText());

if (result) {

resultLabel.setText("正解！");

MediaPlayer mp_ok = new MediaPlayer(ok);

mp_ok.play();

} else {

resultLabel.setText("不正解！");

MediaPlayer mp_ng = new MediaPlayer(ng);

mp_ng.play();

}

@FXML

public void handleClear(ActionEvent event) {

answerField.clear();

resultLabel.setText(null);

x = rnd.nextInt(modeNumber) + 1;

y = rnd.nextInt(modeNumber) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

}

@FXML

public void handleEasy(ActionEvent event) {

if (easy.isSelected()) {

modeNumber = 99;

answerField.clear();

resultLabel.setText(null);

x = rnd.nextInt(modeNumber) + 1;

y = rnd.nextInt(modeNumber) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

MediaPlayer mp_easy = new MediaPlayer(m_easy);

mp_easy.play();

} else {

easy.setSelected(true);

}

@FXML

public void handleNormal(ActionEvent event) {

if (normal.isSelected()) {

modeNumber = 999;

answerField.clear();

resultLabel.setText(null);

x = rnd.nextInt(modeNumber) + 1;

y = rnd.nextInt(modeNumber) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

MediaPlayer mp_normal = new MediaPlayer(m_normal);

mp_normal.play();

} else {

normal.setSelected(true);

}

@FXML

public void handleHard(ActionEvent event) {

if (hard.isSelected()) {

modeNumber = 99999;

answerField.clear();

resultLabel.setText(null);

x = rnd.nextInt(modeNumber) + 1;

y = rnd.nextInt(modeNumber) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

MediaPlayer mp_hard = new MediaPlayer(m_hard);

mp_hard.play();

} else {

hard.setSelected(true);

}

@Override

public void initialize(URL url, ResourceBundle rb) {

x = rnd.nextInt(modeNumber) + 1;

y = rnd.nextInt(modeNumber) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

MediaPlayer mp_start = new MediaPlayer(start);

mp_start.play();

bgmCheck.selectedProperty().addListener(new ChangeListener<Boolean>() {

MediaPlayer mp_bgm;

@Override

public void changed(ObservableValue<? extends Boolean> ov, Boolean oldVal, Boolean newVal) {

if (newVal.booleanValue()) {

mp_bgm = new MediaPlayer(bgm);

mp_bgm.setVolume(0.07);

mp_bgm.play();

mp_bgm.setCycleCount(MediaPlayer.INDEFINITE);

} else {

mp_bgm.stop();

}

});

}

private boolean calc(String ans) {

int answer = parseInt(ans);

return answer == resultAnswer;

}

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane" maxHeight="-1.0" maxWidth="-1.0" minHeight="160.0" minWidth="320.0" 
            prefHeight="160.0" prefWidth="320.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" 
            fx:controller="jp.yucchi.calc.CalcFormController">
  <children>
    <VBox prefHeight="-1.0" prefWidth="-1.0" AnchorPane.bottomAnchor="12.0" AnchorPane.leftAnchor="12.0" 
          AnchorPane.rightAnchor="12.0" AnchorPane.topAnchor="12.0">
      <children>
        <AnchorPane prefHeight="47.0" prefWidth="-1.0">
          <children>
            <Label fx:id="questionLabel" prefHeight="30.0" prefWidth="184.0" text="" 
                   AnchorPane.leftAnchor="5.0" AnchorPane.topAnchor="10.0">
              <font>
                <Font size="16.0" fx:id="x1" />
              </font>
            </Label>
            <TextField fx:id="answerField" alignment="CENTER_RIGHT" onAction="#handleAnswer" prefHeight="30.0" prefWidth="95.0" 
                       text="" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="10.0">
              <tooltip>
                <Tooltip text="半角 0 ~ 9 で入力してね！" />
              </tooltip>
            </TextField>
          </children>
        </AnchorPane>
        <HBox alignment="CENTER_RIGHT" prefHeight="47.0" prefWidth="296.0">
          <children>
            <ToggleButton fx:id="easy" mnemonicParsing="false" onAction="#handleEasy" prefWidth="65.0" 
                          selected="true" text="Easy" wrapText="false">
              <toggleGroup>
                <ToggleGroup fx:id="mode" />
              </toggleGroup>
              <tooltip>
                <Tooltip text="2桁以内の足し算" />
              </tooltip>
              <HBox.margin>
                <Insets />
              </HBox.margin>
            </ToggleButton>
            <ToggleButton fx:id="normal" mnemonicParsing="false" onAction="#handleNormal" 
                          prefWidth="65.0" text="Normal" toggleGroup="$mode">
              <tooltip>
                <Tooltip text="3桁以内の足し算" />
              </tooltip>
              <HBox.margin>
                <Insets left="5.0" fx:id="x2" />
              </HBox.margin>
            </ToggleButton>
            <ToggleButton fx:id="hard" mnemonicParsing="false" onAction="#handleHard" prefWidth="65.0" selected="false" 
                          text="Hard" textAlignment="LEFT" toggleGroup="$mode" HBox.margin="$x2">
              <tooltip>
                <Tooltip text="5桁以内の足し算" />
              </tooltip>
            </ToggleButton>
          </children>
        </HBox>
        <HBox alignment="CENTER_RIGHT" prefHeight="47.0" prefWidth="296.0" spacing="12.0">
          <children>
            <Button fx:id="clearButton" mnemonicParsing="true" onAction="#handleClear" text="_Clear">
              <tooltip>
                <Tooltip text="次の問題" />
              </tooltip>
            </Button>
            <Button fx:id="answerButton" mnemonicParsing="true" onAction="#handleAnswer" text="_Answer">
              <tooltip>
                <Tooltip text="ファイナルアンサー？" />
              </tooltip>
            </Button>
          </children>
          <padding>
            <Insets />
          </padding>
        </HBox>
      </children>
    </VBox>
    <Label fx:id="resultLabel" prefHeight="30.0" prefWidth="-1.0" text="" textFill="RED" 
           AnchorPane.leftAnchor="10.0" AnchorPane.topAnchor="110.0">
      <font>
        <Font size="20.0" />
      </font>
    </Label>
    <CheckBox fx:id="bgmCheck" alignment="CENTER_LEFT" allowIndeterminate="false" contentDisplay="LEFT" mnemonicParsing="true" 
              selected="false" text="_BGM" textAlignment="LEFT" AnchorPane.leftAnchor="5.0" AnchorPane.topAnchor="73.0">
      <font>
        <Font size="14.0" />
      </font>
      <tooltip>
        <Tooltip text="BGM 設定" />
      </tooltip>
    </CheckBox>
  </children>
</AnchorPane>

100

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

<?import java.lang.*?>

<?import java.util.*?>

<?import javafx.geometry.*?>

<?import javafx.scene.*?>

<?import javafx.scene.control.*?>

<?import javafx.scene.layout.*?>

<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane" maxHeight="-1.0" maxWidth="-1.0" minHeight="160.0" minWidth="320.0"

prefHeight="160.0" prefWidth="320.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2"

fx:controller="jp.yucchi.calc.CalcFormController">

<VBox prefHeight="-1.0" prefWidth="-1.0" AnchorPane.bottomAnchor="12.0" AnchorPane.leftAnchor="12.0"

AnchorPane.rightAnchor="12.0" AnchorPane.topAnchor="12.0">

<Label fx:id="questionLabel" prefHeight="30.0" prefWidth="184.0" text=""

AnchorPane.leftAnchor="5.0" AnchorPane.topAnchor="10.0">

<font>

</font>

</Label>

<TextField fx:id="answerField" alignment="CENTER_RIGHT" onAction="#handleAnswer" prefHeight="30.0" prefWidth="95.0"

text="" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="10.0">

</tooltip>

</TextField>

</children>

</AnchorPane>

<ToggleButton fx:id="easy" mnemonicParsing="false" onAction="#handleEasy" prefWidth="65.0"

selected="true" text="Easy" wrapText="false">

</toggleGroup>

</tooltip>

<HBox.margin>

</HBox.margin>

</ToggleButton>

<ToggleButton fx:id="normal" mnemonicParsing="false" onAction="#handleNormal"

prefWidth="65.0" text="Normal" toggleGroup="$mode">

</tooltip>

<HBox.margin>

</HBox.margin>

</ToggleButton>

<ToggleButton fx:id="hard" mnemonicParsing="false" onAction="#handleHard" prefWidth="65.0" selected="false"

text="Hard" textAlignment="LEFT" toggleGroup="$mode" HBox.margin="$x2">

</tooltip>

</ToggleButton>

</children>

</HBox>

</tooltip>

</Button>

</tooltip>

</Button>

</children>

</padding>

</HBox>

</children>

</VBox>

<Label fx:id="resultLabel" prefHeight="30.0" prefWidth="-1.0" text="" textFill="RED"

AnchorPane.leftAnchor="10.0" AnchorPane.topAnchor="110.0">

<font>

</font>

</Label>

<CheckBox fx:id="bgmCheck" alignment="CENTER_LEFT" allowIndeterminate="false" contentDisplay="LEFT" mnemonicParsing="true"

selected="false" text="_BGM" textAlignment="LEFT" AnchorPane.leftAnchor="5.0" AnchorPane.topAnchor="73.0">

<font>

</font>

</tooltip>

</CheckBox>

</children>

</AnchorPane>

アプリのウィンドウサイズの変更をできないようにするために Calc2.java の 19 行目で

stage.setResizable(false);

としています。

チェックボックスを利用して BGM を流せるようにするために CalcFormController.java の 163 行目から 178 行目までで

チェックボックスにリスナーを設定して制御しています。

トグルボタンはグループ化して排他制御可能としてます。

これは JavaFX Scene Builder を使って簡単に設定できます。

トグルボタンのイベントをそれぞれ実装して JavaFX Scene Builder で結びつければいいだけです。

トグルボタンのグループも JavaFX Scene Builder で簡単に設定できます。便利！便利！

ただ前述したとおりトグルボタンが必ずどれか一つ選択状態にあるようにしたいため適当なことをやっています。

おそらく、なんだこれは？といいたくなるかもしれませんがスマートな方法を知らないのでこうなりました。(^_^;)

よってトグルボタンにニーモニックを設定しても上手く動作しなくなります。だからニーモニックはあきらめました。（ヲヒ

チェックボックス、テキストフィールド、ボタンにはニーモニックを JavaFX Scene Builder で簡単に設定できます。

プロパティの Text 欄に _ を先頭につけて記入し（_BGM)

Mnemonic Parsing のチェックボックスを ON にすればいいだけです。

ツールチップも同様に JavaFX Scene Builder を使えば楽勝です！

JavaFX Scene Builder のライブラリ Popup Controls から Tooltip をドラッグアンドドロップして

プロパティを設定してやればいいだけという非常に楽ちんな作業です。

以上、こんな感じでできあがりました。

Webstart: click to launch this app as webstart

ちょっと五月蠅くなってしまいましたがご勘弁を。

もっといろいろ楽しいことが出来るようなのでボチボチと遊んでみたいと思ってます。

Hatena タグ: JavaFX,NetBeans

TAGS: JavaFX,NetBeans | 2013年8月6日11:03 PM | Comment : 1

JavaFX で足し算のお勉強

JavaFX NetBeans

JavaFX を少し前から触りだしたのですがさっぱり解らない状態のままです。

某サイトの記事を参考に進めているのですが行き当たりばったりでやってます。

ということで今回はちょっとした足し算を出題するプログラムを組んでみることにしました。

特に難しいことはやってないし、GUI の設計は JavaFX Scene Builder でポトペタやれば NetBeans IDE との連携で楽ちんだよ！

AnchorPane のコードプロパティでコントローラ・クラスを NetBeans IDE との連携により選択できます。

レイアウトとかの編集も視覚的に確認できて楽です！

Button のコードプロパティでは fx:id , On Action などの設定も可能です。

NetBeans IDE との連携機能で JavaFX アプリを創るにはこれしか無いってほど強力ですね。

そんなこんなでできあがったのはこんな感じの完成度の低いアプリです。

TextField には入力制限をかけたかったのですが面倒なことをしなくてはいけなそうなので 0 から 9 以外の文字（全角文字も）が入力された場合はエラーメッセージを出すように手を抜きました。

標準で入力制限をかけるようなものが用意されてないのは残念です。（あるかもしれません。）

JavaFX はじめて 3時間くらいでここまで出来るのは優秀な開発環境のおかげですね。

それではソースコードを載せておきますね。

まだ JavaFX をはじめたばかりなので間違いがあるかもしれませんが笑って許してくださいね。(^_^;)

package jp.yucchi.calc;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Calc extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("CalcForm.fxml"));

        Scene scene = new Scene(root);

        stage.setTitle("足し算できますか？");
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

package jp.yucchi.calc;

import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Parent;

import javafx.scene.Scene;

import javafx.stage.Stage;

public class Calc extends Application {

@Override

public void start(Stage stage) throws Exception {

Parent root = FXMLLoader.load(getClass().getResource("CalcForm.fxml"));

Scene scene = new Scene(root);

stage.setTitle("足し算できますか？");

stage.setScene(scene);

stage.show();

}

public static void main(String[] args) {

launch(args);

}

package jp.yucchi.calc;

import java.awt.Toolkit;
import static java.lang.Integer.parseInt;
import java.net.URL;
import java.util.Random;
import java.util.ResourceBundle;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;

public class CalcFormController implements Initializable {

    private int x;
    private int y;
    private int resultAnswer;

    Random rnd = new Random();

    private final Media start = new Media(getClass().getResource("start.mp3").toExternalForm());
    private final Media ok = new Media(getClass().getResource("ok.mp3").toExternalForm());
    private final Media ng = new Media(getClass().getResource("ng.mp3").toExternalForm());

    MediaPlayer mp_start = new MediaPlayer(start);
    MediaPlayer mp_ok = new MediaPlayer(ok);
    MediaPlayer mp_ng = new MediaPlayer(ng);

    @FXML
    private Label questionLabel;

    @FXML
    private TextField answerField;

    @FXML
    private Label resultLabel;

    @FXML
    public void handleAnswer(ActionEvent event) {

        Pattern intPattern = Pattern.compile("[0-9]+");
        Matcher match = intPattern.matcher(answerField.getText());

        if (match.matches() != false || answerField.getText().isEmpty()) {
        } else {
            resultLabel.setText("数値を入力してね！");
            Toolkit.getDefaultToolkit().beep();
        }
        if (answerField.getText().isEmpty()) {
            resultLabel.setText("答えを入力してね！");
            Toolkit.getDefaultToolkit().beep();
        } else {
            boolean result = calc(answerField.getText());
            if (result) {
                resultLabel.setText("正解！");
                mp_ok.play();
            } else {
                resultLabel.setText("不正解！");
                mp_ng.play();
            }
        }
    }

    @FXML
    public void handleClear(ActionEvent event) {
        answerField.clear();
        resultLabel.setText(null);
        x = rnd.nextInt(999) + 1;
        y = rnd.nextInt(999) + 1;
        resultAnswer = x + y;
        questionLabel.setText(" " + x + " + " + y + " = ");
    }

    @Override
    public void initialize(URL url, ResourceBundle rb) {

        x = rnd.nextInt(999) + 1;
        y = rnd.nextInt(999) + 1;
        resultAnswer = x + y;
        questionLabel.setText(" " + x + " + " + y + " = ");
        mp_start.play();
    }

    private boolean calc(String ans) {
        int answer = parseInt(ans);
        return answer == resultAnswer;
    }

}

package jp.yucchi.calc;

import java.awt.Toolkit;

import static java.lang.Integer.parseInt;

import java.net.URL;

import java.util.Random;

import java.util.ResourceBundle;

import java.util.regex.Matcher;

import java.util.regex.Pattern;

import javafx.event.ActionEvent;

import javafx.fxml.FXML;

import javafx.fxml.Initializable;

import javafx.scene.control.Label;

import javafx.scene.control.TextField;

import javafx.scene.media.Media;

import javafx.scene.media.MediaPlayer;

public class CalcFormController implements Initializable {

private int x;

private int y;

private int resultAnswer;

Random rnd = new Random();

private final Media start = new Media(getClass().getResource("start.mp3").toExternalForm());

private final Media ok = new Media(getClass().getResource("ok.mp3").toExternalForm());

private final Media ng = new Media(getClass().getResource("ng.mp3").toExternalForm());

MediaPlayer mp_start = new MediaPlayer(start);

MediaPlayer mp_ok = new MediaPlayer(ok);

MediaPlayer mp_ng = new MediaPlayer(ng);

@FXML

private Label questionLabel;

@FXML

private TextField answerField;

@FXML

private Label resultLabel;

@FXML

public void handleAnswer(ActionEvent event) {

Pattern intPattern = Pattern.compile("[0-9]+");

Matcher match = intPattern.matcher(answerField.getText());

if (match.matches() != false || answerField.getText().isEmpty()) {

} else {

resultLabel.setText("数値を入力してね！");

Toolkit.getDefaultToolkit().beep();

}

if (answerField.getText().isEmpty()) {

resultLabel.setText("答えを入力してね！");

Toolkit.getDefaultToolkit().beep();

} else {

boolean result = calc(answerField.getText());

if (result) {

resultLabel.setText("正解！");

mp_ok.play();

} else {

resultLabel.setText("不正解！");

mp_ng.play();

}

@FXML

public void handleClear(ActionEvent event) {

answerField.clear();

resultLabel.setText(null);

x = rnd.nextInt(999) + 1;

y = rnd.nextInt(999) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

}

@Override

public void initialize(URL url, ResourceBundle rb) {

x = rnd.nextInt(999) + 1;

y = rnd.nextInt(999) + 1;

resultAnswer = x + y;

questionLabel.setText(" " + x + " + " + y + " = ");

mp_start.play();

}

private boolean calc(String ans) {

int answer = parseInt(ans);

return answer == resultAnswer;

}

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane" maxHeight="145.0" maxWidth="340.0" minHeight="-1.0" minWidth="-1.0" prefHeight="140.0" prefWidth="320.0" 
            xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="jp.yucchi.calc.CalcFormController">
    <children>
        <VBox prefHeight="-1.0" prefWidth="-1.0" AnchorPane.bottomAnchor="12.0"
              AnchorPane.leftAnchor="12.0" AnchorPane.rightAnchor="12.0" AnchorPane.topAnchor="12.0">
            <children>
                <AnchorPane prefHeight="58.0" prefWidth="-1.0">
                    <children>
                        <Label fx:id="questionLabel" prefHeight="30.0" prefWidth="184.0" 
                               text="" AnchorPane.leftAnchor="14.0" AnchorPane.topAnchor="14.0">
                            <font>
                                <Font size="16.0" fx:id="x1" />
                            </font>
                        </Label>
                        <TextField fx:id="answerField" alignment="CENTER_RIGHT" onAction="#handleAnswer" prefHeight="30.0" prefWidth="75.0" 
                                   text="" AnchorPane.leftAnchor="207.0" AnchorPane.rightAnchor="14.0" AnchorPane.topAnchor="14.0" />
                    </children>
                </AnchorPane>
                <HBox alignment="CENTER_RIGHT" prefHeight="58.0" prefWidth="-1.0" spacing="12.0">
                    <children>
                        <Button fx:id="clearButton" mnemonicParsing="false" onAction="#handleClear" text="Clear" />
                        <Button fx:id="answerButton" mnemonicParsing="false" onAction="#handleAnswer" text="Answer" />
                    </children>
                </HBox>
            </children>
        </VBox>
        <Label fx:id="resultLabel" prefHeight="30.0" text="" textFill="RED" AnchorPane.leftAnchor="8.0" AnchorPane.topAnchor="89.0">
            <font>
                <Font size="20.0" />
            </font>
        </Label>
    </children>
</AnchorPane>

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

<?import java.lang.*?>

<?import java.util.*?>

<?import javafx.scene.*?>

<?import javafx.scene.control.*?>

<?import javafx.scene.layout.*?>

<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane" maxHeight="145.0" maxWidth="340.0" minHeight="-1.0" minWidth="-1.0" prefHeight="140.0" prefWidth="320.0"

xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="jp.yucchi.calc.CalcFormController">

<VBox prefHeight="-1.0" prefWidth="-1.0" AnchorPane.bottomAnchor="12.0"

AnchorPane.leftAnchor="12.0" AnchorPane.rightAnchor="12.0" AnchorPane.topAnchor="12.0">

<Label fx:id="questionLabel" prefHeight="30.0" prefWidth="184.0"

text="" AnchorPane.leftAnchor="14.0" AnchorPane.topAnchor="14.0">

<font>

</font>

</Label>

<TextField fx:id="answerField" alignment="CENTER_RIGHT" onAction="#handleAnswer" prefHeight="30.0" prefWidth="75.0"

text="" AnchorPane.leftAnchor="207.0" AnchorPane.rightAnchor="14.0" AnchorPane.topAnchor="14.0" />

</children>

</AnchorPane>

</children>

</HBox>

</children>

</VBox>

<font>

</font>

</Label>

</children>

</AnchorPane>

ついでに Java Web Start もリンクしておきますね。

Webstart: click to launch Calc app as webstart

適当だけど組んだプログラムが動くってことは今でも素直に嬉しい！

もっといろいろ楽しめそうな気がしてきました。(^_^)

Hatena タグ: JavaFX,NetBeans

TAGS: JavaFX,NetBeans | 2013年8月5日8:51 AM | Comment : 0

« 古い記事新しい記事 »

ゆっちのBlog

ImageGetter (JavaFX) での覚え書き

Image Getter の致命的欠陥を Fix.

JavaFX 学習がてらにつまらないアプリをつくってしまった。

JavaFX でさらに足し算のお勉強

JavaFX で足し算のお勉強

Recent Comments

Java

NetBeans

カテゴリー

アーカイブ

RSS FEED

ねこび～ん

メタ情報

ゆっちのカレンダー

2013年1月
月	火	水	木	金	土	日
« 12月				2月 »
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

ゆっちのBlog

ImageGetter (JavaFX) での覚え書き

Image Getter の致命的欠陥を Fix.

JavaFX 学習がてらにつまらないアプリをつくってしまった。

JavaFX でさらに足し算のお勉強

JavaFX で足し算のお勉強

Popular post ranking

Recent Comments

Java

NetBeans

カテゴリー

アーカイブ

RSS FEED

ねこび～ん

メタ情報

ゆっちのカレンダー