2012년 7월 22일 일요일

스윙으로 레이어 만들기(JLayeredPane)

혹시 여러분은 자바의 마스코트가 무엇인지 아는가?
모르겠다면 여기를 보시라~ 쨔잔~


자바(Java)의 공식 마스코트인 듀크(Duke)를 소개합니다당.


크흐 역시 자바의 마스코트에 걸맞게 공부를 하고 있군요.^^

듀크는 오래전 썬마이크로시스템스사에서 자바를 개발할 당시에 그린 프로젝트팀(Green Project Team)의 첫작품 스타7(Star7)이라는 홈 엔터테인먼트 기기의 유저인터페이스에 삽입된 만화캐릭터가 있는데 그게 바로 지금 소개한 듀크다. 당시 팀의 그래픽을 담당했던 멤버로서 듀크를 디자인한 조 팔랑(Joe Palrang)은 지금은 너무나도 유명한 애니메이션 영화 "슈렉"으로 널리 알려진 그래픽 아티스트다. 이런 듀크는 2006년 자바 테크놀로지의 공식 마스코트로 세상에 널리 알려지게 되면서 대표적인 오픈소스 시대의 아이콘으로 자리잡았다.

필자가 갑자기 강의는 하다말고 도대체 왜 듀크를 소개하느냐고 부글부글 학구열에 불타오르는 이가 혹시 있을지도 모르겠는데 만약 만에 하나 혹시라도 만명중에 한명이라도 있다면 진정하라. 그건 다름아닌 필자의 강의에 JLayeredPane 특별게스트로 듀크가 등장하기 때문이다.ㅎㅎ

지금부터 잠시 숨은 그림 찾기를 시작해 보겠다. 아래의 두 그림을 보면서 듀크가 어느 판떼기(?) 선상에 있는지 대답해보기 바란다.^^



자 위의 두 그림에 듀크가 여러분에게 손을 흔들고 있다. 듀크는 어느 판떼기 선상에 있는가? 첫번째 그림부터 보면 처음은 Yellow (0) 판떼기랑 같은 레벨에서 손을 흔들고 있고 두번째 다음 그림에는 Cyan (2) 판떼기랑 동일 선상에서 손을 흔들고 있다. 그림의 상단부분을 보면 이미 해답이 나와있는 것을 알수 있을 것이다. 여기서 필자가 진정 말하고자 하는 부분은 이렇게 판떼기를 겹겹히 쌓아놓은 것만으로도 입체감있게 화면구성이 가능하다는 점이다. 이런 구성은 여러분이 평소 알게 모르게 접하고 있는 프로그램들의 메뉴바나 툴바같은 화면을 상상하면 이해가 쉬울 것이다. 그림을 보면 듀크가 빨간 판떼기 뒤에서 손을 흔들고 있는것처럼 보이지 않는가? 바로 이렇게 원근감 있게 화면을 구성가능하도록 만들어주는 스윙 클래스가 바로 오늘 배울 JLayeredPane 되시겠다.ㅎㅎ

서론이 길었다만 자바 3D(3rd Dimension) 세계를 몸소 체험할수 있는 강의가 이제부터 전개된다. 그 이름하여 JLayeredPane 되시겠다. 자 영어가 약한 이들은 단어부터 찾아본다. layer랑 pane이 무엇인지를 말이다. 대충 감이 올텐데 간단하게 필자가 그냥 못박아서 말해주겠다. 층층이 쌓아놓은 판떼기로 해석하면 되겠다.ㅎㅎ

자바코드가 어쨌거나 영어로 만들어야되다보니 layer나 pane같은 용어가 나오면 말그대로 레이어 때문에 폐인이 되는듯한 금단현상(?)이 올지도 모르겠다. 여러분은 오늘 아마 시간이 지나면 지날수록 온몸의 사지가 마비되고 경직되어 심한 정보로 인한 심부전 및 심장마비등 호흡중추를 마비시키는 강한 부작용이 일어날수 있으나 그것은 모두 필자의 강의에서 비롯되는 엄청난 희열로 촉발된 엔돌핀에 유발되는 반응이기 때문에 안심해도 된다. 오늘 강의가 그 정도의 폭발력을 가진 강좌이기 때문에 그런 현상은 지극히도 당연한 것이다.ㅎㅎ 그러니 본 강의에 졸지말고 눈좀 뜨란 말여~ 껄껄 강좌가 진행될수록 필자의 농(?)만 들어가는구나.ㅎㅎ

다시 돌아가서 위의 그림들을 보면 칼라 옆에 괄호로 숫자들이 적혀있을 것이다. 그게 무엇을 표시한거냐면 깊이(depth)다. 수치가 높을수록 점점더 층이, 레이어가 높아진다고 생각하면 쉽게 이해가 될것이다. 한마디로 위판떼기부터 아래판떼기까지의 깊이라 생각하면 된다. 유식한말로 Z order 젯 오더다. 오케? ^^

그럼 언제나처럼 이제 필자가 한타 한타 하루가 일년같이 정성에 정성을 쏟아부은 명품(名品) 예제를 보는 시간을 갖겠다. 항상 그렇지만 이상하리만치 예제만 보아도 술술 이해되는 놀라운 경험을 하게 될것이다. 단 그를 위해선 한가지 조건이 있다. 타자좀 쳐라~ 그냥 눈으로 보지만 말고~~ 난 다 알고있다. 그(?)가 누군지. -.-; ㅎㅎ 그럼 어떤걸 만드는지 결과부터 보고 소스를 보기로 하자.




총 다섯장의 판떼기를 만들었다. 어떻게 이렇게 판떼기를 겹겹히 쌓아놓은 것처럼 보이게 만들수 있을까? 다시 말해서 JLayeredPane 클래스를 어떻게 써야 이렇게 입체감이 나게 만들수 있을까?  여러분은 오늘 강좌를 통해서 이제 자바로 3D(?)를 구현할수 있게 된다. 개봉박두~ ㅎㅎ 그럼 소스를 보자.



소스가 좀 길어서 그런지 눈이 침침하다 하는 이들은 클릭혀라. ㅎㅎ 소스가 길어보이나 여러분이 오늘 알아야할 내용은 단지 아래의 여섯줄에 불과하다.

JLayeredPane jlp=frame.getLayeredPane( );

jlp.add(one,new Integer(0));
jlp.add(two,new Integer(100));
jlp.add(three,new Integer(200));
jlp.add(four,new Integer(300));
jlp.add(five,new Integer(400));

그래도 설명을 덧붙이자면 프레임을 만들고 판떼기를 간단하게 버튼으로 만들었다. 이미 JButton에 대해서 배웠으니 코드보고 이 정도는 손쉽게 진행가능하리라 생각한다. 그리고 오늘 배우려는 JLayeredPane에 대해서 덧붙이면 끝난다. 여기서도 조금 더 덧붙이자면 버튼만들때 setBackground( )랑 setBounds( ) 메소드는 어디서 튀어나온거야 하는 이들은 없겠징? 이미 써보기도 했을 것이고 이제 이런건 스스로 깨우칠때가 되었지만 다시 설명하자면 JButton에 대해서 곰곰히 들춰보면 대부분의 스윙 클래스가 그렇듯이 기존의 awt 콤포넌트(Component)와 컨테이너(Container) 내용을 다 쓸수 있도록 계승하고 있다. 이런 메소드들은 콤포넌트의 일종이므로 별다른 제약없이 필요하면 이렇게 그래픽 요소들을 편하게 쓸수 있도록 자바에서 배려해놓은 것이니 잘만 활용하면 될것이다. 말한김에 컨테이너는 콤포넌트를 보강하기 위해 만들어놓은 것이라 생각해도 무방하다. 그리고 이런 것들을 스윙에서는 JComponent에서 계승하고 있다. 사실 이런건 자바 클래스 족보를 열심히 보면 자연스레 습득되는 것이니 이거 또 외운다고 그러지는 말아라. 족보도 필자가 초반에 보여줬을텐데 언젠가 써먹게될꺼라고 말이다.ㅎㅎ

자 사설 그만접고 다시 강의로 돌아가서 보면 setBackgound( )는 한마디로 판떼기 색깔 정하자는 것이고 setBounds( )는 판떼기 위치랑 사이즈 정하자는 것이다. 이건 예전 시간에 했으니 따로 설명하지 않겠다. 자 그럼 본격적으로 오늘의 핵심인 위의 코드 여섯줄을 분석해 보자.

JLayeredPane jlp=frame.getLayeredPane( );

말그대로 JLayeredPane 쓰려고 jlp라는 인스턴스를 만들었다. 오른편은 지금 이 프레임에 레이어페인 쓰기위해 가져오자는 것이다. JApplet, JDialog, JFrame, JInternalFrame, JRootPane, JWindow, RootPaneContainer 같은 클래스에서는  이런 레이어 페인을 자동으로 쓸수 있게끔 되어있으므로 그냥 가져와서 편하게 쓰면 된다. 그리고나서 소스처럼 JLayeredPane에다가 add( ) 메소드를 이용해서 각 판떼기에 깊이를 Integer를 이용해서 수치를 지정하면 수치에 따라 화면에 판떼기가 층층이 쌓이는 것이다.ㅎㅎ 물론 수치는 아무거나 바꿔도 된다. 수치 바꿔가면서 어떻게 판떼기 배치가 바뀌는지 관찰하면서 공부하기 바란다. 필자가 수치를 이렇게 적어놓은것도 판떼기를 다섯장 만든것도 다 이유가 있는데 그 이유는 좀더 읽어보면 필자의 아낌없이 퍼주는 세심한 배려에 여러분의 마음은 장작불을 때듯 뜨겁게 타오를 것이다.^^

잠깐, 아직 안 끝났다.ㅎㅎ 밑에 보면 코드 다섯줄 생략해 놓은 부분이 있는데 이것을 이제부터 설명하겠다. 정확히 위의 다섯줄과 대체가 가능한데 아래의 그림 한장을 보면 특별한 설명없이도 저절로 이해가 될것이다.^^


자바에서는 판떼기를 편하게 배치하라고 이렇게 이름을 만들어 놓았다.

한마디로
DEFAULT_LAYER랑 new Integer(0)랑 같고
PALETTE_LAYER랑 new Integer(100)랑 같고
MODAL_LAYER랑 new Integer(200)랑 같고
POPUP_LAYER랑 new Integer(300)랑 같고
DRAG_LAYER랑 new Integer(400)랑 같다.

일반적으로 레이어를 놓으면 DEFAULT_LAYER 깊이로 정해진다고 생각하면 된다. 그리고 사실 디폴트 레이어 밑에 FRAME_CONTENT_LAYER 즉 new Integer(-30000)에 해당하는 레벨의 레이어가 있는데 잘은 쓰지 않으므로 일단 참고로 있다고만 알아두기 바란다. 이런 명령어들은 편하게 쓰라고 자바에서 배려해놓은 코드인데 이 내용을 몰라서 저건 또 뭐지뭐지하는 이들이 많은데 오늘 강이의 자바 강좌를 정독한 이들은 이제 이런 늪에서 빠져나오기 바란다.^^ 그동안 스윙 강좌만 계속 진행하니 다른 논리 강좌 좀 해달라고 물밀듯이 밀려오는 성화에 필자는 여러분의 요청을 급겸허히 받아들여 다음 시간에 스윙에 관련된 강좌를 마지막으로 진행하고 다른 부분을 건드리기로 심사숙고해서 결정을 내렸다. 필자가 중대한 결정을 내린만큼 남은 마지막 시간까지 최선을 다해 강의에 임해주기 바란다. 이상은 원래 예정된 강좌 수순이므로 어차피 다음이 마지막 스윙 강좌인 것을 강조할겸해서 급과장을 한것임을 특별히 알리는 바이다. 장문의 글을 읽느라 수고 많았다. 모두 냉수나 한잔 마시자~ㅎㅎ

댓글 1개:

  1. 2주동안 첨부터 쭉~ 쭉~ 따라왔는데 갑자기 강의가 끊겼네요
    우짜면 좋나요? ㅜㅜ
    당장 실습에 접목하려해도 실상 강의를 보면서 해본게 전부라
    당장은 힘든데요
    간단한 소스라도 구경할 기회가 있다면 좀 더 많은 도움이
    될 듯한데요..
    강의 계속 부탁합니다~ ㅎㅎ;;;

    답글삭제