실험프로젝트

버튼의 배치를 하였다
GridbagLayout를 사용하려 했는데 내가 진도가 느려서
일단 setBounds를 이용하였다.

  //버튼에 이미지 넣기
  for(int i=0; i<imageArr.length; i++)
  { 
   toolArr[i] = new JButton(imageArr[i]); //이미지 삽입
   /* toolArr[i].setPreferredSize(new Dimension(imageArr[i].getIconHeight(), 
    imageArr[i].getIconWidth())); //버튼 사이즈 변경 */
   
   if(i%2==0)
   {
    toolArr[i].setBounds(30, 14*(i+1), imageArr[i].getIconHeight(), 
                                                    imageArr[i].getIconWidth());
   }
   
   else if(i%2==1)
   {
    toolArr[i].setBounds(55, 14*i, imageArr[i].getIconHeight(), 
                                                imageArr[i].getIconWidth());
   }
   tool_pan.add(toolArr[i]); //패널에 버튼들 추가
  }

tool_pan.setLayout(null); 으로 설정하여 사용한 것이다.
빨간글 부분은 수정전의 소스에서는 버튼의 사이즈를 조절하기 위해 설정한 것인데
setBounds()를 이용함으로써 필요가 없어졌다.
일단 저 부분은 주석처리로 해놓고 나머지 필요한 부분들도 만들어 놓은 후에
GridbagLayout으로 설정을 변경해 보려 한다
그리고 지금 툴판만 보이는 이유는 각각의 기능판을 생성 후에
주요클래스에 배치하는 식으로 클래스를 생성하려 한다.

버튼의 크기를 변경했다

 for(int i=0; i<imageArr.length; i++)
        {
            toolArr[i] = new JButton(imageArr[i]);
            tool_pan.add(toolArr[i]);
        }

원본 그림의 사이즈를 34 X 34 에서 24 X 24로 변경하여

for(int i=0; i<imageArr.length; i++)
  { 
   toolArr[i] = new JButton(imageArr[i]);
   toolArr[i].setPreferredSize(new Dimension(imageArr[i].getIconHeight(),
                                        imageArr[i].getIconWidth()));
   tool_pan.add(toolArr[i]);
  }

버튼의 사이즈를 이미지 사이즈에 맞춰 변경해주었다
그랬더니 조그맣게 보기 좋게 되었다

얏호 해결됬다.
내가 직접 만든 이미지다. 연필이랑 지우개랑 삼각형 그리기가 제일 힘들었다;




이제 적정한 위치에 배열을 해주면 된다.
그리고 버튼 크기도..!
크기는 사진 사이즈를 줄이면 줄을라나..

class ButtonPan extends JFrame{
    private Container contentPane = getContentPane();
    private JPanel tool_pan = new JPanel();  //툴판
    private JButton[] toolArr;     //툴버튼
    ImageIcon[] imageArr = {new ImageIcon("image\\Line.gif"),
        new ImageIcon("image\\Pencel.gif"), new ImageIcon("image\\Square.gif"), 
        new ImageIcon("image\\clSquare.gif"), new ImageIcon("image\\Triangle.gif"), 
        new ImageI con("image\\clTriangle.gif"), new ImageIcon("image\\Circle.gif"), 
        new ImageIcon("image\\clCircle.gif"), new ImageIcon("image\\Text.gif"), 
        new ImageIcon("image\\Eraser.gif")};

    public ButtonPan() {
        toolArr = new JButton[imageArr.length];
 
        for(int i=0; i<imageArr.length; i++)
        {
            toolArr[i] = new JButton(imageArr[i]);
            tool_pan.add(toolArr[i]);
        }

        contentPane.add(tool_pan);
        setVisible(true);
        pack();
        setTitle("ToolsPan");
    }
 
    public static void main(String[] args) throws Exception
    {
        new ButtonPan();
    }
}

빨간 부분들이 앞의 소스와 달라졌다
괜히 너무 어렵게(or 쉽게)생각했나보다
신경을 잘 못쓰다보니 소스쓰는 방법을 자꾸 잊어먹는 듯 싶어
에러는 없고 알 수 없는 경고만 잔뜩 ㅠㅠ

일단 앞의 오류부분을 하나 해결했다

    //아이콘배열에 이미지 생성
    for(int i=0; i<imageArr.length; i++)
    {
        iconArr[i] = new ImageIcon(imageArr[i]);
    }
  
    //툴배열에 아이콘 삽입
    for(int i=0; i<imageArr.length; i++)
    {
        toolArr[i] = new JButton(new ImageIcon(imageArr[i]));
        tool_pan.add(toolArr[i]);
    }

소스에서 보니깐 내가 배열의 갯수를 지정해주지 않았다.

     toolArr = new JButton[imageName.length];

이 소스 하나 추가해줬더니 해결..
하지만 또 문제는

    toolArr[i] = new JButton(new ImageIcon(imageArr[i]));

이 부분이다.
이미지의 이름을 String으로 넣으면 그 글자만 버튼에 써져버리고
저렇게 배열을 이미지아이콘으로 넣어도 이미지가 들어가지 않는다..
이미지를 배열로 처리해서 버튼에 어떻게 넣으면 좋을까..

툴들의 버튼이 여러개이기 때문에 배열을 이용하여 정리했다.


private Container contentPane = getContentPane();
private JPanel tool_pan = new JPanel();  //툴판
private JButton[] toolArr;     //툴버튼
private ImageIcon[] iconArr;    //아이콘배열 
private String[] imageArr = {"image\\Line.gif", "image\\Pencel.gif", 
    "image\\Square.gif", "image\\clSquare.gif", "image\\Triangle.gif",
    "image\\clTriangle.gif", "image\\Circle.gif", "image\\clCircle.gif",
    "image\\Text.gif", "image\\Eraser.gif"};

public ToolsPan() {
    tool_pan.setLayout(new GridLayout(3,2));  <------------ 임의로 정함

    //아이콘배열에 이미지 생성
    for(int i=0; i<imageArr.length; i++)
    {
        iconArr[i] = new ImageIcon(imageArr[i]);
    }
  
    //툴배열에 아이콘 삽입
    for(int i=0; i<imageArr.length; i++)
    {
        toolArr[i] = new JButton(new ImageIcon(imageArr[i]));
        tool_pan.add(toolArr[i]);
    }

    contentPane.add(tool_pan);
    setVisible(true);
    pack();
    setTitle("ToolsPan");

============================================================================

빨간 부분들을 이렇게 해보면 내 머릿속에선 될 것만 같은데 실행해보면
Exception in thread "main" java.lang.NullPointerException
        at ToolsPan.<init>(ToolsPan.java:43)
        at ToolsPan.main(ToolsPan.java:60)
란 응답뿐...

private String[] imageArr = {"image\\Line.gif", "image\\Pencel.gif", 
    "image\\Square.gif", "image\\clSquare.gif", "image\\Triangle.gif",
    "image\\clTriangle.gif", "image\\Circle.gif", "image\\clCircle.gif",
    "image\\Text.gif", "image\\Eraser.gif"};

이 부분이 내가 생각하는 것처럼 안되는 거아니면 배열을 잘못 생각하고 있는 것인 듯 싶다.
이미지와 버튼을 하나하나 연결시키면 잘 실행되지만 그러면 소스가 지저분해지는 것 같아 싫다.
배열로 할 수 있을텐데.. 꼭 배열로 해결하고 싶은데 ㅠ

수술경과는 회복은 더디지만 잘 되고 있는 것 같습니다ㅎ
내가 학교에 못가서 표정이에게 네트워크부분에 대해 전해 듣게 되었다.
API로 인해 계획에 차질이 ㅠㅠ
그래서 다른방법을 생각해보았다.

1번째 방법
맨 아래쪽 버튼 왼쪽에 조그마한 대화창을 만드는 것이다.
그래서 그림을 그리면서 대화가 하고 싶으면 대화를 하는것이다.

2번째 방법
1번 방법에 조금 더 응용을 해서 서로 그림그린게 보이면서
대화를 하는 것이다.

3번째 방법
그린 그림을 메일로 전송하는 것이다.
그냥 편지지가 아닌 그림 편지지 같은..


현제 네트워크를 어디까지 어떻게 사용할 줄을 몰라서
구체적인 계획을 못잡겠다.
교수님 방법들을 살펴봐주시고 방안을 조금만 제시해주시면
감사하겠습니다~

블로그가 늦어져서 죄송합니다ㅠ
이번주 월요일날 시력교정수술을 받아서 지금도 화면이랑 글이 잘 안보여
키보드감만 보고 치느라 오타가 좀 있더라도 양해부탁드립니다 교수님~


============================ 프로젝트 계획서 ============================

1. 프로젝트 제목
- 그림판 만들기

2. 개발 동기
- 처음에 개인적으로는 일정표, 가계부, 또는 저번학기에 만들었는 프로그램을
텍스트가 아닌 그래픽 형식으로 만들어 볼까 생각하고 있었는데 같은 조가 된
표정이가 방학중에 그림판을 공부해 보았고 하면 좋을 것 같다고 제안하여
그림판을 개발하기로 경정하였습니다.

3. 구현(기능) 목표
- 일반적인 그림판의 기능을 표현하지만 정말 필요한 중요 기능만을 일단
우선시 하며 만들어 최종적으로 네트워크 기능을 이용하여 게시판에 그림을
올릴 수 있도록 합니다.
주요 기능은 각각 다른 배경의 캔버스, 레어이 추가, 툴 버튼틀, 그림 불러오기,
게시판에 올리기, 색 선택하기, 그림의 확대/축소, 캔버스에 그림 그려지기가
있겠습니다.
※ 기능의 구현은 네번째 글에 써놓아서 자세히 따로 또 쓰지 않았습니다.
문제가 된다면 다시 수정하겠습니다~(버튼을 다 만든 후) ※

4. 개발일정
1 주차 (10/19~10/25) : 프레임에 버튼과 기능을 위한 배치 디자인
2 주차 (10/26~11/01) : Canvas 및 도형 버튼 기능 구현
3 주차 (11/02~11/08) : 색깔 버튼 기능 구현
4 주차 (11/09~11/15) : 네트워크를 이용한 기능 구현
5 주차 (11/16~11/22) : 수정 및 보안 작업

5. 역할분담
- 조성진 : 프레임에 관한 전체적인 버튼의 배치와 디자인 관련을 담당.
               그림판에서 각 버튼의 전체적인 배치 구성, 캔버스의 크기 지정, 
               색 버튼을 선택하면 선의 색깔을 바꾸는 기능을 구현.
            
- 강표정 : 그림판에 그림이 그려질 수 있도록 기능적인 부분을 담당.
               툴 버튼을 눌러 선, 도형 등의 그림을 캔버스에 그리기,
               탭을 이용하여 다양한 배경의 캔버스로 전환하는 기능을 구현.

- 합동 부분 : 네트워크 부분으로 게시판에 그린 그림을 등록
                   그 외 부분은 작업 하면서 진행 예정

6 참고 자료
- http://cafe.naver.com/javachobostudy.cafe[네이버카페 java 초보스터디]
- HeadFirst JAVA [케이시 시에라, 버트 베이츠 저/서환수 역]
- 스윙 [Matthew Robinson, Pavel Vorobiev 저/이재신, 현진호, 이지영 역]
- JAVA의 정석 [남궁성 저]

오늘 한 일은 일단 프레임을 나눠봤다.

프레임에 BorderLayout()을 생성하여 West, East, South, Center로 나눴다.

 

West - 각종 툴 아이콘 버튼들이 있을 툴판 Panel

Panel에 그림을 그리는데 필요한 툴들을 버튼을 생성하여

GridLayout을 사용하여 배치할 것이다.

 

East - 그림판의 그림 그린것을 취소, 확대&축소, 레이어를 추가&삭제 하는 각종 설정판 Panel

그림 그린것을 취소하거나 취소했던것을 다시 취소, 그림판을 확대해서 보거나 축소해서 보기,

레이어를 추가해서 그리거나 그것을 다시 삭제하거나 하는 기능들을 해주는 것인데

가장 어려운 부분일 듯 싶다. 그림 그린것 취소와 확대&축소 기능은 넣을지 말지 확정된것은 아니다.

 

South - opne버튼, enter버튼, cancel버튼이 있는 선택판 Panel

사진을 불러오는 opne버튼, 게시판에 올리는 enter버튼, 그림판을 끄는 cancel버튼이 있다.

메뉴바로 만들어도 되는 것들이지만 많은 기능이 있는 것이 아니기때문에 3가지 버튼으로

만들어 놓는게 더 깔끔할 것 같다.

 

Center - 배경이 다른 그림판들을 탭으로 나눠놓은 그림판 Panel

배경은 정확히 정한 것이 아닌데 일단 기본 하얀배경이 존재하며 2~3가지 정도의 배경을 추가하려 한다.

 

그런데 그림판 Panel을 생성한 후 실행해보니 화면을 거의 다 차지하기에

그림판 Panel에 Canvas를 생성하여 크기를 설정하였다.

쓸데없는(?) 짓인가;

Content로 사용하면 해결이 될 지 다시 해봐야겠다.

 

또한 아직 swing명령어와 구성어를 다 모르다 보니 클래스나 메소드별로

프로그램을 나눠 작성하지 못하는 중이다.

다른 예제를 많이 해보여 익히며 이해하는게 도움이 되는 듯 싶다.

일단은 메인에만 생성하여 테스트 중이다.

그 후 정리해도 될 것만 같다.

이번주는 딱히 진행된 일이 없기때문에 블로그내용을 안쓴다.
수업도 제대로 못듣고..
이클립스를 제대로 쓰고싶어서 이클립스사용법만 공부했다.
제대로 된게 없는 주였다ㅠ
목요일이면 운전면허최종시험을 봐서 드디어 끝난다.
그러면 추석끝나고 스피드하게 진행해야겠다.
집앞도서관에 좋은 책이 많으니 자주 이용해주고 표정이와도 일끝나고
만나서 계속계속 진행해야겠다.

어째뜬 이번주는 별 소득(?)이 없는 주였다

이제는 역할분담도 정해졌다
구체적이게는 아니지만 그래도 진행이 되어야하기때문이다.
일단 GUI구성과 프로그램은 내가 맡기로했다.
작년 동아리 프로젝트 때(무산되었지만;) 조금 해보았다고 했더니
GUI부분은 내가 좀더 구체적으로 보는게 좋을 것 같다고 했다.
하지 않은지 오래 되어서 기억도 안나 걱정이 되지만 하다보면
기억이 나겠지.. 그때 나름 재미있게 했었기 때문에 이번프로젝트가
역시나 심적으로 압박이 마구 몰려있지만 싫은것은 아니다.
그동안에 표정이는 이벤트기능에 대해 알아보기로 했다.
이벤트보다는 GUI를 먼저 끝내고 그 아이콘마다 이벤트를
추가해주는 순서여야 할 것 같다.
그러기 위해선 내가 GUI작업을 부지런히 수행해야만 하는데ㅠㅠ

생각은 고만하고 있다가 오후에 노트북을들고 학교도서관에 가서
기초적인 틀이라도 직접 작성해서 만들어봐야겠다.