윈도 GUI 프로그래밍시 메뉴와 함께 있으면 유용한 기능중 하나가 툴바(ToolBar)입니다.
흔히 이런 것들로 보통 타이틀바나 메뉴 바로 아래즈음에 아이콘들로 주르륵~ 하니 놓여지는 .. 열기, 자르기, 저장 같은 기능들을 모아두는 것들을 툴바라고들 하지요..
제가 클론해서 수정중인 lxn/walk 에도 기본적으로 제공을 하고 있는 기능입니다만.. walkmgr 구조에 포함시켜 보았습니다. 원래 윈도의 툴바는 수직 방향으로도 구성이 가능하고 lxn/walk 에서도 파라메터 상으로는 수직을 지정가능하게 되어 있긴 한데 제대로 동작하진 못하는것 같아서 우선 전통적인 툴바에 대해서만 다뤄 보도록 하겠습니다.
pirogom/walkmgr 에 추가된 코드는 아래 링크를 참고하시구요
walkmgr_example 에 추가된 예제 코드는 아래 링크를 참고하십시요.
간단한 설명을 붙여봅니다.
func TestDefToolBar(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(기본)", 640, 480)
wm.NewToolBar()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}툴바는 기본적으로 윈도 객체에 붙는 놈이라 NewWin 으로 생성한 WalkUI객체로 다루시면 됩니다.
툴바 객체 생성(NewToolBar) -> 툴 추가(AddTool) -> 툴바 생성 종료(ToolBarEnd)
크게 3단계로 보시면 되겠습니다. 이 구조는 walkmgr의 다른 객체들의 사용과 비슷합니다. GroupBox나 Composite 같은 것들도 시작지점에 특정함수를 호출하고 중간에 객체 추가 함수들을 나열한 뒤 End() 메소드로 마무리 하는 것과 비슷한 구조입니다.
툴바 객체를 생성하는 함수는 총 3가지 입니다.
NewToolBar, NewToolBarWithText, NewToolBarWithText2 이름에서 알수 있듯이 이미지만 있거나 타이틀 텍스트가 같이 표시되는 정도의 구분입니다. 나머지는 예제 설명을 하면서 진행 하도록 하겠습니다.
툴을 추가하는 함수는 AddTool로 첫번째 인자는 타이틀 텍스트, 두번째 인자는 아이콘 파일의 경로, 마지막 인자는 해당 툴이 클릭 되었을때 실행될 콜백함수를 지정하시면 됩니다. 콜백 함수의 파라메터는 없습니다.
앞서 보여드린 첫 TestDefToolBar 함수를 실행하면
wm.NewToolBar()이 NewToolBar 함수는 아이콘 이미지만으로 구성된 툴바를 생성하기 때문에 아이콘만 노출됩니다. AddTool 메소드로 생성한 툴의 타이틀 텍스트는 아이콘에 마우스를 올리고 있으면 뜨는 툴팁 텍스트로 표시됩니다.
이런식으로 동작 합니다.
이번에는 NewToolBarWithText 메소드로 생성된 툴바의 예를 보도록 하겠습니다.
func TestTextToolBar(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(기본 텍스트)", 640, 480)
wm.NewToolBarWithText()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}기본적으로 다 같지만 NewToolBar -> NewToolBarWithText 로 툴바의 생성메소드만 변경되었습니다.
첫 예제와 달리 좌측에 아이콘, 우측에 타이틀 텍스트가 표시됩니다.
func TestTextToolBar2(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(하단 텍스트)", 640, 480)
wm.NewToolBarWithText2()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}이번에는 NewToolBarWithText2 메소드로 바꿔서 동작 시켜 봅니다.
텍스트가 우측이 아닌 아이콘의 하단에 표시됩니다. 필요에 따라 원하는 스타일로 호출해서 사용하시면 되겠습니다.
툴바의 경우 한줄에 여러 기능들이 배치되다 보면 그 기능들의 목적에 맞게 구분을 해줘야 하는 경우가 생깁니다. 그런 경우 메뉴에서 AddSeparator라는 메소드를 사용한것 처럼 AddToolSeparator 메소드를 사용하면 구분선을 추가할 수 있습니다.
func TestToolbarWithLine(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(구분선)", 640, 480)
wm.NewToolBar()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("거북이", "icon\\icon1.ico", func() {})
wm.AddTool("두루미", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("삼천갑자", "icon\\icon1.ico", func() {})
wm.AddTool("동방삭", "icon\\icon2.ico", func() {})
wm.AddTool("치치카포", "icon\\icon1.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("사리사리", "icon\\icon2.ico", func() {})
wm.AddTool("센타", "icon\\icon1.ico", func() {})
wm.AddTool("워리워리", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("세브리깡", "icon\\icon1.ico", func() {})
wm.AddTool("무두셀라", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}
func TestToolbarWithLineAndText(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(구분선+텍스트)", 640, 480)
wm.NewToolBarWithText()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("거북이", "icon\\icon1.ico", func() {})
wm.AddTool("두루미", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("삼천갑자", "icon\\icon1.ico", func() {})
wm.AddTool("동방삭", "icon\\icon2.ico", func() {})
wm.AddTool("치치카포", "icon\\icon1.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("사리사리", "icon\\icon2.ico", func() {})
wm.AddTool("센타", "icon\\icon1.ico", func() {})
wm.AddTool("워리워리", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("세브리깡", "icon\\icon1.ico", func() {})
wm.AddTool("무두셀라", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}
func TestToolbarWithLineAndText2(t *testing.T) {
wm := walkmgr.NewWin("툴바 테스트(구분선+텍스트)", 640, 480)
wm.NewToolBarWithText2()
wm.AddTool("김", "icon\\icon1.ico", func() {})
wm.AddTool("수한무", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("거북이", "icon\\icon1.ico", func() {})
wm.AddTool("두루미", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("삼천갑자", "icon\\icon1.ico", func() {})
wm.AddTool("동방삭", "icon\\icon2.ico", func() {})
wm.AddTool("치치카포", "icon\\icon1.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("사리사리", "icon\\icon2.ico", func() {})
wm.AddTool("센타", "icon\\icon1.ico", func() {})
wm.AddTool("워리워리", "icon\\icon2.ico", func() {})
wm.AddToolSeparator()
wm.AddTool("세브리깡", "icon\\icon1.ico", func() {})
wm.AddTool("무두셀라", "icon\\icon2.ico", func() {})
wm.ToolBarEnd()
wm.Start()
}
이런식으로 구분선을 추가하고 싶은 위치에 AddToolSeparator 메소드를 호출해 주시면 툴의 목적대로 분리해서 구성이 가능합니다.
툴바는 기본적으로 윈도 창의 크기가 변경 되더라도 알아서 크기에 맞춰 변화 됩니다. 그런 이유로 NewWin으로 창을 생성할때 지정하는 창의 크기는 툴바가 차지하는 면적은 제외하고서 따지는 크기입니다. 이건 만들어 가면서 익숙해 지시면 될 문제 겠구요 ..
윈도 크기가 변하더라도 크기에 맞춰서 배치가 따라 당기는걸 보실 수 있습니다.
이상입니다.