JavaFx之TabelView

TableView，算是一个很重要的控件，几乎随处可见，而且功能强大，数据展示效果良好。所以，在JavaFX中，我们自然而然也应该学习一下TableView的使用 。废话不多说，直接上代码。

如果一下代码量嫌多请谅解，为了方便直接拿的项目Demo

 

一、先来一下实体类

package com.yc.education.model.basic;

import javax.persistence.*;
/**
 *@Description TODO 供应商_联系人
 *@Author QuZhangJing
 *@Date 11:49  2018/8/28
 *@Version 1.0
 */
@Table(name = "supplier_contact")
public class SupplierContact {
    /**
     * 自增编号
     */
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    /**
     * 主要联系人
     */
    private String keycontact;

    /**
     * 姓名
     */
    private String uname;

    /**
     * 部门
     */
    private String udepartment;

    /**
     * 职务
     */
    private String ujob;

    /**
     * 电话
     */
    private String uphone;

    /**
     * 传真
     */
    private String ufax;

    /**
     * 移动电话
     */
    private String umobile;

    /**
     * Email
     */
    private String uemail;

    /**
     * 备注
     */
    private String uremarks;

    /**
     * 是否主要联系人
     */
    private Integer ispoint;

    /**
     * 供应商编号
     */
    private Long supplierid;


    public SupplierContact() {
    }


    public SupplierContact(long id,String keycontact, String uname, String udepartment, String ujob, String uphone, String ufax, String umobile, String uemail, String uremarks) {
        this.id=id;
        this.keycontact = keycontact;
        this.uname = uname;
        this.udepartment = udepartment;
        this.ujob = ujob;
        this.uphone = uphone;
        this.ufax = ufax;
        this.umobile = umobile;
        this.uemail = uemail;
        this.uremarks = uremarks;
    }

    public SupplierContact(long id,String keycontact, String uname, String udepartment, String ujob, String uphone, String ufax, String umobile, String uemail, String uremarks, Integer ispoint, Long supplierid) {
        this.id=id;
        this.keycontact = keycontact;
        this.uname = uname;
        this.udepartment = udepartment;
        this.ujob = ujob;
        this.uphone = uphone;
        this.ufax = ufax;
        this.umobile = umobile;
        this.uemail = uemail;
        this.uremarks = uremarks;
        this.ispoint = ispoint;
        this.supplierid = supplierid;
    }

    /**
     * 获取自增编号
     *
     * @return id - 自增编号
     */
    public Long getId() {
        return id;
    }

    /**
     * 设置自增编号
     *
     * @param id 自增编号
     */
    public void setId(Long id) {
        this.id = id;
    }

    /**
     * 获取主要联系人
     *
     * @return keycontact - 主要联系人
     */
    public String getKeycontact() {
        return keycontact;
    }

    /**
     * 设置主要联系人
     *
     * @param keycontact 主要联系人
     */
    public void setKeycontact(String keycontact) {
        this.keycontact = keycontact;
    }

    /**
     * 获取姓名
     *
     * @return uname - 姓名
     */
    public String getUname() {
        return uname;
    }

    /**
     * 设置姓名
     *
     * @param uname 姓名
     */
    public void setUname(String uname) {
        this.uname = uname;
    }

    /**
     * 获取部门
     *
     * @return udepartment - 部门
     */
    public String getUdepartment() {
        return udepartment;
    }

    /**
     * 设置部门
     *
     * @param udepartment 部门
     */
    public void setUdepartment(String udepartment) {
        this.udepartment = udepartment;
    }

    /**
     * 获取职务
     *
     * @return ujob - 职务
     */
    public String getUjob() {
        return ujob;
    }

    /**
     * 设置职务
     *
     * @param ujob 职务
     */
    public void setUjob(String ujob) {
        this.ujob = ujob;
    }

    /**
     * 获取电话
     *
     * @return uphone - 电话
     */
    public String getUphone() {
        return uphone;
    }

    /**
     * 设置电话
     *
     * @param uphone 电话
     */
    public void setUphone(String uphone) {
        this.uphone = uphone;
    }

    /**
     * 获取传真
     *
     * @return ufax - 传真
     */
    public String getUfax() {
        return ufax;
    }

    /**
     * 设置传真
     *
     * @param ufax 传真
     */
    public void setUfax(String ufax) {
        this.ufax = ufax;
    }

    /**
     * 获取移动电话
     *
     * @return umobile - 移动电话
     */
    public String getUmobile() {
        return umobile;
    }

    /**
     * 设置移动电话
     *
     * @param umobile 移动电话
     */
    public void setUmobile(String umobile) {
        this.umobile = umobile;
    }

    /**
     * 获取Email
     *
     * @return uemail - Email
     */
    public String getUemail() {
        return uemail;
    }

    /**
     * 设置Email
     *
     * @param uemail Email
     */
    public void setUemail(String uemail) {
        this.uemail = uemail;
    }

    /**
     * 获取备注
     *
     * @return uremarks - 备注
     */
    public String getUremarks() {
        return uremarks;
    }

    /**
     * 设置备注
     *
     * @param uremarks 备注
     */
    public void setUremarks(String uremarks) {
        this.uremarks = uremarks;
    }

    /**
     * 获取是否主要联系人
     *
     * @return ispoint - 是否主要联系人
     */
    public Integer getIspoint() {
        return ispoint;
    }

    /**
     * 设置是否主要联系人
     *
     * @param ispoint 是否主要联系人
     */
    public void setIspoint(Integer ispoint) {
        this.ispoint = ispoint;
    }

    /**
     * 获取供应商编号
     *
     * @return supplierid - 供应商编号
     */
    public Long getSupplierid() {
        return supplierid;
    }

    /**
     * 设置供应商编号
     *
     * @param supplierid 供应商编号
     */
    public void setSupplierid(Long supplierid) {
        this.supplierid = supplierid;
    }
}

 

二、再来一下与TabelView实现双向绑定要用到的

package com.yc.education.model.basic;

import javafx.beans.property.SimpleLongProperty;
import javafx.beans.property.SimpleStringProperty;

/**
 * @ClassName SupplierContactProperty
 * @Description TODO  供应商-联系人 TabelView数据绑定之类
 * @Author QuZhangJing
 * @Date 2018/9/19 11:54
 * @Version 1.0
 */
public final class SupplierContactProperty {



    private final SimpleLongProperty id = new SimpleLongProperty();


    private  final SimpleStringProperty keycontact = new SimpleStringProperty();

    private  final SimpleStringProperty uname = new SimpleStringProperty();

    private  final SimpleStringProperty udepartment = new SimpleStringProperty();

    private  final SimpleStringProperty ujob = new SimpleStringProperty();

    private  final SimpleStringProperty uphone = new SimpleStringProperty();

    private  final SimpleStringProperty ufax = new SimpleStringProperty();

    private  final SimpleStringProperty umobile = new SimpleStringProperty();

    private  final SimpleStringProperty uemail = new SimpleStringProperty();

    private  final SimpleStringProperty uremarks = new SimpleStringProperty();


    public SupplierContactProperty() {
    }

    public SupplierContactProperty(long id,String keycontact, String uname, String udepartment, String ujob, String uphone, String ufax, String umobile, String uemail, String uremarks) {
        setId(id);
        setKeycontact(keycontact);
        setUname(uname);
        setUdepartment(udepartment);
        setUjob(ujob);
        setUphone(uphone);
        setUfax(ufax);
        setUmobile(umobile);
        setUemail(uemail);
        setUremarks(uremarks);
    }

    public long getId() {
        return id.get();
    }

    public SimpleLongProperty idProperty() {
        return id;
    }

    public void setId(long id) {
        this.id.set(id);
    }

    public String getUname() {
        return uname.get();
    }

    public SimpleStringProperty unameProperty() {
        return uname;
    }

    public void setUname(String uname) {
        this.uname.set(uname);
    }

    public String getUdepartment() {
        return udepartment.get();
    }

    public SimpleStringProperty udepartmentProperty() {
        return udepartment;
    }

    public void setUdepartment(String udepartment) {
        this.udepartment.set(udepartment);
    }

    public String getUjob() {
        return ujob.get();
    }

    public SimpleStringProperty ujobProperty() {
        return ujob;
    }

    public void setUjob(String ujob) {
        this.ujob.set(ujob);
    }

    public String getUphone() {
        return uphone.get();
    }

    public SimpleStringProperty uphoneProperty() {
        return uphone;
    }

    public void setUphone(String uphone) {
        this.uphone.set(uphone);
    }

    public String getUfax() {
        return ufax.get();
    }

    public SimpleStringProperty ufaxProperty() {
        return ufax;
    }

    public void setUfax(String ufax) {
        this.ufax.set(ufax);
    }

    public String getUmobile() {
        return umobile.get();
    }

    public SimpleStringProperty umobileProperty() {
        return umobile;
    }

    public void setUmobile(String umobile) {
        this.umobile.set(umobile);
    }

    public String getUemail() {
        return uemail.get();
    }

    public SimpleStringProperty uemailProperty() {
        return uemail;
    }

    public void setUemail(String uemail) {
        this.uemail.set(uemail);
    }

    public String getUremarks() {
        return uremarks.get();
    }

    public SimpleStringProperty uremarksProperty() {
        return uremarks;
    }

    public void setUremarks(String uremarks) {
        this.uremarks.set(uremarks);
    }

    public String getKeycontact() {
        return keycontact.get();
    }

    public SimpleStringProperty keycontactProperty() {
        return keycontact;
    }

    public void setKeycontact(String keycontact) {
        this.keycontact.set(keycontact);
    }
}

三、再来看一下Fxml文件

 <TableView fx:id="tableView1" focusTraversable="false" onKeyPressed="#tableView1Key" prefHeight="452.0" prefWidth="1140.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                <columns>
                                    <TableColumn fx:id="contactId" prefWidth="50.0" text="" />
                                    <TableColumn fx:id="mainContact" prefWidth="100.0" text="主要联系人">
                                    </TableColumn>
                                    <TableColumn fx:id="username" prefWidth="100.0" text="姓名" />
                                    <TableColumn fx:id="department" prefWidth="100.0" text="部门" />
                                    <TableColumn fx:id="position" prefWidth="100.0" text="职务" />
                                    <TableColumn fx:id="phones" prefWidth="100.0" text="电话" />
                                    <TableColumn fx:id="faxs" prefWidth="100.0" text="传真" />
                                    <TableColumn fx:id="iphone" prefWidth="100.0" text="移动电话" />
                                    <TableColumn fx:id="email" prefWidth="100.0" text="E-mail" />
                                    <TableColumn fx:id="remarkss" prefWidth="210.0" text="备注" />
                                </columns>

                              </TableView>

 

四、再来下Controller

 @FXML private TableView tableView1; //联系人
    @FXML private TableColumn contactId;  //编号
    @FXML private TableColumn mainContact;  //主要联系人
    @FXML private TableColumn username; //姓名
    @FXML private TableColumn department; //部门
    @FXML private TableColumn position; //职务
    @FXML private TableColumn phones; //电话
    @FXML private TableColumn faxs; //传真
    @FXML private TableColumn iphone; //移动电话
    @FXML private TableColumn email; //E-mail
    @FXML private TableColumn remarkss; //备注

五、声明并实例化 TabelView实现双向绑定要用到的类
 

 /**
     *  联系人TabelView绑定数据
     */
    private ObservableList<SupplierContactProperty> supplierContactProperties = FXCollections.observableArrayList();

六、接下来就是向表格中存入数据了

  /**
     * 选项卡---联系人 TableView
     */
    public void contact(){

      

        List<SupplierContact> supplierContact = supplierContactService.selectSupplierContactBySupplierid((long)isNum.getUserData());



        /* contactId.setCellFactory(TextFieldTableCell.forTableColumn());*/
           mainContact.setCellFactory(TextFieldTableCell.forTableColumn());
        username.setCellFactory(TextFieldTableCell.forTableColumn());
        department.setCellFactory(TextFieldTableCell.forTableColumn());
        position.setCellFactory(TextFieldTableCell.forTableColumn());
        phones.setCellFactory(TextFieldTableCell.forTableColumn());
        faxs.setCellFactory(TextFieldTableCell.forTableColumn());
        iphone.setCellFactory(TextFieldTableCell.forTableColumn());
        email.setCellFactory(TextFieldTableCell.forTableColumn());
        remarkss.setCellFactory(TextFieldTableCell.forTableColumn());



         contactId.setCellValueFactory(new PropertyValueFactory("id"));
        mainContact.setCellValueFactory(new PropertyValueFactory("keycontact"));
        username.setCellValueFactory(new PropertyValueFactory("uname"));
        department.setCellValueFactory(new PropertyValueFactory("udepartment"));
        position.setCellValueFactory(new PropertyValueFactory("ujob"));
        phones.setCellValueFactory(new PropertyValueFactory("uphone"));
        faxs.setCellValueFactory(new PropertyValueFactory("ufax"));
        iphone.setCellValueFactory(new PropertyValueFactory("umobile"));
        email.setCellValueFactory(new PropertyValueFactory("uemail"));
        remarkss.setCellValueFactory(new PropertyValueFactory("uremarks"));

        supplierContactProperties.clear();

            if(supplierContact.size()>0){
                for (SupplierContact supplierContact1:supplierContact) {

                    SupplierContactProperty supplierContactProperty = new SupplierContactProperty(supplierContact1.getId(),supplierContact1.getKeycontact(),supplierContact1.getUname(),supplierContact1.getUdepartment(),supplierContact1.getUjob(),supplierContact1.getUphone(), supplierContact1.getUfax(),supplierContact1.getUmobile(),supplierContact1.getUemail(),supplierContact1.getUremarks());

                    supplierContactProperties.add(supplierContactProperty);
                }
            }
        tableView1.setItems(supplierContactProperties); //tableview添加list
    }

七、紧接着解释获取TableView中的数据或者修改过的数据

 /**
     * 选项卡---联系人 TableView 新增修改
     */
    public void saveContact(long supplierid){
        for (SupplierContactProperty supplierContactProperty :supplierContactProperties) {
                if(supplierContactProperty.getUname()!=null){
                    if(supplierContactProperty.getId()>0){
                        //修改联系人
                        SupplierContact supplierContact = new SupplierContact(supplierContactProperty.getId(),supplierContactProperty.getKeycontact(),supplierContactProperty.getUname(),supplierContactProperty.getUdepartment(),supplierContactProperty.getUjob(),supplierContactProperty.getUphone(),supplierContactProperty.getUfax(),supplierContactProperty.getUmobile(),supplierContactProperty.getUemail(),supplierContactProperty.getUemail());
                        supplierContactService.updateNotNull(supplierContact);
                    }else{
                        //新增联系人
                        SupplierContact supplierContact = new SupplierContact(supplierContactProperty.getId(),supplierContactProperty.getKeycontact(),supplierContactProperty.getUname(),supplierContactProperty.getUdepartment(),supplierContactProperty.getUjob(),supplierContactProperty.getUphone(),supplierContactProperty.getUfax(),supplierContactProperty.getUmobile(),supplierContactProperty.getUemail(),supplierContactProperty.getUemail(),0,supplierid);
                        supplierContactService.save(supplierContact);
                    }
                }
        }
    }

[赠送] 赋值TabelView新增空白行的土方法

  //联系人空白行
    public void blankContact(){
        SupplierContactProperty supplierContactProperty = new SupplierContactProperty();
        supplierContactProperties.add(supplierContactProperty);
    }

最后当然是少不了展示效果，不然也不会相信你用过TabelView