JAVA fx - Scene Bulider를 이용한 퀴즈정답 구현하기1 (2022-08-22)

1. 서론

 

그러면 Scene Bulider를 이용하여 이전에 했던 퀴즈를 구현해 보자.

 

해당 퀴즈는 이것!

2022.08.18 - [개발일지/JAVAfx - GUI] - JAVA fx - JAVA fx 컨테이너 - H,Vbox,ImageView 퀴즈(2022-08-18)

JAVA fx - JAVA fx 컨테이너 - H,Vbox,ImageView 퀴즈(2022-08-18)

 

2. 본론

다 만들면 이러한 화면이 될 것이라 생각한다.

 

그러면 ListView에 문자열을 추가해야 하는데 추가가 되질 않는다....;;;;;;;;;;;;;;

 

ListView에 문자열 추가하는 방법을 알아보도록 하자.

 

먼저 사용한 ListView를 클릭하게 되면 오른쪽 하단에 'code' 라고 보일 것이다.

클릭해 주고 fx:id부분에 자기가 원하는 코드를 추가해주도록 하자.

필자는 listView 라고 함.

그리고 Bulider에서 저장을 누르면 FXML파일에 이렇게 추가된 것을 볼 수 있다.

 

그리고 메인 코드로 돌아와 다음 코드를 적어주도록 하자.

ListView<String> lv = (ListView<String>)form.lookup("#listView");
		lv.getItems().addAll("item1","item2","item3");

대충

lv라는 변수를 FXML에 들어갈 수 있도록 형변환[(ListView<String>)]을 해주고 FXML파일에서 fx:id("#listView")를 찾아서

lv변수에 해당 문자열을 추가 시켜준다는 뜻....?인 듯 하다. 

 

package ex1;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.ListView;
import javafx.stage.Stage;

public class Ex3 extends Application{

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

	@SuppressWarnings("unchecked")
	@Override
	public void start(Stage primaryStage) throws Exception {
		
		FXMLLoader loader = new FXMLLoader(getClass().getResource("Ex3.fxml"));
		Parent form = loader.load();
		
		
		ListView<String> lv = (ListView<String>)form.lookup("#listView");
		lv.getItems().addAll("item1","item2","item3");
		
		Scene scene = new Scene(form);
		
		primaryStage.setScene(scene);
		primaryStage.setTitle("Ex3");
		primaryStage.show();
	}

}

메인 코드는 이렇게 종결.

 

FXML코드

 

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

<?import javafx.geometry.Insets?>
<?import javafx.geometry.Rectangle2D?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ListView?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.FlowPane?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.StackPane?>

<StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="250.0" prefWidth="500.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <ImageView fitHeight="250.0" fitWidth="500.0" pickOnBounds="true" preserveRatio="true">
         <image>
            <Image url="@../../../basic/src/img/quiz.jpg" />
         </image>
         <viewport>
            <Rectangle2D height="250.0" width="500.0" />
         </viewport>
      </ImageView>
      <BorderPane maxHeight="250.0" maxWidth="500.0" prefHeight="250.0" prefWidth="500.0">
         <top>
            <FlowPane alignment="CENTER" hgap="100.0" prefHeight="60.0" prefWidth="500.0" style="-fx-background-color: pink;" BorderPane.alignment="CENTER">
               <children>
                  <Label alignment="CENTER" lineSpacing="50.0" text="메뉴" />
                  <Label text="홈" />
                  <Label alignment="CENTER" contentDisplay="CENTER" text="로그인" />
               </children>
               <opaqueInsets>
                  <Insets />
               </opaqueInsets>
            </FlowPane>
         </top>
         <left>
            <ListView fx:id="listView" maxHeight="100.0" maxWidth="80.0" prefHeight="100.0" prefWidth="106.0" BorderPane.alignment="TOP_LEFT" />
         </left>
         <center>
            <Button mnemonicParsing="false" text="내용 들어가는 곳" BorderPane.alignment="TOP_LEFT">
               <BorderPane.margin>
                  <Insets left="20.0" />
               </BorderPane.margin>
            </Button>
         </center>
         <bottom>
            <Button mnemonicParsing="false" text="바닥글 들어가는 곳" BorderPane.alignment="CENTER">
               <BorderPane.margin>
                  <Insets bottom="20.0" />
               </BorderPane.margin>
            </Button>
         </bottom>
         <right>
            <GridPane BorderPane.alignment="CENTER">
               <columnConstraints>
                  <ColumnConstraints hgrow="SOMETIMES" maxWidth="117.0" minWidth="10.0" prefWidth="117.0" />
                  <ColumnConstraints hgrow="SOMETIMES" maxWidth="95.0" minWidth="10.0" prefWidth="83.0" />
               </columnConstraints>
               <rowConstraints>
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
               </rowConstraints>
               <children>
                  <Button alignment="CENTER" mnemonicParsing="false" prefHeight="23.0" prefWidth="122.0" text="아이디 입력" GridPane.rowIndex="1" />
                  <Button mnemonicParsing="false" prefHeight="23.0" prefWidth="130.0" text="비밀번호 입력" GridPane.rowIndex="2" />
                  <Button mnemonicParsing="false" prefHeight="42.0" prefWidth="71.0" text="로그인" GridPane.columnIndex="1" GridPane.rowIndex="1" GridPane.rowSpan="2" />
               </children>
            </GridPane>
         </right>
      </BorderPane>
   </children>
</StackPane>

위 코드는 Scene Bulider로 만들기 때문에 사실 생략해도 되지만...

 

결과는

 

제대로 출력되는 것을 확인 할 수 있다.