JavaFX 프로젝트에 버튼과 텍스트를 추가하는 방법 - 시작 자바 프로그래머 인

Java 프로그래머는 JavaFX 프로젝트에 항목을 추가하려고합니다. 강력한 GUI 프로그램을 만들 때 버튼과 다른 위젯으로 창을 만드는 것으로 시작합니다. 그런 다음 키 입력, 버튼 클릭 및 기타 이와 같은 작업에 응답하는 메소드를 추가합니다.

XML 파일을 사용하여 버튼과 텍스트 필드를 설명합니다.

1 JavaFX 프로젝트를 엽니 다.

Eclipse의 패키지 탐색기에서 새 프로젝트를 찾습니다.

2 Eclipse의 패키지 탐색기에서 새 프로젝트 분기를 확장합니다.

src 브랜치 안에있는 애플리케이션 브랜치를 찾습니다.

3 애플리케이션 브랜치를 마우스 오른쪽 버튼으로 클릭 (Mac에서는 control 키를 누른 채 클릭)합니다. 나타나는 상황에 맞는 메뉴에서 파일 → 새로 만들기 → 기타를 선택하십시오.

마법사 선택 대화 상자가 나타납니다.

4 마법사 선택 대화 상자의 트리에서 JavaFX 분기를 확장합니다. JavaFX 분기에서 새 FXML 문서 항목을 두 번 클릭합니다.

FXML 파일 대화 상자가 나타납니다.

5 대화 상자의 이름 필드에 새 파일의 이름을 입력 한 다음 마침을 클릭합니다.

파일의 이름을 루트 로 지정하십시오.

루트라는 이름을 입력했지만 e (fx) 클립은 전체 이름이 루트 인 파일을 만듭니다. fxml.

이 새로운 루트. fxml 파일은 새 JavaFX 응용 프로그램의 버튼, 텍스트 필드 및 기타의 레이아웃을 설명합니다.

6 새 루트를 마우스 오른쪽 버튼으로 클릭 (또는 Mac에서는 control 키를 누른 상태에서 클릭)합니다. Eclipse의 패키지 탐색기에있는 fxml 분기. 상황에 맞는 메뉴에서, SceneBuilder로 열기를 선택하십시오.

씬 빌더 어플리케이션 창이 나타납니다.

장면 작성기 창에는 여러 영역이 있습니다.

장면 작성기 창의 중간에는 내용 패널 이 있으며 여기에서 새 응용 프로그램을 미리 볼 수 있습니다. (현재는 앱에 볼 내용이 없으므로 내용 패널은 큰 빈 공간입니다.)

창의 왼쪽 상단 부분에는 컨테이너 섹션이있는 라이브러리 패널 컨트롤 섹션 및 기타 여러 섹션으로 구성됩니다.

GUI 세계에서 버튼, 텍스트 필드, 레이블 및 체크 상자와 같은 것을 컨트롤 라고합니다. 라이브러리 패널의 컨트롤 섹션은 팔레트를 구성합니다. GUI 창을 만들려면 컨트롤을 팔레트에서 끌어 내용 패널에 놓습니다.

윈도우의 왼쪽 아래 부분에는 계층 섹션과 컨트롤러 섹션이 포함 된 문서 패널 이 있습니다. Hierarchy 섹션에는 AnchorPane 항목이 있습니다.

계층 구조 섹션에는 창의 어떤 요소가 다른 요소 안에 있는지를 보여주는 트리가 있습니다.컨트롤러 섹션은 디자인 한 창을 응용 프로그램의 Java 코드와 연결하는 데 유용합니다.

창의 가장 오른쪽 부분에는 Inspector 패널 가 있으며 여기에는 Properties 섹션, Layout 섹션 및 Code 섹션이 있습니다.

속성 섹션에서는 창에있는 요소의 기능을 설명합니다. 코드 섹션에서는 창에있는 요소와 관련된 Java 메소드의 이름을 지정합니다.

마일리지가 다를 수 있습니다! 이 지침은 씬 빌더 2의 미리보기 버전에서 작동합니다. 다른 버전의 씬 빌더를 사용하는 경우에는 약간 다른 단계가있을 수 있습니다.

7 계층 구조 섹션에서 AnchorPane 항목을 선택하십시오.

장면 작성기의 내용 패널 중간에 표식이 나타납니다.

8 앵커 패널을 확대하려면 [컨텐트] 패널에서 마커를 드래그합니다.

AnchorPane이 확대됩니다.

9 라이브러리 패널의 컨트롤 섹션에서 TextField 항목 찾기

그런 다음 TextField 컨트롤을 컨텐츠 패널의 AnchorPage로 드래그합니다.

10 라이브러리 패널의 컨트롤 섹션에서 버튼 항목을 찾습니다.

Button 컨트롤을 내용 패널의 AnchorPage로 드래그하십시오.

11 주 메뉴에서 파일 → 저장을 선택하십시오.

이렇게하면 새 FXML 파일이 저장됩니다.

12 Scene Builder 응용 프로그램을 닫습니다.

Eclipse Workbench로 돌아 가면 Root에 새로운 코드를 볼 수있다. fxml 파일.

루트를 두 번 클릭하십시오. 패키지 탐색기에서 fxml 분기를 클릭하여 파일의 코드를 확인합니다. 코드에서 TextField 및 Button이라는 단어가 보이지 않으면 편집기 창에서 마우스를 클릭하십시오. (마우스를 클릭하면 씬 빌더의 변경 사항을 반영하도록 에디터가 업데이트됩니다.) 에디터의 코드가 들여 쓰기가 적절하지 않은 경우 편집기의 빈 영역에서 마우스를 클릭하고 Ctrl-Shift-F를 누릅니다.

Eclipse의 편집기에서 코드를 형식화하고 싶을 때 (코드를 읽기 쉽고 이해하기 쉽게 만들 때) Ctrl-Shift-F를 누릅니다.

13 프로젝트의 Main을 편집하십시오. 자바 파일.

BorderPane 루트 문을 주석으로 처리하고 부모 루트 문을 추가합니다 (코드 20-3의 굵은 체로 표시).

목록 20-3의 편집 내용은 새로 설계된 루트에 응용 프로그램을 연결합니다. fxml 레이아웃.

14 프로젝트를 실행하십시오.

할 때 루트를 사용하여 프로젝트 실행을 볼 수 있습니다. fxml 파일.