<?import javafx.collections.*?>
<?import javafx.geometry.Insets?>
<?import java.lang.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.control.cell.*?>
<?import javafx.scene.layout.*?>
<?import fxmltableview.*?>

<Scene width="550" height="550" fx:controller="fxmltableview.FXMLTableViewController"
       xmlns:fx="http://javafx.com/fxml">

    <GridPane alignment="center" hgap="10" vgap="10">
        <padding>
            <Insets top="10" right="10" bottom="10" left="10"/>
        </padding>

        <Label text="Address Book" GridPane.columnIndex="0" GridPane.rowIndex="0"
               style="-fx-font: NORMAL 20 Tahoma;"/>

        <TableView fx:id="tableView" GridPane.columnIndex="0"
                    GridPane.rowIndex="1">
            <columns>
                <TableColumn fx:id="firstNameColumn" text="First Name" prefWidth="100">
                    <cellValueFactory>
                        <PropertyValueFactory property="firstName" />
                    </cellValueFactory>
                    <cellFactory>
                        <FormattedTableCellFactory alignment="center">
                        </FormattedTableCellFactory>
                    </cellFactory>
                </TableColumn>
                <TableColumn text="Last Name" prefWidth="100">
                    <cellValueFactory>
                        <PropertyValueFactory property="lastName" />
                    </cellValueFactory>
                </TableColumn>
                <TableColumn text="Email Address" prefWidth="200">
                    <cellValueFactory>
                        <PropertyValueFactory property="email" />
                    </cellValueFactory>
                </TableColumn>
            </columns>
            <items>
                <FXCollections fx:factory="observableArrayList">
                    <Person firstName="Jacob" lastName="Smith"
                            email="jacob.smith@example.com"/>
                    <Person firstName="Isabella" lastName="Johnson"
                            email="isabella.johnson@example.com"/>
                    <Person firstName="Ethan" lastName="Williams"
                            email="ethan.williams@example.com"/>
                    <Person firstName="Emma" lastName="Jones"
                            email="emma.jones@example.com"/>
                    <Person firstName="Michael" lastName="Brown"
                            email="michael.brown@example.com"/>
                </FXCollections>
            </items>
            <sortOrder>
                <fx:reference source="firstNameColumn"/>
            </sortOrder>
        </TableView>

        <HBox spacing="10" alignment="bottom_right" GridPane.columnIndex="0"
               GridPane.rowIndex="2">
            <TextField fx:id="firstNameField" promptText="First Name"
                         prefWidth="90"/>
            <TextField fx:id="lastNameField" promptText="Last Name"
                         prefWidth="90"/>
            <TextField fx:id="emailField" promptText="Email"
                         prefWidth="150"/>
            <Button text="Add" onAction="#addPerson"/>
        </HBox>

    </GridPane>

</Scene>