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

From DISLab
Jump to navigation Jump to search

JavaFX 개요

  1. AWT
    • Native UI 컴포넌트 사용
    • 운영체제 마다 UI 모양이 다름
  2. Swing
    • 운영체제가 제공하는 native UI 사용 안 함
    • 운영체제가 새롭게 제공하는 UI 지원의 어려움
  3. JavaFX
    • Abode의 flash, Microsoft의 silverlight의 대항마
    • JDK 7부터 지원. JDK 8 권장.
    • JDK 11부터는 별도로 설치해야 함.
    • 화면 레이아웃과 스타일, 애플리케이션 로직 분리
    • Java 코드와 분리해서 스타일 시트(CSS)로 외관 작성 → 개발자와 디자이너의 동시 개발 가능
    • Java 코드에서도 레이아웃과 애플리케이션 로직을 분리하고 싶다면 레이아웃은 FXML로 작성, 로직은 Java로 작성
    • JavaFX 애플리케이션 구성 요소
[레이아웃]
자바 코드 파일
또는 FXML 파일 		[외관 및 스타일]
CSS 파일 		[리소스]
그림 파일
동영상 파일
...
[비즈니스 로직]
자바 코드 파일

JavaFX 애플리케이션 개발 시작

메인 클래스

import javafx.application.Application;
import javafx.stage.Stage;

public class AppMain extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.show();        
    }

    public static void main(String[] args) {
        launch(args);
    }
}

JavaFX 라이프사이클(life cycle)

  • 예제 코드
import javafx.application.Application;
import javafx.stage.Stage;

public class AppMain extends Application {
    public AppMain() {
        System.out.println(Thread.currentThread().getName() + ": AppMain() 호출");
    }

    @Override
    public void init() throws Exception {
        System.out.println(Thread.currentThread().getName() + ": init() 호출");
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        System.out.println(Thread.currentThread().getName() + ": start() 호출");
        primaryStage.show();
    }
    @Override
    public void stop() throws Exception {
        System.out.println(Thread.currentThread().getName() + ": stop() 호출");
    }

    public static void main(String[] args) throws Exception {
        System.out.println(Thread.currentThread().getName() + ": main() 호출");
        launch(args);        
    }
}
  • 실행 결과
main: main() 호출
JavaFX Application Thread: AppMain() 호출
JavaFX-Launcher: init() 호출
JavaFX Application Thread: start() 호출
JavaFX Application Thread: stop() 호출 ← 프로그램을 끝내야 실행된다.

메일 클래스 실행 매개값 얻기

C:> java AppMain --ip=192.168.0.5 --port=50001
  • main()에서 launch(args)를 넘겨 받음
  • init() 메소드에서 아래와 같이 실행할 수 있음
Parameters params = getParameters();
List<String> list = params.getRaw();
Map<String, String> map = params.getNamed();

무대(Stage)와 장면(Scene)

  • 윈도우 : Stage
  • Stage에는 하나의 Scene을 가질 수 있음
  • Scene은 직접 생성해야 함
AppMain 실행화면
import javafx.application.Application;
import javafx.application.Platform;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;

public class AppMain extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        VBox root = new VBox();
        root.setPrefWidth(350);
        root.setPrefHeight(150);
        root.setAlignment(Pos.CENTER);
        root.setSpacing(20);

        Label label = new Label();
        label.setText("Hello, JavaFX");
        label.setFont(new Font(50));

        Button button = new Button();
        button.setText("확인");
        button.setOnAction(event->Platform.exit());

        root.getChildren().add(label);
        root.getChildren().add(button);

        Scene scene = new Scene(root); // VBox를 루트 컨테이너(root container)로 해서 Scene 생성

        primaryStage.setTitle("AppMain입니다");
        primaryStage.setScene(scene); // 윈도우에 장면 설정
        primaryStage.show();        
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

JavaFX 레이아웃

프로그램적 레이아웃

프로그램적 레이아웃
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class AppMain extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        HBox hbox = new HBox();
        hbox.setPadding(new Insets(10));
        hbox.setSpacing(10);

        TextField textField = new TextField();
        textField.setPrefWidth(200);

        Button button = new Button();
        button.setText("확인");

        ObservableList list = hbox.getChildren();
        list.add(textField);
        list.add(button);

        Scene scene = new Scene(hbox);

        primaryStage.setTitle("AppMain");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

FXML 레이아웃

  • FXML 파일 (root.fxml)
FXML 레이아웃
<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.HBox?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.*?>

<HBox xmlns:fx="http://javafx.com/fxml">
    <padding>
        <Insets top="10" right="10" bottom="10" left="10"/>
    </padding>
    <spacing>10</spacing>

    <children>
        <TextField>
            <prefWidth>200</prefWidth>
        </TextField>

        <Button>
            <text>확인</text>
        </Button>
    </children>
</HBox>
  • AppMain 클래스
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class AppMain extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("root.fxml")); // ← FXML 로드
        Scene scene = new Scene(root);

        primaryStage.setTitle("AppMain");
        primaryStage.setScene(scene);
        primaryStage.show();
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

레이아웃(layout) 여백: 패딩(padding)과 마진(margin)

구분 HBox의 패딩 Button의 마진
개념 CP-17.3.3-padding.png CP-17.3.3-margin.png
자바 코드 HBox hbox = new HBox();
hbox.setPadding(new Insets(50)); 		Button button = new Button();
HBox.setMargin(button, new Insets(50));
FXML 태그 <HBox>
  <padding>
    <Insets topRightBottomLeft="50"/>
  </padding>
</HBox> 		<Button>
  <HBox.margin>
    <Insets topRightBottomLeft="50"/>
  </Hbox.margin>
</Button>

  • Margin, Padding 설정 방법
// top, right, bottom, left를 모두 동일한 값으로 설정할 때
// Insets(double topRightBottomLeft)
new Insets(50);

// top, right, bottom, left를 다를 값으로 설정할 때
// Insets(double top, double right, double bottom, double left)
new Insets(10, 20, 30, 40);
  • 패딩과 마진 적용 예
패딩과 마진 적용 결과
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class AppMain extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        // 패딩 설정
        HBox hbox = new HBox();
        hbox.setPadding(new Insets(50, 10, 10, 50));
        Button button = new Button();
        button.setPrefSize(100, 100);
        
        // 마진 설정
        // HBox hbox = new HBox();
        // Button button = new Button();
        // button.setPrefSize(100, 100);
        // HBox.setMargin(button, new Insets(10, 10, 50, 50));

        hbox.getChildren().add(button);

        Scene scene = new Scene(hbox);

        primaryStage.setTitle("AppMain");
        primaryStage.setScene(scene);
        primaryStage.show();
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

FXML 작성 규칙

프로그램적 레이아웃 자바 코드 FXML 레이아웃 태그
HBox hbox = new HBox();
hbox.setPadding(new Inset(10, 10, 10, 10));
hbox.setSpacing(10);

   		<HBox xmlns:fx="http://javafx.com/fxml">
  <padding>
    <Insets top="10" right="10" bottom="10" left="10"/>
  </padding>
</HBox>
TextField textField = new TextField();
textField.setPrefWidth(200);
   		<TextField>
  <prefWidth>200</prefWidth>
</TextField>
Button button = new Button();
button.setText("확인");
   		<Button>
  <text>확인</text>
</Button>
ObsetvableList list = hbox.getChildren();
list.add(textField);
list.add(button);




   		<children>
  <TextField>
    <prefWidth>200</prefWidth>
  </TextField>
  <Button>
    <text>확인</text>
  </Button>
</children>

패키지(package) 선언

자바 코드 FXML 태그
import javafx.scene.layout.HBox; <?import javafx.scene.layout.HBox?>
import javafx.scene.control.*; <?import javafx.scene.control.*?>

  • <?import?>가 들어가는 위치는 <?xml ...>와 루트 컨테이너 태그 사이이다.
<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.HBox?>
<?import javafx.scene.control.*?>

<루트 컨테이너 xmlns:fx="http://javafx.com/fxml">
...
</루트 컨테이너>
  • import를 제대로 하지 않으면 not a valid type 메시지와 함께 javafx.fxml.LoadException 발생

태그(tag) 선언

속성(attribute) 선언


객체 선언

JavaFX 컨테이너

JavaFX 이벤트 처리

JavaFX 속성 감시와 바인딩

JavaFX 컨트롤

JavaFX 메뉴바(MenuBar)와 툴바(Toolbar)

JavaFX 다이얼로그(Dialog)

JavaFX CSS 스타일

JavaFX 스레드 동시성

화면 이동과 애니메이션

Retrieved from "http://dislab.hufs.ac.kr/w/index.php?title=컴퓨터프로그래밍및실습_(2022년)/1128&oldid=339"