diff --git "a/README_\352\270\260\353\247\220\352\263\274\354\240\234\353\263\264\352\263\240\354\204\234.md" "b/README_\352\270\260\353\247\220\352\263\274\354\240\234\353\263\264\352\263\240\354\204\234.md" new file mode 100644 index 0000000000000000000000000000000000000000..4194a2f99c644d9474aec884e985854598f8b3da --- /dev/null +++ "b/README_\352\270\260\353\247\220\352\263\274\354\240\234\353\263\264\352\263\240\354\204\234.md" @@ -0,0 +1,219 @@ +# 아이템 선정 동기 및 개선 목표 + +이전에 포렌식을 공부하며 오디오 관련 문제를 해결하기 위해 Audacity를 사용한 적이 있었다. Audacity는 무료 오디오 편집 소프트웨어로, 다양한 오디오 파일을 편집하고 분석하는 데 유용했다. 그러나 사용 당시 프로그램의 글자가 흐리게 보이고, 폰트의 가독성이 떨어진다고 생각했다. 이는 작업의 효율성을 저하시키고, 장시간 사용 시 눈의 피로를 유발할 수 있는 문제로 느껴졌다. + +이번에 오픈소스SW입문의 기말과제 주제로 Audacity 프로그램의 Windows버전의 폰트를 변경해 가독성을 개선하는 보완 과제를 교수님께 추천받았고, 이 기회를 활용해 'Audacity 한글 가독성 개선'이라는 주제로 프로젝트를 진행하게되었다. 프로젝트의 초기 개선 목표는 두 가지로 설정했다. + +첫째로 폰트 개선이다. Audacity를 사용하면서 Audacity Mac버전과 다르게 Windows버전에서는 폰트 가독성이 더 좋지 못하다고 느꼈고, 프로그램에서 사용되는 폰트를 윈도우에서 기본적 사용되고 가독성이 높은 '맑은 고딕'으로 적용하는 것을 목표로 설정했다. +둘째는 해상도 개선이다. Audacity를 사용할 때 글자가 흐리게 보이는 문제가 있었는데, 이는 디스플레이 설정이나 프로그램 자체의 해상도 설정에 기인한 문제일 수 있다. 이를 해결하기 위해 프로그램의 해상도를 조정하여 글자가 보다 선명하게 보이도록 하고, 사용자 경험을 개선하고자 한다. + +두 가지 방법을 통해 Audacity Windows버전의 한글 가독성을 개선시킨다면 작업의 효율성을 높일뿐만 아니라 장시간 작업 시에도 눈의 피로를 줄일 수 있을 것으로 기대된다. + +# 개선 과정 + +### wxWidget + +다양한 플랫폼에서 사용되는 프로그램의 경우, 하나의 코드로 여러 플랫폼에서 작동하는 프로그램을 빌드할 수 있게 해주는 도구가 필요하다고 생각했다. 그래서 해당 라이브러리를 찾기 위해 Audacity의 매뉴얼, 설정 등 다양한 메뉴를 살펴봤다. 그 중, Audacity 정보 페이지를 살펴보니 Audacity의 빌드 정보가 있었다. 해당 페이지를 통해 Audacity는 wxWidgets라는 크로스 플랫폼 GUI 라이브러리를 사용한다는 것을 알게 됐다. + +wxWidgets는 여러 운영체제에서 동일한 소스 코드로 애플리케이션을 빌드할 수 있게 해주는 라이브러리로, Audacity가 다양한 플랫폼에서 작동할 수 있도록 도와준다. wxWidgets를 통해 Audacity를 빌드하므로, wxWidgets의 설정 파일을 수정하면 폰트 변경이 가능할 것이라고 판단했다. 이와 같은 접근을 통해 프로젝트를 진행하여 Audacity의 폰트 및 해상도 문제를 개선하고자 했다. + +{: width="500" height="200"} + +### wxFormBuilder를 통한 구조 파악 + +우선 wxWidgets의 구조를 파악해야겠다고 생각했다. Audacity의 구조를 이해하기 위해 wxWidgets를 기반으로 하는 GUI 디자이너 툴인 wxFormBuilder를 활용했다. wxFormBuilder는 wxWidgets 애플리케이션을 개발하는 데 필요한 GUI 레이아웃을 시각적으로 설계하고, 이를 간단한 코드로 생성하는 데 사용된다. wxFormBuilder의 기능을 활용해 창(wxWindow), 박스 사이저(wxBoxSizer), 메뉴바(wxMenubar), 패널(wxPanel) 등을 직접 생성해보며 wxWidgets를 구성하는 요소들 간의 관계를 파악했다. + +wxFormBuilder를 통해 wxWidgets에서는 최상위 윈도우가 생성되고 그 안에 다양한 요소들이 계층적인 형태로 존재한다는 것을 알 수 있었다. 메뉴바와 상태바는 윈도우에 바로 포함될 수 있지만, 패널과 프레임, 그리고 텍스트와 같은 요소들은 바로 윈도우에 포함될 수 없고 박스 사이저와 같은 레이아웃 매니저를 통해 구성해야 함을 알게 되었다. 또한, wxWidgets에서는 윈도우 내에 다른 윈도우가 포함될 수 있는 계층 구조를 지원하며, 패널 내에도 추가적인 패널이 포함될 수 있다. 각 요소들의 배치와 관계를 시각적으로 설계하는 과정을 통해 wxWidgets의 다양한 구성 방식을 학습했다. +더해서 프로그램에서 자체적으로 지원해주는 example 코드를 활용해서 후술할 wxPython을 통해 구현해보았고 기본적인 레이아웃과 폰트변경을 실험했다. + +{: width="670" height="373"} + +### wxPython과 폰트 변경 테스트 + +Audacity 원본코드에 직접적으로 적용하기 전에 wxPython을 활용하여 간단한 wxWidgets 프로그램을 생성하고 폰트 변경을 실험하는 결정을 내렸다. wxPython은 원래 c++로 작성되는 wxWidgets의 Python용 GUI 라이브러리이다. 이를 통해 폰트 변경이 전체 프로그램에 어떻게 적용되는지를 실험하고자 했다. + +우선, 간단한 창(wxWindow)에 텍스트(wxStaticText)를 추가하고 이 텍스트의 폰트(wxFont)를 변경하는 것으로 시작했다. 이 단순한 예제를 활용해 wxFont와 SetFont()를 통한 폰트 설정이 제대로 동작하는지 확인했다. + +#### 여기 wxWindow안에 wxStaticText있는 레이아웃의 폰트 변경 사진 넣기 + +그 다음으로는 패널(wxPanel)과 그 안에 추가적인 패널이 포함된 복잡한 구조에서도 동일한 폰트 변경이 가능한지, MenuBar의 폰트도 변경이 가능한 지 실험을 진행했다. 이 과정을 통해 폰트 변경 코드를 어느 위치에 넣어야 전체 프로그램에 일괄적으로 적용되는지를 확인하고자 했다. + +#### wxPanel 안의 wxPanel 안의 Button 구조의 폰트변경 사진 넣기 + +하지만 MenuBar의 경우에는 폰트를 바꿀 수 있는 방법이 확인되지 않았다. wxMenuBar는 wxWindow에 붙어 상단의 메뉴바를 표시해주는데, wxMenuBar의 함수에는 폰트를 설정할 수 있는 SetFont가 없었고 상위의 wxWindow의 폰트를 변경해도 MenuBar의 폰트가 변경되지는 않았다. wxMenuBar 하위의 wxMenu는 내부에 wxMenuItem을 통한 항목추가로 SetFont가 가능하다는 것을 확인했다. + +#### MenuBar안에 Menu와 MenuItem들어있는 구조의 폰트 변경 사진 넣기 이 때 MenuBar는 변경되지 못함을 파악해야함 + + +결론적으로 여러 구조에서 폰트 변경을 시도한 결과, 폰트 설정 코드를 상위 구조에 위치시키면 하위 구조들도 해당 폰트로 변경된다는 사실을 알 수 있었다. 즉, 프로그램 전체의 폰트를 수정하기 위해서는 가장 최상위 구조인 최상위 윈도우에 폰트 설정 코드를 넣어야 한다는 것을 파악했다. 또한 메뉴바의 폰트의 경우에는 폰트 설정을 추가해도 변경되지 않는다는 것을 파악했다. + +##### 최종적으로 사용한 코드 +``` mport wx +import wx.xrc +import gettext +_ = gettext.gettext + + +class MyFrame1 ( wx.Frame ): + + def __init__( self, parent ): + wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = wx.EmptyString, pos = wx.DefaultPosition, size = wx.Size( 641,415 ), style = wx.DEFAULT_FRAME_STYLE|wx.TAB_TRAVERSAL ) + new_font = wx.Font(14, wx.DEFAULT, wx.ITALIC, wx.BOLD) + self.SetFont(new_font) + + self.SetSizeHints( wx.DefaultSize, wx.DefaultSize ) + + bSizer1 = wx.BoxSizer( wx.VERTICAL ) + + self.m_panel1 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) + bSizer2 = wx.BoxSizer( wx.VERTICAL ) + + + self.m_panel2 = wx.Panel( self.m_panel1, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) + bSizer3 = wx.BoxSizer( wx.VERTICAL ) + + self.m_panel3 = wx.Panel( self.m_panel2, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) + bSizer3.Add( self.m_panel3, 1, wx.EXPAND |wx.ALL, 5 ) + + self.m_button3 = wx.Button( self.m_panel2, wx.ID_ANY, _(u"MyButton2"), wx.DefaultPosition, wx.DefaultSize, 0 ) + bSizer3.Add( self.m_button3, 0, wx.ALL, 5 ) + + + self.m_panel2.SetSizer( bSizer3 ) + self.m_panel2.Layout() + bSizer3.Fit( self.m_panel2 ) + bSizer2.Add( self.m_panel2, 1, wx.EXPAND |wx.ALL, 5 ) + + self.m_button2 = wx.Button( self.m_panel1, wx.ID_ANY, _(u"MyButton1"), wx.DefaultPosition, wx.DefaultSize, 0 ) + bSizer2.Add( self.m_button2, 0, wx.ALL, 5 ) + + + self.m_panel1.SetSizer( bSizer2 ) + self.m_panel1.Layout() + bSizer2.Fit( self.m_panel1 ) + bSizer1.Add( self.m_panel1, 1, wx.EXPAND |wx.ALL, 5 ) + + self.m_button1 = wx.Button( self, wx.ID_ANY, _(u"MyButton"), wx.DefaultPosition, wx.DefaultSize, 0 ) + bSizer1.Add( self.m_button1, 0, wx.ALL, 5 ) + + + self.SetSizer( bSizer1 ) + self.Layout() + self.m_statusBar1 = self.CreateStatusBar( 1, wx.STB_SIZEGRIP, wx.ID_ANY ) + self.m_toolBar1 = self.CreateToolBar( wx.TB_HORIZONTAL, wx.ID_ANY ) + self.m_toolBar1.Realize() + + + self.Centre( wx.BOTH ) + + def __del__( self ): + pass + + +if __name__ == '__main__': + app = wx.App(False) + frame = MyFrame1(None) + frame.Show() # Show the frame + app.MainLoop() +``` + + + +### Audacity 구조 파악 + +#### Audacity의 계층구조? 사진 넣기 + +이후 Audacity 공식 문서와 디버깅을 통해서 Audacity의 초기화 부분을 분석했고 기본적인 구조를 파악할 수 있었다. 간단히 설명하면, 최상위 윈도우 아래에 메뉴바와 상태바, 일종의 레이아웃인 wxBoxSizer 등이 있고, wxBoxSizer 안에 트랙과 툴바가 있는 형태였다. + +### Audacity 적용과 문제점 + +앞에서 wxFormBuilder, wxPython, 코드 디버깅을 활용하여 학습한 결과를 바탕으로 Audacity에서도 최상위 윈도우에 폰트변경 코드를 추가하여 프로그램 전체의 폰트를 변경하고자 했다. 하지만 초기화 코드에서 가장 먼저 생성되는 최상위 윈도우에서 폰트를 변경해도 프로그램 전체의 폰트가 바뀌지는 않았다. 예상대로라면 메뉴바를 제외한 트랙, 툴바 등 나머지 모두가 바뀌어야했지만 최상위 윈도우에 바로 붙어있는 상태바만이 변경되었다. 클릭과 이벤트 발생으로 추가되는 패널이나 환경설정 같은 새로운 창(wxDialog)를 띄워줄 때는 최상위윈도우만 변경하면 되는 것이 아니고 새롭게 추가(선언)될 때 해당 요소에서 폰트를 변경해야 했었는데 그것이 원인 중 하나로 파악되었다. +또 다른 방법으로 wxWidgets에서 전역으로 폰트를 변경할 수 있는 함수나 설정이 지원되는가 찾아봤지만 wxWidgets 문서나 포럼 어디에도 관련 정보가 없었고 각각 요소마다 폰트를 변경해줘야했다. + +대안으로 최상위 윈도우를 가져올 때마다 하위 윈도우들을 반복문을 통해 방문하여 폰트를 변경해주는 방법을 사용했다. 이 방법으로 바뀌지 않는 트랙, 패널, 툴바의 폰트 변경 방법은 후술한다. + + +# 과제 진행 중 발생한 추가적인 문제점으로 인한 개선목표 변경 +앞서 설명한 프로그램 분석 후 문제점을 파악할 때 처음에는 실제로 폰트를 변경했지만 변화가 보이지 않았는데, 사실 프로그램에서 추가적으로 설정하지 않았을 때는 윈도우에 기본적으로 설정된 폰트(맑은 고딕)를 가져와 사용하기 때문에 변화가 없었던 것이다. 결론적으로 Audacity Windows 버전의 폰트는 이미 '맑은 고딕'이었고 폰트 가독성이 좋지 못하다고 느낀 주요한 이유는 글자들이 배율을 높여 확대되었고 흐리게 표시되어서였다. + +Audacity의 글자가 흐리게 표시되는 이유는 High-DPI와 관련이 있다. +윈도우는 프로그램이 DPI인식을 하지 못하는 상태(DPI Unaware)라면 고정 DPI값인 96으로 렌더링하고, 만약 96DPI(100%배율)보다 큰 배율의 화면에서 프로그램이 실행된다면 프로그램 비트맵을 실제 크기로 늘려준다. 단순히 크기를 늘리는 경우기 때문에 글자가 흐릿하게 보인다. +반면 프로그램이 최신 DPI인식 모드를 사용한다면 같은 상황에서 프로그램의 비트맵 크기를 조정하지 않고 프로그램에 WM_DPUCHANGED라는 신호를 보내준다. 이 경우 DPI에 맞는 각 요소의 크기 조정은 프로그램의 몫이 된다. 더 자세한 정보는 아래 마이크로소프트의 공식 링크를 참고하면 된다. +https://learn.microsoft.com/en-us/windows/win32/hidpi/high-dpi-desktop-application-development-on-windows + +Audacity는 wxWidgets을 사용하고 있고, wxWidgets은 3.1.3버전 전까지는 HiDPI를 지원할 수 없는 상태였다. 현재 Audacity에서 사용되는 wxWidgets버전은 HiDPI를 지원할 수는 있지만, 현재 Audacity 프로그램은 DPI인식까지는 가능해도 내부적으로 DPI에 맞게 프레임의 크기를 조절하는 코드는 구현되어 있지 않은 상태였다. 따라서 고해상도 환경에서 Audacity를 사용할 경우 DPI인식이 되어 프로그램 내의 UI가 굉장히 작게 표현되거나 DPI인식이 되지 않아 UI들이 확대되고 흐릿하게 보이는 현상이 나타난다. 실제로 15.6인치에 2880x1800 해상도인 현재의 노트북에서는 배율이 200%로 사용되고 Audacity도 흐릿하게 나타났지만, 30인치에 2560x1080인 와이드모니터에서는 배율이 100%로 사용되어 흐릿함없이 표현되는 모습을 확인할 수 있었다. + +#### 보조모니터와 노트북에서의 환경차이 사진첨부 + + +결국 폰트 변경은 이미 가독성이 높은 폰트인 맑은 고딕에 Bold옵션을 더해서 부족한 부분에만 변경코드를 추가하고, 글자 흐림 문제를 중점적으로 해결하는 것으로 목표를 조금 수정했다. + +# 폰트 수정 + +각 윈도우들의 폰트를 변경하기 위해 ProjectWindows의 GetProjectFrame 함수에 wxWindow와 font를 받아 윈도우의 자식까지 폰트를 변경해주는 SetFontRecursive 함수를 만들어 적용해주었다. GetProjectFrame은 레이아웃이 생성되고 각 요소들이 배치될 때 최상위 윈도우를 가져와준다. 이 함수에 폰트 설정을 넣어서 반환해주면 wxWindow 형태의 요소들의 폰트를 바꿔줄 수 있다. +```cpp +//추가된코드 +void SetFontRecursive(wxWindow* window, const wxFont& font) +{ + if (!window) + return; + + window->SetFont(font); // 폰트설정 + + wxWindowList children = window->GetChildren(); //각 윈도우의 자식들을 받아 아래 반복문으로 돌며 폰트적용 + for (wxWindowList::iterator it = children.begin(); it != children.end(); ++it) + { + SetFontRecursive(*it, font); + } +} + +//추가된 코드, 맑은고딕(굵게) 설정 +wxFont fontB(wxFontInfo(10).FaceName("Malgun Gothic").Bold()); + +AUDACITY_DLL_API wxFrame &GetProjectFrame( AudacityProject &project ) +{ + auto ptr = ProjectWindows::Get(project).mFrame; + + //추가된 코드 + SetFontRecursive(ptr, fontB); + + if ( !ptr ) + THROW_INCONSISTENCY_EXCEPTION; + return *ptr; +} +``` + +앞서 메뉴바(wxMenuBar)는 상위의 윈도우를 바꾸더라도 폰트가 변경되지 않았고, 하위의 wxMenu에는 폰트를 설정해주는 SetFont()가 없는 것이 확인되었다. Audacity의 코드를 살펴보니 메뉴바를 초기화하는 형태가 wxMenu에 wxMenuItem을 넣 + + +# 결론(개선 결과?) + + +### 여기도 관우 너가 작성하는게 편할 듯 -> 그냥 간단하게 사진 넣고,사실 원래가 맑은 고딕이었다 이런 내용? + + +# 느낀점 +맨 처음 프로젝트를 시작할 때, 저는 C++를 사용해보지 않은 상태였다. 이전에는 Python이나 C와 같은 다른 프로그래밍 언어를 배웠지만, C++은 처음 접해보았다. 이로 인해 프로젝트 초반에는 Audacity의 코드를 이해하는 데 어려움을 겪었다. C++의 문법과 특성을 익히지 않은 상태에서는 코드를 해독하고 프로그램의 동작 원리를 이해하는 것이 쉽지 않았다. 그러나 프로젝트를 진행하며 저는 C++의 기본적인 문법을 학습하고 Audacity의 코드를 이해하려 노력했다. Audacity의 구조와 클래스들 간의 상호작용을 파악하면서 점점 코드를 읽고 이해하는 데에 자신감을 쌓을 수 있었다. C++의 객체지향 프로그래밍 개념을 활용해 코드를 분석하고 수정하는 과정에서 저의 프로그래밍 능력이 크게 성장했다. + +또한, 웹 페이지를 제작해본 경험은 있었지만, 애플리케이션을 빌드해본 경험은 없었다. 이번 프로젝트를 진행하며, Audacity를 빌드해 폰트 변경을 확인했다. 이 과정에서 빌드를 처음 진행해봐 파일이 꼬이고, 설정이 잘못되는 등의 시행착오가 있었지만, 이를 통해 코드에서 애플리케이션으로의 빌드 과정을 이해할 수 있었다. + +마지막으로, wxWidgets라는 크로스 플랫폼 GUI 라이브러리에 대해 학습하면서 GUI 애플리케이션의 개발 방법과 구조를 이해하는 데 많은 도움이 되었다. wxWidgets를 통해 다양한 운영 체제에서 일관된 사용자 경험을 제공하는 방법과, 각 요소들 간의 관계를 시각적으로 디자인하고 코드로 변환하는 기술을 습득하게 되었다. + +아직까지 모르는 내용도 많고, 처음 시도해보는 것도 많다는 것을 깨달았던 프로젝트였던거 같다. 이번 프로젝트를 통해 부족함을 인지했고, 더 노력해야겠다. + +# 출처 +- wxWidgets 문서 : https://docs.wxwidgets.org/3.0/ +- wxWidgets wxWindow : +- wxWidgets wxFont : +- wxWingets wxMenuBar : +- wxFromBuilder : https://github.com/wxFormBuilder/wxFormBuilder +- wxFormBuilder 사용법 : https://blog.naver.com/dotoricoding/221112038209 +- wxPython : https://wxpython.org/index.html +- wxWidgets 폰트 설정 방법 : https://forums.wxwidgets.org/viewtopic.php?p=214285 + + +- Windows에서 High DPI 데스크톱 애플리케이션 개발 : https://learn.microsoft.com/en-us/windows/win32/hidpi/high-dpi-desktop-application-development-on-windows?source=recommendations +- 프로세스에 대한 기본 DPI 인식 설정 : https://learn.microsoft.com/en-us/windows/win32/hidpi/setting-the-default-dpi-awareness-for-a-process?source=recommendations +- wxWidgets의 High DPI 지원 : https://docs.wxwidgets.org/stable/overview_high_dpi.html#high_dpi_existing_code +- wxWidgets에서의 HiDPI 문제에 대한 답변 : https://github.com/audacity/audacity/issues/503 +- HiDPI로 인한 문제 설명 : https://blogs.windows.com/windowsdeveloper/2017/05/19/improving-high-dpi-experience-gdi-based-desktop-apps/ \ No newline at end of file diff --git "a/Readme_\353\263\264\352\263\240\354\204\234.md" "b/Readme_\353\263\264\352\263\240\354\204\234.md" deleted file mode 100644 index 1146bcf13fc98993d5edf3647f17af07cded1bd3..0000000000000000000000000000000000000000 --- "a/Readme_\353\263\264\352\263\240\354\204\234.md" +++ /dev/null @@ -1,136 +0,0 @@ -# 아이템 선정 동기 및 개선 목표 - -이전에 포렌식을 공부하며 오디오 관련 문제를 해결하기 위해 Audacity를 사용한 적이 있었다. Audacity는 무료 오디오 편집 소프트웨어로, 다양한 오디오 파일을 편집하고 분석하는 데 유용했다. 그러나 사용 당시 프로그램의 글자가 뭔가 흐리게 보이고, 폰트의 가독성이 떨어진다고 생각했다. 이는 작업의 효율성을 저하시키고, 장시간 사용 시 눈의 피로를 유발할 수 있는 문제로 느껴졌다. - -이번에 오픈소스SW 입문의 교수추천 과제로 해당 문제점에 대한 보완 과제가 주어졌고, 이 기회를 활용해 'Audacity 한글 개선'이라는 주제로 프로젝트를 진행했다. 프로젝트의 개선 목표는 두 가지로 설정했다. - -첫째, 폰트 개선이다. Audacity를 사용하면서 해당 프로그램의 폰트가 다른 프로그램들과 다르다는 것을 느꼈고, 이로 인해 가독성이 떨어지는 문제가 있다고 생각했다. 따라서 프로그램의 기본 폰트를 사용자들이 더 익숙하고 가독성이 높은 '맑은 고딕'으로 변경하는 것을 목표로 설정했다. '맑은 고딕'은 현대적인 디자인과 높은 가독성으로 인해 많은 사용자에게 선호되는 폰트이다. 둘째, 해상도 개선이다. Audacity를 사용할 때 글자가 흐리게 보이는 문제가 있었는데, 이는 디스플레이 설정이나 프로그램 자체의 해상도 설정에 기인한 문제일 수 있다. 이를 해결하기 위해 프로그램의 해상도를 조정하여 글자가 보다 선명하게 보이도록 하고, 사용자 경험을 개선하고자 한다. 이를 통해 장시간 작업 시에도 눈의 피로를 줄일 수 있을 것으로 기대된다. - -이 두 가지 개선 목표를 통해 Audacity의 사용자 경험을 향상시키고, 프로그램을 보다 효율적으로 사용할 수 있도록 하는 것이 이번 프로젝트의 주된 목적이다. - -# 개선 과정 - -### wxWidget - -다양한 플랫폼에서 사용되는 프로그램의 경우, 하나의 코드로 여러 플랫폼에서 작동하는 프로그램을 빌드할 수 있게 해주는 도구가 필요하다고 생각했다. 그래서 해당 프로그램을 찾기 위해 Audacity의 매뉴얼, 설정 등 다양한 메뉴를 살펴봤다. 그 중, Audacity 정보 페이지를 살펴보니 Audacity의 빌드 정보가 있었다. 해당 페이지를 통해 Audacity는 wxWidgets라는 크로스 플랫폼 GUI 라이브러리를 사용한다는 것을 알게 됐다. - -wxWidgets는 여러 운영체제에서 동일한 소스 코드로 애플리케이션을 빌드할 수 있게 해주는 라이브러리로, Audacity가 다양한 플랫폼에서 작동할 수 있도록 도와준다. wxWidgets를 통해 Audacity를 빌드하므로, wxWidgets의 설정 파일을 수정하면 폰트 변경이 가능할 것이라고 판단했다. 이와 같은 접근을 통해 프로젝트를 진행하여 Audacity의 폰트 및 해상도 문제를 개선하고자 한다. - -{: width="500" height="200"} - - -### wxFormBuilder - -이를 위해 wxWidgets의 구조를 파악해야겠다고 생각했다. Audacity의 구조를 이해하기 위해 wxWidgets를 기반으로 하는 GUI 디자이너 툴인 wxFormBuilder를 활용했다. wxFormBuilder는 wxWidgets 애플리케이션을 개발하는 데 필요한 GUI 레이아웃을 시각적으로 설계하고, 이를 코드로 생성하는 데 사용된다. wxFormBuilder의 기능을 활용해 창(window), 박스 사이저(box sizer), 메뉴바(menubar), 패널(panel) 등을 직접 생성해보며 wxWidgets를 구성하는 요소들 간의 관계를 파악했다. - -wxFormBuilder를 통해 최상위 윈도우가 생성되고, 그 안에 다양한 요소들이 존재한다는 것을 알 수 있었다. 메뉴바와 상태바는 윈도우에 바로 포함될 수 있지만, 패널과 프레임, 그리고 텍스트와 같은 요소들은 바로 윈도우에 포함될 수 없고 박스 사이저와 같은 레이아웃 매니저를 통해 구성해야 함을 알게 되었다. 또한, wxWidgets에서는 윈도우 내에 다른 윈도우가 포함될 수 있는 계층 구조를 지원하며, 패널 내에도 추가적인 패널이 포함될 수 있다. 각 요소들의 배치와 관계를 시각적으로 설계하는 과정을 통해 wxWidgets의 다양한 구성 방식을 학습했다. - -{: width="670" height="373"} - -### wxPython - -Audacity 코드에 직접적으로 적용하기 전에 wxPython을 활용하여 간단한 프로그램을 생성하고 폰트 변경을 실험하는 결정을 내렸다. wxPython은 wxWidgets와 유사한 기능을 제공하는 Python용 GUI 라이브러리이다. 이를 통해 폰트 변경이 전체 프로그램에 어떻게 적용되는지를 실험하고자 했다. - -우선, 간단한 창(window)에 텍스트를 추가하고 이 텍스트의 폰트를 변경하는 것으로 시작했다. 이 단순한 예제를 통해 폰트 설정이 제대로 동작하는지 확인했다. 그 다음으로는 패널(panel)과 그 안에 추가적인 패널이 포함된 복잡한 구조에서도 동일한 폰트 변경 실험을 진행했다. 이 과정을 통해 폰트 변경 코드를 어느 위치에 넣어야 전체 프로그램에 일괄적으로 적용되는지를 확인하고자 했다. - -여러 구조에서 폰트 변경을 시도한 결과, 폰트 설정 코드를 상위 구조에 위치시키면 하위 구조들도 해당 폰트로 변경된다는 사실을 알 수 있었다. 즉, 프로그램 전체의 폰트를 수정하기 위해서는 가장 최상위 구조인 최상위 윈도우에 폰트 설정 코드를 넣어야 한다는 것을 파악했다. 또한 메뉴바의 폰트의 경우에는 폰트 설정을 추가해도 변경되지 않는다는 것을 파악했다. - -##### 최종적으로 사용한 코드 -``` mport wx -import wx.xrc -import gettext -_ = gettext.gettext - - -class MyFrame1 ( wx.Frame ): - - def __init__( self, parent ): - wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = wx.EmptyString, pos = wx.DefaultPosition, size = wx.Size( 641,415 ), style = wx.DEFAULT_FRAME_STYLE|wx.TAB_TRAVERSAL ) - new_font = wx.Font(14, wx.DEFAULT, wx.ITALIC, wx.BOLD) - self.SetFont(new_font) - - self.SetSizeHints( wx.DefaultSize, wx.DefaultSize ) - - bSizer1 = wx.BoxSizer( wx.VERTICAL ) - - self.m_panel1 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) - bSizer2 = wx.BoxSizer( wx.VERTICAL ) - - - self.m_panel2 = wx.Panel( self.m_panel1, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) - bSizer3 = wx.BoxSizer( wx.VERTICAL ) - - self.m_panel3 = wx.Panel( self.m_panel2, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL ) - bSizer3.Add( self.m_panel3, 1, wx.EXPAND |wx.ALL, 5 ) - - self.m_button3 = wx.Button( self.m_panel2, wx.ID_ANY, _(u"MyButton2"), wx.DefaultPosition, wx.DefaultSize, 0 ) - bSizer3.Add( self.m_button3, 0, wx.ALL, 5 ) - - - self.m_panel2.SetSizer( bSizer3 ) - self.m_panel2.Layout() - bSizer3.Fit( self.m_panel2 ) - bSizer2.Add( self.m_panel2, 1, wx.EXPAND |wx.ALL, 5 ) - - self.m_button2 = wx.Button( self.m_panel1, wx.ID_ANY, _(u"MyButton1"), wx.DefaultPosition, wx.DefaultSize, 0 ) - bSizer2.Add( self.m_button2, 0, wx.ALL, 5 ) - - - self.m_panel1.SetSizer( bSizer2 ) - self.m_panel1.Layout() - bSizer2.Fit( self.m_panel1 ) - bSizer1.Add( self.m_panel1, 1, wx.EXPAND |wx.ALL, 5 ) - - self.m_button1 = wx.Button( self, wx.ID_ANY, _(u"MyButton"), wx.DefaultPosition, wx.DefaultSize, 0 ) - bSizer1.Add( self.m_button1, 0, wx.ALL, 5 ) - - - self.SetSizer( bSizer1 ) - self.Layout() - self.m_statusBar1 = self.CreateStatusBar( 1, wx.STB_SIZEGRIP, wx.ID_ANY ) - self.m_toolBar1 = self.CreateToolBar( wx.TB_HORIZONTAL, wx.ID_ANY ) - self.m_toolBar1.Realize() - - - self.Centre( wx.BOTH ) - - def __del__( self ): - pass - - -if __name__ == '__main__': - app = wx.App(False) - frame = MyFrame1(None) - frame.Show() # Show the frame - app.MainLoop() -``` - - -### Audacity 적용 - -앞에서 wxFormBuilder, wxPython을 활용하여 학습한 결과를 바탕으로 Audacity에서도 최상위 윈도우에 폰트변경 코드를 추가하여 프로그램 전체의 폰트를 변경하고자 했다. 그런데 맨처음 윈도우가 초기화 코드 이후에 폰트변경 코드를 추가한 후, 빌드를 진행했는데 프로그램 전체에 대한 폰트가 변경되지 않고 일부만 변경되었다. 이에 저희는 이벤트 발생에 의해 처리되는 요소들의 경우에는 일괄적인 변경이 불가능한 것으로 파악하여, toolbar, popupmenu 등에 대한 폰트 변경을 하위 요소에서 for문을 통해 반복적으로 수행했다. - -### 관우 여기에 내용 추가해줘 정확한 내용은 너가 아는 듯 - -### 코드와 사진첨부할 것. 발생했던 문제점을 하나하나 개선하는 느낌으로 - - -# 결론(개선 결과?) - - -### 여기도 관우 너가 작성하는게 편할 듯 -> 그냥 간단하게 사진 넣고,사실 원래가 맑은 고딕이었다 이런 내용? - - -# 느낀점 -맨 처음 프로젝트를 시작할 때, 저는 C++를 사용해보지 않은 상태였다. 이전에는 Python이나 C와 같은 다른 프로그래밍 언어를 배웠지만, C++은 처음 접해보았다. 이로 인해 프로젝트 초반에는 Audacity의 코드를 이해하는 데 어려움을 겪었다. C++의 문법과 특성을 익히지 않은 상태에서는 코드를 해독하고 프로그램의 동작 원리를 이해하는 것이 쉽지 않았다. 그러나 프로젝트를 진행하며 저는 C++의 기본적인 문법을 학습하고 Audacity의 코드를 이해하려 노력했다. Audacity의 구조와 클래스들 간의 상호작용을 파악하면서 점점 코드를 읽고 이해하는 데에 자신감을 쌓을 수 있었다. C++의 객체지향 프로그래밍 개념을 활용해 코드를 분석하고 수정하는 과정에서 저의 프로그래밍 능력이 크게 성장했다. - -또한, 웹 페이지를 제작해본 경험은 있었지만, 애플리케이션을 빌드해본 경험은 없었다. 이번 프로젝트를 진행하며, Audacity를 빌드해 폰트 변경을 확인했다. 이 과정에서 빌드를 처음 진행해봐 파일이 꼬이고, 설정이 잘못되는 등의 시행착오가 있었지만, 이를 통해 코드에서 애플리케이션으로의 빌드 과정을 이해할 수 있었다. - -마지막으로, wxWidgets라는 크로스 플랫폼 GUI 라이브러리에 대해 학습하면서 GUI 애플리케이션의 개발 방법과 구조를 이해하는 데 많은 도움이 되었다. wxWidgets를 통해 다양한 운영 체제에서 일관된 사용자 경험을 제공하는 방법과, 각 요소들 간의 관계를 시각적으로 디자인하고 코드로 변환하는 기술을 습득하게 되었다. - -아직까지 모르는 내용도 많고, 처음 시도해보는 것도 많다는 것을 깨달았던 프로젝트였던거 같다. 이번 프로젝트를 통해 부족함을 인지했고, 더 노력해야겠다. - -# 출처 -- wxWidgets 문서 : https://docs.wxwidgets.org/3.0/ -- wxFormBuilder 사용법 : https://blog.naver.com/dotoricoding/221112038209 -- wxWidgets 폰트 설정 방법 : https://forums.wxwidgets.org/viewtopic.php?p=214285 \ No newline at end of file