【JavaFX】Oracle に接続して取得したデータをTableView に表示する
おはようございます。
昨日に引き続き、
JavaFXで Oracle から取得したデータを TableView に表示したいと思います。
プログラムは前回のものを流用します。
スポンサーリンク
クラスの作成
パッケージ・エクスプローラーから「dto」パッケージを右クリックし「新規」＞「クラス」を選択します。
クラス名に「TblCat」を入力し、「完了」ボタンをクリックします。
作成したクラスの実装は次のようにします。
TblCat.java
/**
*
*/
package jp.co.doraxdora.dto;
import java.io.Serializable;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
/**
* TBL猫DTOクラス.
*
* @author doraxdora
*
*/
public class TblCat implements Serializable {
/** No */
private StringProperty no;
/** 名前 */
private StringProperty name;
/** 性別 */
private StringProperty sex;
/** 年齢 */
private StringProperty age;
/** 種別 */
private StringProperty kindCd;
/** 好物 */
private StringProperty favorite;
/**
* @return no
*/
public StringProperty noProperty() {
return no;
}
/**
* @param no
* セットする no
*/
public void setNo(String no) {
this.no = new SimpleStringProperty(no);
}
/**
* @return name
*/
public StringProperty nameProperty() {
return name;
}
/**
* @param name
* セットする name
*/
public void setName(String name) {
this.name = new SimpleStringProperty(name);
}
/**
* @return sex
*/
public StringProperty sexProperty() {
return sex;
}
/**
* @param sex
* セットする sex
*/
public void setSex(String sex) {
this.sex = new SimpleStringProperty(sex);
}
/**
* @return age
*/
public StringProperty ageProperty() {
return age;
}
/**
* @param age
* セットする age
*/
public void setAge(String age) {
this.age = new SimpleStringProperty(age);
}
/**
* @return kind
*/
public StringProperty kindCdProperty() {
return kindCd;
}
/**
* @param kind
* セットする kind
*/
public void setKindCd(String kindCd) {
this.kindCd = new SimpleStringProperty(kindCd);
}
/**
* @return favorite
*/
public StringProperty favoriteProperty() {
return favorite;
}
/**
* @param favorite
* セットする favorite
*/
public void setFavorite(String favorite) {
this.favorite = new SimpleStringProperty(favorite);
}
}
TblViewの仕組み上
通常のアクセサとは異なり、getter のメソッド名は [メンバ名]Property とします。
こうしておかないと一覧にデータが表示されずにあたふたしますよ。
プログラム修正
画面の修正
SceneBuilder からであれば、右側のメニューから「On Action」にメソッド名を設定しますが、
fxmlを直接修正しても問題ありません。
Smaple.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ComboBox?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TableColumn?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.control.cell.PropertyValueFactory?>
<AnchorPane fx:id="mainPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="350.0" prefWidth="530.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="application.SampleController">
<children>
<Label fx:id="lbName" layoutX="14.0" layoutY="33.0" text="名前：" />
<TextField fx:id="txName" layoutX="58.0" layoutY="29.0" />
<Label fx:id="lbKind" layoutX="221.0" layoutY="33.0" text="種別：" />
<ComboBox fx:id="cbKind" layoutX="264.0" layoutY="29.0" prefWidth="150.0" />
<Button fx:id="btSearch" layoutX="456.0" layoutY="29.0" mnemonicParsing="false" onAction="#btSearchButtonActionHandle" text="検索" />
<TableView fx:id="tvCat" layoutX="14.0" layoutY="63.0" prefHeight="273.0" prefWidth="500.0">
<columns>
<TableColumn maxWidth="50.0" minWidth="50.0" prefWidth="50.0" resizable="false" text="No">
<cellValueFactory><PropertyValueFactory property="no"/></cellValueFactory>
</TableColumn>
<TableColumn maxWidth="100.0" minWidth="100.0" prefWidth="100.0" text="名前" >
<cellValueFactory><PropertyValueFactory property="name"/></cellValueFactory>
</TableColumn>
<TableColumn maxWidth="40.0" minWidth="40.0" prefWidth="40.0" text="性別" >
<cellValueFactory><PropertyValueFactory property="sex"/></cellValueFactory>
</TableColumn>
<TableColumn maxWidth="40.0" minWidth="40.0" prefWidth="40.0" text="年齢" >
<cellValueFactory><PropertyValueFactory property="age"/></cellValueFactory>
</TableColumn>
<TableColumn minWidth="120.0" prefWidth="120.0" text="種別" >
<cellValueFactory><PropertyValueFactory property="kindCd"/></cellValueFactory>
</TableColumn>
<TableColumn minWidth="145.0" prefWidth="147.0" text="好物" >
<cellValueFactory><PropertyValueFactory property="favorite"/></cellValueFactory>
</TableColumn>
</columns>
<columnResizePolicy>
<TableView fx:constant="CONSTRAINED_RESIZE_POLICY" />
</columnResizePolicy>
</TableView>
</children>
</AnchorPane>
CSSの修正
/* JavaFX CSS - Leave this comment until you have at least create one rule which uses -fx-Property */
.root {
-fx-font-family: "Meiryo";
}
TableViewの型を変更
SampleController.java
クラスに定義されているメンバーの型を新規作成した TblCat に変更します。
/** テーブルビュー：一覧 */ @FXML private TableView<TblCat> tvCat;
検索ボタンクリック時のメソッドを追加
SampleController.java（メソッドのみ抜粋）
/**
* 検索ボタンアクションハンドラー.
*
* @param ev
*/
@FXML
public void btSearchButtonActionHandle(ActionEvent ev) {
try {
DBAccess dba = new DBAccess();
ResultSet rs = dba.executeQuery("SELECT * FROM TBLCAT ORDER BY NO");
// 取得したデータを追加
ObservableList<TblCat> list = FXCollections.observableArrayList();
while (rs != null && rs.next()) {
TblCat cat = new TblCat();
cat.setNo(rs.getString("NO"));
cat.setName(rs.getString("NAME"));
cat.setSex(rs.getString("SEX"));
cat.setAge(rs.getString("AGE"));
cat.setKindCd(rs.getString("KIND_CD"));
cat.setFavorite(rs.getString("FAVORITE"));
list.add(cat);
}
tvCat.setItems(list);
} catch (SQLException e) {
// TODO 自動生成された catch ブロック
e.printStackTrace();
} catch (Exception e) {
// TODO 自動生成された catch ブロック
e.printStackTrace();
}
}
起動してみる
起動後、検索ボタンをクリックします。
無事にデータが表示されました。
まとめ
とりあえず検索の条件などは無視してデータを表示してみました。
次回は、検索条件の設定などをやっていきたいと思います。
ではでは。