개발 환경 설정
- JavaFX 개발 환경 설정(넷빈즈 8.2, 오라클 JDK 1.8, Scene Builder)
- Scene Builder에 라이브러리 추가 하는 방법(JFoeniX, FontAwesomeFX)
- 넷빈즈 프로젝트 외부 라이브러리(jar) 등록하는 방법
설명
좌측에 메뉴를 클릭 할때 마다 컨텐츠 영역에 독립적으로 생성된 FXML파일을 읽어들여 화면에 출력합니다.
결과
프로젝트 다운로드
프로젝트 구조
소스 코드
JavaFXSideNavigation.java
package com.ozxexe.sidebar;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class JavaFXSideNavigation extends Application {
@Override
public void start(Stage stage) throws Exception {
Parent root = FXMLLoader.load(getClass().getResource("SideBar.fxml"));
Scene scene = new Scene(root);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
SideBarController.java
package com.ozxexe.sidebar;
import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Parent;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
public class SideBarController implements Initializable {
@FXML
private BorderPane bp;
@FXML
private AnchorPane ap;
@Override
public void initialize(URL url, ResourceBundle rb) {
// TODO
}
@FXML
private void homeClick(MouseEvent event) {
bp.setCenter(ap);
}
@FXML
private void page01Click(MouseEvent event) {
loadPage("page01");
}
@FXML
private void page02Click(MouseEvent event) {
loadPage("page02");
}
@FXML
private void page03Click(MouseEvent event) {
loadPage("page03");
}
private void loadPage(String page) {
try {
Parent root = FXMLLoader.load(getClass().getResource(page + ".fxml"));
bp.setCenter(root);
} catch (IOException ex) {
Logger.getLogger(SideBarController.class.getName()).log(Level.SEVERE, null, ex);
}
}
}
SideBar.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="700.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/11.0.1" fx:controller="com.ozxexe.sidebar.SideBarController">
<children>
<BorderPane fx:id="bp" prefHeight="400.0" prefWidth="700.0">
<left>
<VBox prefHeight="400.0" prefWidth="120.0" style="-fx-background-color: #0D1824;" BorderPane.alignment="CENTER">
<children>
<Button mnemonicParsing="false" onMouseClicked="#homeClick" prefHeight="58.0" prefWidth="120.0" style="-fx-background-color: transparent; -fx-border-color: white; -fx-border-width: 0px 0px 2px 0px;" text="Home" textFill="WHITE">
<font>
<Font size="16.0" />
</font>
</Button>
<Button layoutX="10.0" layoutY="10.0" mnemonicParsing="false" onMouseClicked="#page01Click" prefHeight="58.0" prefWidth="120.0" style="-fx-background-color: transparent; -fx-border-color: white; -fx-border-width: 0px 0px 2px 0px;" text="Page 01" textFill="WHITE">
<font>
<Font size="16.0" />
</font>
</Button>
<Button layoutX="10.0" layoutY="68.0" mnemonicParsing="false" onMouseClicked="#page02Click" prefHeight="58.0" prefWidth="120.0" style="-fx-background-color: transparent; -fx-border-color: white; -fx-border-width: 0px 0px 2px 0px;" text="Page 02" textFill="WHITE">
<font>
<Font size="16.0" />
</font>
</Button>
<Button layoutX="10.0" layoutY="126.0" mnemonicParsing="false" onMouseClicked="#page03Click" prefHeight="58.0" prefWidth="120.0" style="-fx-background-color: transparent; -fx-border-color: white; -fx-border-width: 0px 0px 2px 0px;" text="Page 03" textFill="WHITE">
<font>
<Font size="16.0" />
</font>
</Button>
</children>
</VBox>
</left>
<center>
<AnchorPane fx:id="ap" prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: #14242B;" BorderPane.alignment="CENTER">
<children>
<Text fill="WHITE" layoutX="230.0" layoutY="211.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Home">
<font>
<Font size="45.0" />
</font>
</Text>
</children>
</AnchorPane>
</center>
</BorderPane>
</children>
</AnchorPane>
page01.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
<HBox alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="-Infinity" minWidth="-Infinity" style="-fx-background-color: #14242B;" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
<children>
<Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Page01">
<font>
<Font size="48.0" />
</font>
</Text>
</children>
</HBox>
page02.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
<HBox alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="-Infinity" minWidth="-Infinity" style="-fx-background-color: #14242B;" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
<children>
<Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Page02">
<font>
<Font size="48.0" />
</font>
</Text>
</children>
</HBox>
page03.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
<HBox alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="-Infinity" minWidth="-Infinity" style="-fx-background-color: #14242B;" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
<children>
<Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Page02">
<font>
<Font size="48.0" />
</font>
</Text>
</children>
</HBox>
참고사이트
'Java | JavaFX' 카테고리의 다른 글
JavaFX 위치 네비게이션(BreadCrumbBar) 구현하기 예제 (0) | 2020.01.02 |
---|---|
JavaFX 메뉴(버튼) 클릭 마다, 겹쳐진 Pane 최상위로 올리기(정렬하기) 예제 (0) | 2019.12.30 |
JavaFX 페이스북 디자인의 로그인(TimeLine를 활용한 화면 전환 애니메이션) (0) | 2019.12.27 |
JavaFX 윈도우(stage) 드래그 창 이동 및 최대화, 최소화, 닫기 기능 구현 예제 (0) | 2019.12.27 |
JavaFX AnimateFX 데모 예제 (0) | 2019.12.26 |