chapter17. javaFX


17.4 JavaFX 컨테이너



17.4.1 AnchorPane 컨테이너 

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


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.scene.control.*?>
 
<AnchorPane xmlns:fx="http://javafx.com/fxml" prefHeight="150.0" prefWidth="300.0" >
   <children>
      <Label layoutX="42.0" layoutY="28.0" text="아이디" />
      <Label layoutX="42.0" layoutY="66.0" text="패스워드" />
      <TextField layoutX="120.0" layoutY="24.0" />
      <PasswordField layoutX="120.0" layoutY="62.0" />
      <Button layoutX="97.0" layoutY="106.0" text="로그인" />
      <Button layoutX="164.0" layoutY="106.0" text="취소" />
   </children>
</AnchorPane>
cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
package sec04.exam01_anchorpane;
 
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"));
        Scene scene = new Scene(root);
        
        primaryStage.setTitle("AppMain");
        primaryStage.setScene(scene);
        primaryStage.show();
        primaryStage.setResizable(false);
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}
cs


17.4.2 HBox와 VBox 컨테이너




 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.geometry.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
 
<VBox xmlns:fx="http://javafx.com/fxml">
   <padding>
      <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
   </padding>
   
   <children>
      <ImageView fitWidth="200" preserveRatio="true"> // 그림의 비율에 맞게 높이를 설정
         <image>
            <Image url="@images/javafx.jpg" /> // 현재 경로 기준으로 상대경로로 파일 지정
         </image>
      </ImageView>
      
      <HBox alignment="CENTER" spacing="20.0">
         <children>
            <Button text="이전" />
            <Button text="다음"> // 오른쪽 남은 공간을 버튼이 모두 채우도록 설정
                <HBox.hgrow><Priority fx:constant="ALWAYS"/></HBox.hgrow>
                <maxWidth><Double fx:constant="MAX_VALUE"/></maxWidth>
            </Button> // 버튼의 폭을 자동으로 확장하기 위해 설정
         </children>
         <VBox.margin>
            <Insets top="10.0" />
         </VBox.margin>
      </HBox>
   </children>
</VBox>
cs



17.4.3 BorderPane 컨테이너



 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.scene.control.*?>
 
<BorderPane xmlns:fx="http://javafx.com/fxml" prefHeight="200.0" prefWidth="300.0" >
   <top>
      <ToolBar>
        <items>
            <Button text="Button" />
            <Button text="Button" />
        </items>
      </ToolBar>
   </top>
  
   <center>
      <TextArea/>
   </center>
  
   <bottom>
      <BorderPane>
         <center>
            <TextField/>
         </center>
         <right>
            <Button text="Button"/>
         </right>
      </BorderPane>
   </bottom>
</BorderPane>
cs



17.4.4 FlowPane 컨테이너



 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
 
<FlowPane xmlns:fx="http://javafx.com/fxml"
    prefWidth="300.0" prefHeight="70.0"  hgap="10.0"  vgap="10.0" >
   <padding> //수평 간격 //수직간격
      <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
   </padding>
 
   <children>
      <Button text="Button" />
      <Button text="Button" />
      <Button text="Button" />
      <Button text="Button" />
      <Button text="Button" />
      <Button text="Button" />
   </children>
</FlowPane>
cs


17.4.5 TilePane 컨테이너




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.scene.image.*?>
 
<TilePane xmlns:fx="http://javafx.com/fxml" prefTileHeight="100" prefTileWidth="100" >
   <children>
      <ImageView>
         <image><Image url="@images/fruit1.jpg" /></image>
      </ImageView>
      <ImageView>
         <image><Image url="@images/fruit2.jpg" /></image>
      </ImageView>
      <ImageView>
         <image><Image url="@images/fruit3.jpg" /></image>
      </ImageView>
      <ImageView>
         <image><Image url="@images/fruit4.jpg" /></image>
      </ImageView>
      <ImageView>
         <image><Image url="@images/fruit5.jpg" /></image>
      </ImageView>                        
   </children>
</TilePane>
cs



17.4.6. GridPane 컨테이너




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
 
<GridPane xmlns:fx="http://javafx.com/fxml"
     prefWidth="300.0"  hgap="10.0" vgap="10.0" >
   <padding>
      <Insets topRightBottomLeft="10.0"/>
   </padding>
   <children>
      <Label text="아이디"  GridPane.rowIndex="0"  GridPane.columnIndex="0"/>
      <TextField GridPane.rowIndex="0"  GridPane.columnIndex="1" 
                      GridPane.hgrow="ALWAYS" /> // 오른쪽 빈공간까지 확장
      
      <Label text="패스워드" GridPane.rowIndex="1"  GridPane.columnIndex="0"/>      
      <TextField GridPane.columnIndex="1" GridPane.rowIndex="1" 
                      GridPane.hgrow="ALWAYS" />
      
      <HBox     GridPane.rowIndex="2" GridPane.columnIndex="0" 
                  GridPane.columnSpan="2" GridPane.hgrow="ALWAYS" // GridPane.columnSpan은 컬럼 2개 병합
                  alignment="CENTER" spacing="20.0" >
         <children>
            <Button text="로그인" />
            <Button text="취소" />
         </children>
      </HBox>
   </children>
</GridPane>
 
cs



17.4.7 StackPane 컨테이너




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.layout.*?>
<?import javafx.scene.image.*?>
 
<StackPane xmlns:fx="http://javafx.com/fxml">
   <children>
      <ImageView fitWidth="500"  fitHeight="300" > // 가로비와 세로비 상관없이 고정 길이로 설정, 먼저 배치된것이 밑에 
         <image>
            <Image url="@images/snow.jpg" />
         </image>
      </ImageView>
      <ImageView preserveRatio="true"> // 가로비와 세로비를 유지
         <image>
            <Image url="@images/duke.gif" />
         </image>
      </ImageView>      
   </children>
</StackPane>
cs





Posted by 너래쟁이
: