B001_01.jpg



안녕하세요.

 

유형석입니다.

 

이번에는 윈도우 빌더를 이용한 간단한 예제 입니다.


1. 기본화면

   

일단 프로젝트 만드는 방법을 잊어 버린 분은


클릭!


프로젝트를 만든 상황 부터 설명 드리겠습니다.


  WB_3_01.png


디자인 툴에서 위와 같이 버튼을 클릭 원하는 위치에 끌어다 줍니다.


 WB_3_03.png


버튼을 넣으려고 했는데 위처럼 되시는 분은


WB_3_04.png


파렛트에서 Absolute layout 을 클릭 하시고 오른쪽에 나타나 있는 윈도우 창을 클릭 해주시면 맨 처음 모양대로 되실 겁니다.


WB_3_05.png


버튼을 추가 했으면 이벤트를 만들어 봅시다.

Properties 에 Show evetns를 클릭하면 여러가지 이벤트가 나오는데

저희는 mouse 에 반응하는 이벤트를 만들어 보려고 합니다.


자 mouse 에빈트를 펼치고 clicked 에서 더블 클릭을 누릅니다.


 

         JButton btnNewButton = new JButton("New button");
        btnNewButton.addMouseListener(new MouseAdapter() {
            @Override
            public void mouseClicked(MouseEvent arg0) {
            }
        });
        btnNewButton.setBounds(12, 10, 97, 23);
        frame.getContentPane().add(btnNewButton);


창이 소스 보기로 변경 되면서 위와 같이 소스에 자동으로 추가 된 것을 볼 수 있습니다.

자 다시 하단에 Design 버튼을 눌러봅시다.


WB_3_06.png


오호 mouse라는 이벤트에는 clicked가 활성화 되어 있고,

clicked 이벤트의 내용은 소스의 46번째 라인에 있다고 표시 되어있습니다.


다시 한번 clicked를 더블 클릭 해봅시다.


WB_3_07.png


자동으로 이벤트 코드가 있는 부분으로 넘어 갑니다.

그럼 이제 클릭 됐을때 어떻게 반응 할 것인지 추가해 봅시다.

이 부분은 손코딩으로 하셔야 됩니다~


         JButton btnNewButton = new JButton("New button");
        btnNewButton.addMouseListener(new MouseAdapter() {
            @Override
            public void mouseClicked(MouseEvent arg0) {
                btnNewButton.setText("Clicked");                        // 추가 된 코드
            }
        });
        btnNewButton.setBounds(12, 10, 97, 23);
        frame.getContentPane().add(btnNewButton);


간단한 소스 코드 입니다.

클릭 하면 버튼에 있는 글자가 Clicked로 변합니다.

하지만 이렇게만 하면 이클립스는 친절하게 오류를 띄워 줍니다.


WB_3_08.png


이클립스의 조언에 따라서 클릭, 또 클릭 해줍니다.


         final JButton btnNewButton = new JButton("New button");  // final 이 추가됨
        btnNewButton.addMouseListener(new MouseAdapter() {
            @Override
            public void mouseClicked(MouseEvent arg0) {
                btnNewButton.setText("Clicked");
            }
        });
        btnNewButton.setBounds(12, 10, 97, 23);
        frame.getContentPane().add(btnNewButton);

위 처럼 소스 코드가 변하는걸 볼 수 있습니다.

이제 저장을 하고 한번 실행해 봅시다.


WB_3_09.png



프로젝트에서 우클릭을 하고 Run AS -> Java Application 을 클릭합니다.


WB_3_10.png


아 아쉽게도 버튼 글자가 짤렸네요.

하지만 지금은 그게 중요한게 아닙니다.

한번 클릭을 해보죠?


WB_3_11.png


네 다행히도 아주 잘됩니다. 으하하


이번을 마지막으로 Window Builder에 대한 설명을 마무리 짓겠습니다.

나머지 부분은 책을 구입 하시거나 구글신을 영접 하시어 신속한 코딩을 하시는걸 권장 합니다.


맨 처음 말씀 드렸지만 초보자이나, 손코딩 노가다로 위치 배치하기 힘들때 쓰는 용도로만 적절하다고 봅니다.

아니면 이벤트의 종류나 환경 설정이 뭐가 있는지 확인하는 용도로 하는게 좋겠죠?


이 Window Builder의 최대의 약점은 코드가 본인 스타일대로 되어 있지 않아 혼란이 올 수 있고,

클래스 같은건 자동으로 나눠주지 않습니다.


적절히 사용하시다가 입맛에 맛게 조절 하시는게 가장 바람직하다고 보입니다.


이로서 Window Builder의 설명을 모두 마치겠습니다.


짧은 글 읽어 주셔서 감사합니다!