JAVA chapter17. javaFX. 17.7 JavaFX 컨트롤(1)

17.7 JavaFX 컨트롤

17.7.1 버튼 컨트롤

package sec07.exam01_button;
 
import java.net.URL;
import java.util.ResourceBundle;
 
import javafx.application.Platform;
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.Button;
import javafx.scene.control.CheckBox;
import javafx.scene.control.Toggle;
import javafx.scene.control.ToggleGroup;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
 
public class RootController implements Initializable {
    @FXML private CheckBox chk1;
    @FXML private CheckBox chk2;
    @FXML private ImageView checkImageView;
    @FXML private ToggleGroup group;
    @FXML private ImageView radioImageView;    
    @FXML private Button btnExit;
 
    @Override
    public void initialize(URL location, ResourceBundle resources) {
        group.selectedToggleProperty().addListener(new ChangeListener<Toggle>() {
            @Override
            public void changed(ObservableValue<? extends Toggle> observable, Toggle oldValue, Toggle newValue) {
                Image image = new Image(getClass().getResource("images/" + newValue.getUserData().toString() + ".png").toString());
                radioImageView.setImage(image);
            }
        });
    }
    
    public void handleChkAction(ActionEvent e) {
        if(chk1.isSelected() && chk2.isSelected()) {
            checkImageView.setImage(new Image(getClass().getResource("images/geek-glasses-hair.gif").toString()));
        } else if(chk1.isSelected()) {
            checkImageView.setImage(new Image(getClass().getResource("images/geek-glasses.gif").toString()));
        } else if(chk2.isSelected()) {
            checkImageView.setImage(new Image(getClass().getResource("images/geek-hair.gif").toString()));
        } else {
            checkImageView.setImage(new Image(getClass().getResource("images/geek.gif").toString()));
        }
    }    
    
    public void handleBtnExitAction(ActionEvent e) {
        Platform.exit();
    }
}
 

<?xml version="1.0" encoding="UTF-8"?>
 
<?import java.lang.*?>
<?import javafx.scene.layout.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
 
<BorderPane prefHeight="150.0" prefWidth="420.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="sec07.exam01_button.RootController">
   <padding>
      <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
   </padding>    
   
   <center>
      <HBox alignment="CENTER" prefHeight="100.0" prefWidth="400.0" spacing="10">
         <children>
            <VBox alignment="CENTER_LEFT" prefHeight="100.0" prefWidth="100.0" spacing="20.0">
               <children>
                  <CheckBox fx:id="chk1" onAction="#handleChkAction" text="안경" />
                  <CheckBox fx:id="chk2" onAction="#handleChkAction" text="모자" />
               </children>
            </VBox>
            
            <ImageView fx:id="checkImageView" fitWidth="100.0" preserveRatio="true">
               <image><Image url="@images/geek.gif" /></image>
            </ImageView>
            
            <Separator orientation="VERTICAL" prefHeight="100.0" />
            
            <VBox alignment="CENTER_LEFT" prefHeight="100" prefWidth="150" spacing="20.0">
                <!-- <fx:define><ToggleGroup fx:id="group"/></fx:define> -->
                <children>
                   <RadioButton fx:id="rad1" text="BubbleChart" userData="BubbleChart">
                      <toggleGroup>
                         <ToggleGroup fx:id="group" />
                      </toggleGroup>
                   </RadioButton>
                   <RadioButton fx:id="rad2" selected="true" text="BarChart" toggleGroup="$group" userData="BarChart" />
                   <RadioButton fx:id="rad3" text="AreaChart" toggleGroup="$group" userData="AreaChart" />
                </children>
            </VBox>
            
            <ImageView fx:id="radioImageView" fitWidth="100.0" preserveRatio="true">
                <image><Image url="@images/BarChart.png" /></image>
            </ImageView>
         </children>
      </HBox>
   </center>
   
   <bottom>
      <Button fx:id="btnExit" onAction="#handleBtnExitAction" BorderPane.alignment="CENTER">
         <graphic>
             <ImageView>
            <image>
                  <Image url="@images/exit.png" />
            </image></ImageView>
         </graphic>
         <BorderPane.margin>
             <Insets top="20.0" /> 
         </BorderPane.margin>         
      </Button>
   </bottom>
</BorderPane>
 

17.7.2 입력 컨트롤

// AnchorPane 컨테이너를 사용할 때는 SceneBulider를 사용하는게 좋다

<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.text.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.web.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.image.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.collections.*?>
 
<AnchorPane prefHeight="300.0" prefWidth="400.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="sec07.exam02_input.RootController">
   <children>
      <Label layoutX="22.0" layoutY="36.0" text="제목" />
      <TextField fx:id="txtTitle" layoutX="84.0" layoutY="32.0" prefHeight="29.0" prefWidth="369.0" />
      <Label layoutX="22.0" layoutY="69.0" text="비밀번호" />
      <PasswordField fx:id="txtPassword" layoutX="86.0" layoutY="65.0" prefHeight="23.0" prefWidth="132.0" />
      <Label layoutX="22.0" layoutY="104.0" text="공개" />
        <ComboBox fx:id="comboPublic" layoutX="86.0" layoutY="100.0" prefHeight="23.0" prefWidth="132.0" promptText="선택하세요">
            <items>
                <FXCollections fx:factory="observableArrayList">
                    <String fx:value="공개" />
                    <String fx:value="비공개" />
                </FXCollections>
            </items>
        </ComboBox>
      <Label layoutX="240.0" layoutY="104.0" text="게시종료" />
      <DatePicker fx:id="dateExit" layoutX="312.0" layoutY="100.0" prefHeight="29.0" prefWidth="139.0" promptText="날짜를 선택하세요" />
      <Label layoutX="22.0" layoutY="135.0" text="내용" />
      <TextArea fx:id="txtContent" layoutX="22.0" layoutY="154.0" prefHeight="132.0" prefWidth="429.0" />
      <Separator layoutX="13.0" layoutY="320" prefHeight="0.0" prefWidth="457.0" />
      <Button fx:id="btnReg" layoutX="189.0" layoutY="340" onAction="#handleBtnRegAction" text="등록" />
      <Button fx:id="btnCancel" layoutX="252.0" layoutY="340" onAction="#handleBtnCancelAction" text="취소" />
   </children>
</AnchorPane>

package sec07.exam02_input;
 
import java.net.URL;
import java.time.LocalDate;
import java.util.ResourceBundle;
 
import javafx.application.Platform;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.ComboBox;
import javafx.scene.control.DatePicker;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextArea;
import javafx.scene.control.TextField;
 
public class RootController implements Initializable {
    @FXML private TextField txtTitle;
    @FXML private PasswordField txtPassword;
    @FXML private ComboBox<String> comboPublic;
    @FXML private DatePicker dateExit;
    @FXML private TextArea txtContent;
    
    @Override
    public void initialize(URL location, ResourceBundle resources) {
    }
     
    public void handleBtnRegAction(ActionEvent e) {
        String title = txtTitle.getText();
        System.out.println("title: " + title);
        
        String password = txtPassword.getText();
        System.out.println("password: " + password);
        
        String strPublic = comboPublic.getValue();
        System.out.println("public: " + strPublic);
        
        LocalDate localDate = dateExit.getValue();
        if(localDate != null) { // null이 아닐때만 출력
            System.out.println("dateExit: " + localDate.toString());
        } 
        
        String content = txtContent.getText();
        System.out.println("content: " + content);
    }
    
    public void handleBtnCancelAction(ActionEvent e) {
        Platform.exit();
    }
}
 

17.7.3 뷰 컨트롤

// preserveRatio는 비율을 맞춘다 (폭을 기준으로)

// AnchorPane 컨테이너를 사용할 때는 SceneBulider를 사용

root.fxml

<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.text.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.web.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.image.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.collections.*?>
 
<AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="sec07.exam03_view.RootController"
    prefHeight="180.0" prefWidth="500.0" >
   <children>
      <Label layoutX="11.0" layoutY="9.0" text="ListView" />
      <ListView fx:id="listView" layoutX="10.0" layoutY="30.0" prefHeight="100.0" prefWidth="100.0" />
      <Label layoutX="125.0" layoutY="9.0" text="TableView" />
      <TableView fx:id="tableView" layoutX="120.0" layoutY="30.0" prefHeight="100.0" prefWidth="290.0">
        <columns>
          <TableColumn prefWidth="100.0" text="스마트폰" />
          <TableColumn prefWidth="100.0" text="이미지" />
        </columns>
      </TableView>
      <Label layoutX="425.0" layoutY="9.0" text="ImageView" />
      <ImageView fx:id="imageView" fitHeight="100.0" fitWidth="60.0" layoutX="430.0" layoutY="30.0" preserveRatio="true" />
      <Button layoutX="190.0" layoutY="145.0" onAction="#handleBtnOkAction" text="확인" />
      <Button layoutX="260.0" layoutY="145.0" onAction="#handleBtnCancelAction" text="취소" />
   </children>
</AnchorPane>

package sec07.exam03_view;
 
import java.net.URL;
import java.util.ResourceBundle;
 
import javafx.application.Platform;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.ListView;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
 
public class RootController implements Initializable {
    @FXML private ListView<String> listView;
    @FXML private TableView<Phone> tableView;    
    @FXML private ImageView imageView;
    
    @Override
    public void initialize(URL location, ResourceBundle resources) {
        listView.setItems(FXCollections.observableArrayList(
            "갤럭시S1", "갤럭시S2", "갤럭시S3", "갤럭시S4", "갤럭시S5", "갤럭시S6", "갤럭시S7"
        ));
        listView.getSelectionModel().selectedIndexProperty().addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
                tableView.getSelectionModel().select(newValue.intValue());
                tableView.scrollTo(newValue.intValue());
            }
        });
        
        ObservableList phoneList = FXCollections.observableArrayList(
            new Phone("갤럭시S1", "phone01.png"),
            new Phone("갤럭시S2", "phone02.png"),
            new Phone("갤럭시S3", "phone03.png"),
            new Phone("갤럭시S4", "phone04.png"),
            new Phone("갤럭시S5", "phone05.png"),
            new Phone("갤럭시S6", "phone06.png"),
            new Phone("갤럭시S7", "phone07.png")
        );
        
        TableColumn tcSmartPhone = tableView.getColumns().get(0);
        tcSmartPhone.setCellValueFactory(
            new PropertyValueFactory("smartPhone")
        );
        tcSmartPhone.setStyle("-fx-alignment: CENTER;");
        
        TableColumn tcImage = tableView.getColumns().get(1);
        tcImage.setCellValueFactory(
            new PropertyValueFactory("image")
        );
        tcImage.setStyle("-fx-alignment: CENTER;");
        
        tableView.setItems(phoneList);
        
        tableView.getSelectionModel().selectedItemProperty().addListener(new ChangeListener<Phone>() {
            @Override
            public void changed(ObservableValue<? extends Phone> observable, Phone oldValue, Phone newValue) {
                if(newValue!=null) {
                    imageView.setImage(new Image(getClass().getResource("images/" + newValue.getImage()).toString()));
                }
            }
        });
    }
    
    public void handleBtnOkAction(ActionEvent e) {
        String item = listView.getSelectionModel().getSelectedItem();
        System.out.println("ListView 스마트폰: " + item);
        
        Phone phone = tableView.getSelectionModel().getSelectedItem();
        System.out.println("TableView 스마트폰: " + phone.getSmartPhone());
        System.out.println("TableView 이미지: " + phone.getImage());
    }
    
    public void handleBtnCancelAction(ActionEvent e) {
        Platform.exit();
    }
}

Phone.java

package sec07.exam03_view;
 
import javafx.beans.property.SimpleStringProperty;
 
public class Phone {
    private SimpleStringProperty smartPhone;
    private SimpleStringProperty image;
    
    public Phone() {
        this.smartPhone = new SimpleStringProperty();
        this.image = new SimpleStringProperty();
    }
    public Phone(String smartPhone, String image) {
        this.smartPhone = new SimpleStringProperty(smartPhone);
        this.image = new SimpleStringProperty(image);
    }
    
    public String getSmartPhone() {
        return smartPhone.get();
    }
    public void setSmartPhone(String smartPhone) {
        this.smartPhone.set(smartPhone);;
    }
    public String getImage() {
        return image.get();
    }
    public void setImage(String image) {
        this.image.set(image);;
    }
}