컴퓨터프로그래밍및실습 (2022년)/1128

JavaFX 컨트롤

버튼 컨트롤

• ButtonBase를 상속하는 하위 컨트롤
• Button, CheckBox, RadioButton, ToggleButton, Hyperlink 등
• p.896 그림 참조

• Button

<Button text="아이콘버튼">
   <graphic>
      <ImageView>
         <Image url="@iamges/history_view.gif"/>
      </ImageView>
   </graphic>
</Button>

• selected 속성 - CheckBox, RadioButton, ToggleButton : 선택, 미선택 (selected가 true 혹은 false)

<CheckBox text="라벨1" userData="값1"/>
<CheckBox text="라벨2" userData="값2" selected="true"/>

• toggleGroup 속성 - RadioButton, ToggleButton : 하나의 그룹으로 묶이고, 그룹 내에서는 하나만 선택

<fx:deine>
   <ToggleGroup fx:=id="groupName"/>
</fx:define>

<RadioButton text="라벨1" userData="값1" toggleGroup="$groupName" />
<RadioButton text="라벨2" userData="값2" toggleGroup="$groupName" selected="true" />

• ActionEvent 발생 - CheckBox, RadioButton, ToggleButton : 컨트롤을 사용하가 클릭할 경우

<CheckBox ... onAction="#handleChkAction"/>

• RadioButton, ToggleButton 그룹 내에서 선택 변경을 감시하고 싶다면

groupName.selectedToggleProperty().addListener(new ChangeListener<Toggle> {
    @Override
    public void changed(ObservableValue<? extends Toggle> observable, Toggle oldValue, Toggle newValue) {
        ...
    }
});

• 예

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.RadioButton?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.Separator?>
<?import javafx.scene.control.ToggleGroup?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>


<BorderPane xmlns:fx="http://javafx.com/fxml" fx:controller="ch17.p897.RootController" prefHeight="150.0" prefWidth="420.0">
   <padding>
      <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
   </padding>

   <center>
      <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" spacing="10">
         <children>
            <VBox prefHeight="200.0" prefWidth="100.0" spacing="20.0" alignment="CENTER_LEFT">
               <children>
                  <CheckBox fx:id="chk1" text="안경" onAction="#handleChkAction" />
                  <CheckBox fx:id="chk2" text="모자" onAction="#handleChkAction" />
               </children>
            </VBox>

            <ImageView fx:id="checkImageView" fitWidth="200.0" preserveRatio="true">
               <image><Image url="@images/geek.gif" /></image>
            </ImageView>

            <Separator orientation="VERTICAL" prefHeight="200.0" />

            <VBox prefHeight="200.0" prefWidth="100.0">
               <fx:define>
                  <ToggleGroup fx:id="group" />
               </fx:define>

               <children>
                  <RadioButton fx:id="rad1" text="BubbleChart" userData="BubbleChart" toggleGroup="$group"/>
                  <RadioButton fx:id="rad2" text="BarChart" userData="BarChart" toggleGroup="$group" selected="true" />
                  <RadioButton fx:id="rad3" text="AreaChart" userData="AreaChart" toggleGroup="$group"/>
               </children>
            </VBox>

            <ImageView fx:id="radioImageView" fitHeight="100.0" preserveRatio="true">
               <image>
                  <Image url="@images/BarChart.png" />
               </image>
            </ImageView>
         </children>
      </HBox>
   </center>

    <bottom>
      <Button fx:id="btnExit" BorderPane.alignment="CENTER" onAction="#handleBtnExitAction">
         <graphic>
            <ImageView>
               <Image url="@images/exit.png" />
            </ImageView>
         </graphic>
         <BorderPane.margin>
            <Insets top="20.0" />
         </BorderPane.margin>
      </Button>
   </bottom>
</BorderPane>

package ch17.p897;

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;

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);                
            }
            
        });

    }

    // CheckBox 이벤트 처리
    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()));
        }
    }

    // Button 이벤트 처리
    public void handleBtnExitAction(ActionEvent e) {
        Platform.exit();
    }

}