이번에는 BorderPane을 그대로 사용합니다.


BorderPane root = (BorderPane)FXMLLoader.load(getClass().getResource("main.fxml"));


primaryStage.setTitle("Directories");




BorderPane의 Center 부분에 Pane을 추가하고 TreeView를 사진과 같이 배치


TreeView : Code, fx:id - treeView


Mouse - On Mouse Clicked - selectTree


Controller class 등록


이제 폴더 구조를 만들기 위한 폴더 아이콘 이미지를 올려 줍니다.


위 이미지를 우클릭 다른 이름으로 저장


그리고 img 패키지를 새로 만든 후 드래그 앤 드롭으로 복사하고





Controller class 등록 후 클래스를 작성합니다.



package app;

import java.net.URL;
import java.util.ResourceBundle;

import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;

public class MainController implements Initializable{
	// 폴더 명을 받기 때문에 String
	@FXML private TreeView<String> treeView;
	// 프로젝트의 src폴더 절대경로
	// "img/icon.png" 맨 앞에 슬래시가 없으면 app.img 패키지, 없으면 app 아래까지 절대경로를 지정
	// "/img/icon.png" 맨 앞에 슬래시가 있으면 img 패키지
	Image img = new Image(getClass().getResourceAsStream("/img/icon.png"));
	
	@SuppressWarnings("unchecked")
	@Override
	public void initialize(URL location, ResourceBundle resources) {
		System.out.println("FXML Load Complete");
		// 트리뷰의 구조를 먼저 설정해야함
		/*
		 * - 영화
		 * 		- 코메디
		 * 			- 한국
		 * 			- 미국
		 * 			- 영국
		 * 		- 로맨스
		 * 		- 액션
		*/
		// 폴더 : 7개 - 이미지 7개
		ImageView[] iv = new ImageView[7];
		for(int i = 0; i < 7; i++) {
			iv[i] = new ImageView(img);
			iv[i].setFitHeight(25); // 픽셀을 의미
			iv[i].setFitWidth(25);
		}
		
		// 1단계 트리 아이템 추가
		TreeItem<String> movie = new TreeItem<String>("영화", iv[0]);
		
		// 2단계 트리뷰에 추가
		TreeItem<String> comedy = new TreeItem<String>("comedy", iv[1]);
		TreeItem<String> romance = new TreeItem<String>("romance", iv[2]);
		TreeItem<String> action = new TreeItem<String>("action", iv[3]);
		// 1단계 밑에 추가
		movie.getChildren().addAll(comedy, romance, action);
		
		// 3단계 아이템 생성
		TreeItem<String> korea = new TreeItem<String>("한국", iv[4]);
		TreeItem<String> america = new TreeItem<String>("미국", iv[5]);
		TreeItem<String> english = new TreeItem<String>("영국", iv[6]);
		// 2단계 밑에 추가
		comedy.getChildren().addAll(korea, america, english);
		
		//한국 밑에 코메디 영화 2가지 추가(이미지 X)
		TreeItem<String> movie1 = new TreeItem<String>("영화1");
		TreeItem<String> movie2 = new TreeItem<String>("영화2");
		korea.getChildren().addAll(movie1, movie2);
		
		// 트리뷰에 추가
		treeView.setRoot(movie);
	}
	public void selectTree(MouseEvent evt) {
		// 더블클릭하면 그 값을 가져옴
		// get Click Count는 연속 클릭 횟수를 세는 메소드
		System.out.println(evt.getClickCount());
		
		if(evt.getClickCount() == 2) {
			TreeItem<String> item = treeView.getSelectionModel().getSelectedItem();
			System.out.println(item.getValue());
		}
	}
	
}



이번에는 BorderPane을 그대로 사용합니다.


BorderPane root = (BorderPane)FXMLLoader.load(getClass().getResource("main.fxml"));


primaryStage.setTitle("주소록 작성");


실행 시 창 크기의 가로를 조금 늘려주겠습니다.


primaryStage.setWidth(615);





BorderPane을 지우지 않고 그대로 사용하겠습니다.


Library에 Pane을 검색하여 좌측 아래의 Hierarchy Border의 Top부분에 끌어다 놓고 안에 TextField 4가지, Button 2가지


TableView는 Center에 끌어다가 배치합니다.


TableColumn은 아래와 같이 추가합니다.




컬럼 이름에 오른쪽 클릭해서 Copy & Paste, Duplicate 둘 중 마음에 드는걸 사용.





Pane : Layout : Pref Width : 600, Pref Wifth : 80


TextField : Properties : Prompt Text - 이름


   Code : fx:id - nameField


TextField : Properties : Prompt Text - 주소


   Code : fx:id - addrField


TextField : Properties : Prompt Text - 폰번호


   Code : fx:id - phoneField


TextField : Properties : Prompt Text - 이메일


   Code : fx:id - mailField


Button : Properties : Prompt Text - 등록


Code : fx:id - regist


Button : Properties : Prompt Text - 초기화


Code : fx:id - init


TableView : Code : fx:id - table


TableColumn : Properties : Prompt Text - Name


   Code : fx:id - name


TableColumn : Properties : Prompt Text - Address


   Code : fx:id - address


TableColumn : Properties : Prompt Text - Phone


   Code : fx:id - phone


TableColumn : Properties : Prompt Text - E-mail


   Code : fx:id - email



package app;

import java.net.URL;
import java.util.ResourceBundle;

import app.model.TableRowModel;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.TextField;

public class MainController implements Initializable {
	// 필드
	@FXML private TextField nameField;
	@FXML private TextField addrField;
	@FXML private TextField phoneField;
	@FXML private TextField mailField;

	// 테이블&컬럼
	@FXML private TableView<TableRowModel> table;
	@FXML private TableColumn<TableRowModel, String> name;
	@FXML private TableColumn<TableRowModel, String> address;
	@FXML private TableColumn<TableRowModel, String> phone;
	@FXML private TableColumn<TableRowModel, String> email;


	ObservableList<TableRowModel> list = null;
	@Override
	public void initialize(URL location, ResourceBundle resources) {
		System.out.println("FXML Load Complete");
		list = FXCollections.observableArrayList();
		// Model 객체가 list에 추가
		// lee, seoul, 010-1234-5678, email
		list.add(new TableRowModel("lee", "seoul", "no phone", "email"));

		// 각 필드를 CellData 인터페이스에
		name.setCellValueFactory(cellData -> cellData.getValue().getName());
		address.setCellValueFactory(cellData -> cellData.getValue().getAddress());
		phone.setCellValueFactory(cellData -> cellData.getValue().getPhone());
		email.setCellValueFactory(cellData -> cellData.getValue().getEmail());

		table.setItems(list);
	}
	public void regist() {
		list.add(new TableRowModel(nameField.getText(), addrField.getText(), phoneField.getText(), mailField.getText()));
		name.setCellValueFactory(cellData -> cellData.getValue().getName());
		address.setCellValueFactory(cellData -> cellData.getValue().getAddress());
		phone.setCellValueFactory(cellData -> cellData.getValue().getPhone());
		email.setCellValueFactory(cellData -> cellData.getValue().getEmail());
		// setItems는 자동으로 감지됨

		// 사용자 편의성을 위해 초기화
		nameField.setText("");
		addrField.setText("");
		phoneField.setText("");
		mailField.setText("");
		
		// 리스트의 모든 값 출력 하기
		// TableRowModel을 새로 list를 넣어 향상된 for문으로 출력
		for(TableRowModel model : list) {
			System.out.println(
					model.getName().get()+" | "+
					model.getAddress().get()+" | "+
					model.getPhone().get()+" | "+
					model.getEmail().get()
			);
		}
	}
	public void init() {
		list.clear();
		// 리스트를 직접 핸들링 한 경우는 이 부분이 필요
		table.setItems(list);
	}

}
package app.model;

import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;

public class TableRowModel {
	private StringProperty name;
	private StringProperty address;
	private StringProperty phone;
	private StringProperty email;
	// 생성자 (Alt + Shift + S 로 쉽게 등록(Constructor))
	public TableRowModel(String name, String address, String phone, String email) {
		this.name = new SimpleStringProperty(name);
		this.address = new SimpleStringProperty(address);
		this.phone = new SimpleStringProperty(phone);
		this.email = new SimpleStringProperty(email);
	}
	// 게터세터 (Alt + Shift + S 로 쉽게 등록)
	public StringProperty getName() {
		return name;
	}
	public void setName(StringProperty name) {
		this.name = name;
	}
	public StringProperty getAddress() {
		return address;
	}
	public void setAddress(StringProperty address) {
		this.address = address;
	}
	public StringProperty getPhone() {
		return phone;
	}
	public void setPhone(StringProperty phone) {
		this.phone = phone;
	}
	public StringProperty getEmail() {
		return email;
	}
	public void setEmail(StringProperty email) {
		this.email = email;
	}
	
}





Main.java 설정


Parent root = FXMLLoader.load(getClass().getResource("main.fxml"));


primaryStage.setTitle("image view");


fxml파일의 Border pane 삭제





AnchorPane위에


ImageView : Layout은 원하시는대로 사이즈를 잘 맞춰보세요.


Code : fx:id - imgView


Button : Code : On Action - fileChoose


먼저 Controller로 설정한 java파일이 시작(initialize)될 때 이미지를 웹에서 끌어와 기본 이미지로 띄울 것이고


그리고 이미지 선택 버튼을 누르면 윈도우 파일 선택창이 나오고 그 파일을 InputStream으로 받아서 ImageView에 띄우는것.



package app;

import java.io.BufferedInputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.net.URL;
import java.util.ResourceBundle;

import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.stage.FileChooser;
import javafx.stage.FileChooser.ExtensionFilter;

public class MainController implements Initializable {
	@FXML private ImageView imgView;
	
	@Override
	public void initialize(URL arg0, ResourceBundle arg1) {
		System.out.println("FXML Load Complete");
		// 기본 이미지(웹 이미지)
		// http://img.hani.co.kr/imgdb/resize/2017/0623/00502643_20170623.JPG , 치킨주의!!
		String url = "http://img.hani.co.kr/imgdb/resize/2017/0623/00502643_20170623.JPG";
		Image img = new Image(url);
		// 선택한 이미지의 사이즈 조절이 가능하다.
		imgView.setFitHeight(372);
//		imgView.setFitHeight(img.getHeight()/2);
		imgView.setFitWidth(372);
		imgView.setImage(img);
	}
	
	public void fileChoose() {
		// 사진 선택 창
		FileChooser fc = new FileChooser();
		fc.setTitle("이미지 선택");
		fc.setInitialDirectory(new File("C:/")); // default 디렉토리 설정
		// 선택한 파일 정보 추출
		// 확장자 제한
		ExtensionFilter imgType = new ExtensionFilter("image file", "*.jpg", "*.gif", "*.png");
//		fc.getExtensionFilters().add(imgType);
		ExtensionFilter txtType = new ExtensionFilter("text file", "*.txt", "*.doc");
		fc.getExtensionFilters().addAll(imgType, txtType);
		
		File selectedFile =  fc.showOpenDialog(null); // showOpenDialog는 창을 띄우는데 어느 위치에 띄울건지 인자를 받고
																// 그리고 선택한 파일의 경로값을 반환한다.
		System.out.println(selectedFile); 				// 선택한 경로가 출력된다.
		
		// 파일을 InputStream으로 읽어옴
		try {
			// 파일 읽어오기
			FileInputStream fis = new FileInputStream(selectedFile);
			BufferedInputStream bis = new BufferedInputStream(fis);
			// 이미지 생성하기
			Image img = new Image(bis);
			// 이미지 띄우기
			imgView.setImage(img);
		} catch (FileNotFoundException e) {
			e.printStackTrace();
		}
		
	}
	
}














+ Recent posts