山傘のプログラミング勉強日記

プログラミングに関する日記とどうでもよい雑記からなるブログです。

JavaFX で電卓をつくる その5

環境構築

OpenJDK と OpenJFX で JavaFX の環境を構築しました。また、IDEIntelliJ です。

openjfx.io

yamakasa3.hatenablog.com

Scene Builder

gluonhq.com

f:id:yamakasa3:20190626151310p:plain

GUIJavaFX の外側だけを作成することができます。fxml に自動で変換してくれるので、直感的な操作ができます。

fxml ファイル

シンタックスハイライトは fxml がないので xml を使っています。

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>


<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="400.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Label alignment="CENTER_RIGHT" prefHeight="50.0" prefWidth="480.0" text="0">
         <VBox.margin>
            <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
         </VBox.margin>
         <font>
            <Font size="28.0" />
         </font>
      </Label>
      <GridPane minHeight="50.0" minWidth="50.0" prefHeight="320.0" prefWidth="100.0">
        <columnConstraints>
          <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
          <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
        </columnConstraints>
        <rowConstraints>
          <RowConstraints minHeight="20.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
            <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
            <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
        </rowConstraints>
         <children>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="7">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="8" GridPane.columnIndex="1">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="9" GridPane.columnIndex="2">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="+" GridPane.columnIndex="3">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="4" GridPane.columnSpan="2" GridPane.rowIndex="1">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="5" GridPane.columnIndex="1" GridPane.rowIndex="1">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="6" GridPane.columnIndex="2" GridPane.rowIndex="1">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="-" GridPane.columnIndex="3" GridPane.rowIndex="1">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="1" GridPane.rowIndex="2">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="0" GridPane.columnIndex="1" GridPane.rowIndex="2">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="3" GridPane.columnIndex="2" GridPane.rowIndex="2">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="×" GridPane.columnIndex="3" GridPane.rowIndex="2">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="±" GridPane.rowIndex="3">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="0" GridPane.columnIndex="1" GridPane.rowIndex="3">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="." GridPane.columnIndex="2" GridPane.rowIndex="3">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="/" GridPane.columnIndex="3" GridPane.rowIndex="3">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="=" GridPane.columnIndex="3" GridPane.rowIndex="4">
               <font>
                  <Font size="20.0" />
               </font>
            </Button>
            <Button mnemonicParsing="false" prefHeight="100.0" prefWidth="100.0" text="C" GridPane.columnIndex="2" GridPane.rowIndex="4">
               <font>
                  <Font size="22.0" />
               </font>
            </Button>
         </children>
         <VBox.margin>
            <Insets left="5.0" right="5.0" />
         </VBox.margin>
      </GridPane>
   </children>
</VBox>

JavaFX

f:id:yamakasa3:20190626152015p:plain

GridPane のセルの結合はサポートしていないみたいなので、下部に空白が残ってしまいました。まあ、セルは基本的に結合するべきではないと思います。

感想

今回は外側だけを作りました。機能面が問題なんですが、Python みたいな eval メソッドがあると楽なんですよね。まあ、電卓のアルゴリズムは有名なものがあるので、それを利用しようと思います。一から真面目にアルゴリズムを考えるとかなり大変ですよね。