728x90
300x250
[PC활용] GTK+ Project 그리고 Glade, Anjuta, libtools 사용하기 - 루분투 18.04

 

글 제목이 다소 길게만 느껴진다.

실제로는 더 많은 라이브러리를 가지고 있다고 본다.

 

이번에 소개할 것은 GTK+ Project에 대한 소개 및 Gnome 프로젝트에서의 GTK+, Anjuta, Glade, libtools에 대해서 루분투 18.04에서 사용하는 방법을 소개하려고 한다.

 

사용 프로그램: Microsoft Windows 10, Oracle VirtualBox GNU/GPL v2, Lubuntu 18.04, GTK+(GNU/LGPLv2.1) 등.

 

번호

언어(Language)

단어(Words)

뜻(Mean)

한글 읽기(Korean)

1

영어(English)->

한글(Korean)

GTK+

지티케이플러스

(프로젝트 명칭)

지티케이 플러스

2

영어(English)->

한글(Korean) 

Anjuta

안주타

(프로젝트 명칭)

안주타

3

영어(English)->

한글(Korean)

Glade

글레이드

(프로젝트 명칭)

글레이드

4

영어(English)->

한글(Korean)

libtools

라이브툴스

(프로젝트 명칭)

라이브툴스

5

영어(English)->

한글(Korean)

Project

프로젝트

프로젝트

         

 

비주얼 스튜디오나 이클립스에 익숙한 경우에는 조금 차이점이 있을 것으로 보인다.

 


1. GTK+ 프로젝트 소개

 

아래의 링크를 클릭하면, GTK+ 프로젝트 사이트에 접속할 수 있다.

http://www.gtk.org

 

 

그림 1-1. GTK.org - 도도(Dodo)

 

프로젝트를 자세히 읽어보면 라이센스에 관한 내용도 기술되어있다.

 

Are there any licensing restrictions?

 

표 1. 영어 한글로 읽어보기

 

번호

언어(Language)

문장(Word)

 뜻(Mean)

한글(Korean)

1

영어(English)->

한글(Korean)

 Are there any licensing restrictions?

There(거기)

GTK+ Project를 말함.

 

= GTK+ 프로젝트는 제약된
라이센싱이 있나요?

아 데얼 에니 라이센싱 리스트릭션?

2

영어(English)->

한글(Korean) 

GTK+ is free software and part of the GNU Project.

GTK+는 프리소프트웨어이고 그리고 GNU 프로젝트의 부분입니다.

지티케이 플러스 이스 프리 소프트웨어 엔드 팟 옵 더 지엔뉴 프로젝트

3

영어(English)->

한글(Korean)

However, the licensing terms for GTK+, the GNU LGPL allow it to be used by all developers

그러나, 그 라이센스의 약관은 GTK+,

GNU LGPL을 허용하고 모든 개발자에게 사용되어져야 합니다.

하우에버, 더 라이센싱 텀스 포 지티케이플러스, 더 지엔뉴 엘지피엘 얼로우 잇 투비 유즈드 바이 올 디벨로퍼

 

 


2. GTK+ 다운로드 받기 (윈도우)

 

윈도우에서 사용하려면, 비주얼 스튜디오가 설치되어 있어야만 가능하다.

https://www.gtk.org/download

 

 

 

그림 2-1. Download를 클릭한 모습 - 도도(Dodo)

 

그림 2-1은 GTK+의 다운로드 웹 사이트이다.

다양한 운영체제를 지원하고 있다.

 

크로스플랫폼(Cross Platform GUI)라는 주제에 대해서 생각해볼 수가 있다.

 

                                                                    표 2. 영어 한글로 읽어보기

 

번호

언어(Language)

단어(Words)

뜻(Means)

한글 읽기(Korean Language)

1

영어(English)->

한글(Hangul)

Bleeding edge

출혈 가장자리??

블리딩 엣지

2

영어(English)->

한글(Hangul)

edge

가장자리

엣지

3

영어(English)->

한글(Hangul)

Alternatively

대체적으로

알터네이티블리

4

영어(English)->

한글(Hangul)

You can check out the latest unstable release of GTK+ Using git

너는 할 수 있다 체크아웃 최근에 불안정한 출시의 GTK 사용하여 git

 

너는 GIt을 사용하여 최근 불안정한 출시된 GTK+를 체크아웃 할 수 있다.

 

유 캔 체크 아웃 더 레이티스트
언 스테이블 릴리즈 옵 지티케이 플러스 유징 깃

5

영어(English)->

한글(Hangul)

Stable

안정된

스테이블

6

영어(English)->

한글(Hangul)

Unstable

불안정한

언 스테이블

 

 

 

 

그림 2-2. 다운로드에 관한 글 (윈도우 버전) - 도도(Dodo)

 


3. GTK+ (루분투 18.04에서 사용하기)

 

터미널(Terminal)을 열면 아래의 명령어를 입력하면 된다.

사용된 명령어는 다음과 같이 정리할 수 있다.

 

번호

명령어(Command)

설명(Explain)

비고(Remarks)

1

sudo apt install gtk*

GTK+를 설치하다.

 

2

sudo apt install libgtk*

libgtk를 설치하다.

 

3

 sudo apt install glade

Glade를 설치하다.

 

4

sudo apt install anjuta

anjuta를 설치하다.

 

5

sudo apt install libtool

libtool을 설치하다.

 

 

 

 

그림 3-1. GTK 3.0 설치하기 - 도도(Dodo)

 

아래의 그림들은 sudo apt install gtk*를 설치하는 장면들에 관한 것이다.

 

그림 3-2. 설치 진행 장면 - 도도(Dodo)

 

그림 3-3. 설치 진행 장면 - 도도(Dodo) 

그림 3-4. 설치 진행 장면 - 도도(Dodo)

그림 3-5. 설치 진행 장면 - 도도(Dodo)

그림 3-6. 설치 진행 장면 - 도도(Dodo) 

 

 

그림 3-7. 설치 진행 장면 - 도도(Dodo)

그림 3-8. 설치 진행 장면 - 도도(Dodo)

그림 3-9. 설치 진행 장면 - 도도(Dodo)

그림 3-10. 설치 진행 장면 - 도도(Dodo)

그림 3-11. 설치 진행 장면 - 도도(Dodo)

 

그림 3-12. 설치 진행 과정 - 도도(Dodo)

그림 3-13. 설치 진행 과정 - 도도(Dodo)

그림 3-14. 설치 진행 과정 - 도도(Dodo)

그림 3-15. 설치 진행 과정 - 도도(Dodo)

그림 3-16. 설치 진행 과정 - 도도(Dodo)

 

 

 

그림 3-17. 설치 진행 과정 - 도도(Dodo)

그림 3-18. 설치 진행 과정 - 도도(Dodo) 

그림 3-19. 설치 진행 과정 - 도도(Dodo)

그림 3-20. 설치 진행 과정 - 도도(Dodo)

그림 3-21. 설치 진행 과정 - 도도(Dodo)

 

 

그림 3-22. 설치 진행 과정 - 도도(Dodo)

그림 3-23. 설치 진행 과정 - 도도(Dodo)

그림 3-24. 설치 진행 과정 - 도도(Dodo)

그림 3-25. 설치 진행 과정 - 도도(Dodo)

 


4. LibGTK 설치하기

 

라이브러리 GTK(이하 libgtk, libgtk3.0) 설치에 관한 것이다.

 

sudo apt install libgtk*

 

그림 4-1. libgtk 설치하기 - 도도(Dodo)

그림 4-2. libgtk 설치하기 - 도도(Dodo)

그림 4-3. libgtk 설치하기 - 도도(Dodo)

그림 4-4. libgtk 설치하기 - 도도(Dodo)

그림 4-5. libgtk 설치하기 - 도도(Dodo)

 

 

그림 4-6. libgtk 설치하기 - 도도(Dodo)

그림 4-7. libgtk 설치하기 - 도도(Dodo)

그림 4-8. libgtk 설치하기 - 도도(Dodo)

그림 4-9. libgtk 설치하기 - 도도(Dodo)

그림 4-10. libgtk 설치하기 - 도도(Dodo)

 

 

그림 4-11. libgtk 설치하기 - 도도(Dodo)

그림 4-12. libgtk 설치하기 - 도도(Dodo)

그림 4-13. libgtk 설치하기 - 도도(Dodo)

그림 4-14. libgtk 설치하기 - 도도(Dodo)

 


5. Glade 프로젝트

 

글래이드 프로젝트는 아래의 사이트에서 자세히 확인할 수 있다.

 

Glade에 대해서 간략하게 소개하면, 사용자 인터페이스 디자이너(User Interface Designer)라고 보면 된다.
GTK 프로그램에 사용되는 디자인 도구라고 할 수 있다.

 

https://glade.gnome.org/

 

 

그림 5-1. Glade.gnome.org / 글레이드 홈페이지 - 도도(Dodo) 

 


6. Glade 설치하기

 

glade 설치에 관한 것이다.

 

sudo apt install glade

 

 

 

그림 6-1. Glade 설치하기

 

그림 6-2. Glade 설치하기

그림 6-3. Glade 설치하기

그림 6-4. Glade 설치하기

그림 6-5. Glade 설치하기

 

그림 6-6. Glade 설치하기

그림 6-7. Glade 설치하기

 

그놈 개발센터에 관한 것이다. 궁금하면 아래의 링크를 클릭해서 접속해도 된다.

https://developer.gnome.org/gladeui

 


7. Anjuta 설치하기

 

안주타 설치에 관한 것이다.

 

sudo apt install anjuta

 

 

그림 7-1. Anjuta 설치하기 - 도도(Dodo)

그림 7-2. Anjuta 설치하기 - 도도(Dodo)

그림 7-3. Anjuta 설치하기 - 도도(Dodo)

그림 7-4. Anjuta 설치하기 - 도도(Dodo)

그림 7-5. Anjuta 설치하기 - 도도(Dodo)

 

 

그림 7-6. Anjuta 설치하기 - 도도(Dodo)

그림 7-7. Anjuta 설치하기 - 도도(Dodo)

그림 7-8. Anjuta 설치하기 - 도도(Dodo)

그림 7-9. Anjuta 설치하기 - 도도(Dodo)

그림 7-10. Anjuta 설치하기 - 도도(Dodo)

 

그림 7-11. Anjuta 설치하기 - 도도(Dodo)

그림 7-12. Anjuta 설치하기 - 도도(Dodo)

그림 7-13. Anjuta 설치하기 - 도도(Dodo)

그림 7-14. Anjuta 설치하기 - 도도(Dodo)

그림 7-15. Anjuta 설치하기 - 도도(Dodo)

 

 

그림 7-16. Anjuta 설치하기 - 도도(Dodo)

그림 7-17. Anjuta 설치하기 - 도도(Dodo)

 

그림 7-17은 빌드를 시도했는데 libtool이 설치되지 않았다고 메시지가 나온 것이다.

ftp://ftp.gnu.org/pub/gnu에 들어가서 수동으로 설치하는 방법도 존재한다.

 


8. libtool 설치하기

 

libtool 설치 방법이다.

 

sudo apt install libtool*

 

 

그림 8-1. libtool 설치하기 - 도도(Dodo)

그림 8-2. libtool 설치하기 - 도도(Dodo)

그림 8-3. libtool 설치하기 - 도도(Dodo)

그림 8-4. libtool 설치하기 - 도도(Dodo)

그림 8-5. libtool 설치하기 - 도도(Dodo)

 

 


8-1. Anjuta에서 GTK+ 빌드하기

 

UI 작업 및 코드 작업 등을 완료하였다면, 빌드를 다음과 같이 할 수 있다.

 

                                                                           표 3. 빌드에 관한 기능별 동작 정리

 

번호

 기능명

 설명(Description)

비고(Remarks) 

1

 빌드(B)-> Compile (main.c)  F9

 "Compile (main.c)"을 누르면 main.c 파일에 대해서 컴파일이 이뤄진다.

 

2

 빌드(B)-> Build (src)           F7

 "Build (src)"를 누르면 "src 폴더" 내에 있는 파일들을 빌드할 수 있다.

 

3

 빌드(B)-> 프로젝트 빌드(B) Shift + F7

 "프로젝트 빌드(B)"를 누르면 프로젝트 전체에 대해서 빌드를 수행할 수 있다.

 

 

 

 

 

그림 8-6. Anjuta 빌드하기 - 도도(Dodo)

그림 8-7. Anjuta 빌드하기 - 도도(Dodo)

컴파일이 성공적으로 수행되었음을 알 수 있다.

그림 8-8. Anjuta 빌드하기 - 도도(Dodo)

그림 8-9. Anjuta 빌드하기 - 도도(Dodo)

그림 8-10. Anjuta 빌드하기 - 도도(Dodo)

 

그림 8-11. ls 명령어 등으로 빌드한 내용 찾아보기 - 도도(Dodo)

그림 8-12. 디버깅 기능으로 프로그램 실행하기 - 도도(Dodo)

그림 8-13. 디버깅 기능으로 프로그램 실행하기 - 도도(Dodo)

 

 


9. GTK Git 프로젝트 소개

 

GTK Git 프로젝트에 관한 것이다.

아래의 사이트에 접속하면 GTK 프로젝트를 살펴볼 수가 있다.

 

https://gitlab.gnome.org/GNOME/gtk

 

그림 9-1. GNOME - GTK+ git 사이트

 


10. 시연(Practice)

 

안주타(Anjuta)에서 GTK+ 시연이다.

 

 

영상 10-1. GTK 시연하기 - 도도(Dodo)

 


11. 맺음글(Conclusion)

 

GTK+ 프로젝트에 대해서 자세히 소개하였다.

 


12. 참고자료(Reference)

 

1. Glade -A User Interface Designer, Last Modified, Accessed by 2018-08-19, https://glade.gnome.org

2. The GTK Project, Last Modified, Accessed by 2018-08-19, https://www.gtk.org/

3. Download GTK, Last Modified, Accessed by 2018-08-19, https://www.gtk.org/download/index.php

4. GNOME / gtk · GitLab, Last Modfied, Accessed by 2018-08-19, https://gitlab.gnome.org/GNOME/gtk

5. Glade User Interface Designer Reference Manual - 그놈 개발 센터, Last Modified, Accessed by 2018-08-19, https://developer.gnome.org/gladeui

반응형
728x90
300x250

[User Interface(사용자 인터페이스)] UI 설계 디자인 - 콤보박스

 

User Interface(사용자 인터페이스) 디자인에서 사용될 수 있는 콤보박스를 소개하려고 한다.

 

IDE 통합개발환경에서 제공하는 경우도 있으니 참고할 것.
Text 기반으로 작성해야 하는 경우도 있으니 아래의 자료를 참고하면 많은 도움이 될 것으로 보인다.

 


1. 콤보박스(Combobox)

 

콤보박스(Combobox)는 아래처럼 그림을 그릴 수 있다.

크게 어렵지 않다.

 

그림 1-1. Ui-Design - 도도(Dodo)

 

 

그림 1-2. Ui-Design - 도도(Dodo)

 

 

그림 1-3. Ui-Design - 도도(Dodo)

 

그림 1-4. Ui-Design - 도도(Dodo)

 

 

그림 1-5. Ui-Design - 도도(Dodo)

 

* 첨부(Attachment)

ui-combobox.7z

 


2. IDE에서 UI-Design

 

Visual Basic, Visual Studio, Eclipse 등에는 UI-Designer가 존재한다.

Eclipse에서 UI-Desiger가 작동하지 않을 경우에는 Sun Microsystems에서 배포하는 자바 개발 도구를 사용하는 것도 방법이 될 수 있다.

안드로이드스튜디오에도 디자이너를 위해서 디자인 환경을 제공하고 있다.

 


2-1. 자바 Swing에서의 WindowDesigner

 

자바 스윙에서의 윈도우 디자이너에 대해서 소개하려고 한다.

아래의 그림들은 시연에 관한 것이다.

 

 

그림 2-1-1. Eclipse - Java Swing Designer - 도도(Dodo)


 

 

그림 2-1-2. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-3. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-4. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-5. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-6. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-7. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-8. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-9. Eclipse - Java Swing Designer - 도도(Dodo)

 

 

그림 2-1-10. Eclipse - Java Swing Designer - 도도(Dodo)

 

참고 해야 할 점

동작에 있어서 하위 버전(JDK 10 이하)을 사용해도 되지만, JDK 10의 정책이 어떻게 돌아가는지 등도 충분히 생각해봐야 한다.

오라클의 동향 등도 모니터링을 해야 한다.

 


2-2. Ubuntu 18.04(루분투 18.04)에서 Anjuta Studio (With Glade, GTK+, GTK3)

 

이번에 시연할 것은 UI 설계를 개발도구에서도 가능한지에 관한 것이다.

가능하다.

 

 

영상 2-2. UI(사용자 인터페이스) 시연 - 도도(Dodo)

 

이클립스도 거의 비슷비슷할 것으로 보인다.

GTK+ (GTK 3.0)의 경우에는 GNU/LGPLv2.1을 적용받는다.

 


3. 결론(Conclusion)

 

이 밖에도 사용자 인터페이스에 대한 설계는 무척 중요하다고 할 수 있다.

복잡하고 어려운 기기도 예를 들면, 기계 장치도 훨씬 쉽고 이쁘게 심미적으로 단순하게 바꿀 수가 있다.

 

컴퓨터에만 적용되는 것은 아니다.

반응형

+ Recent posts