imgui

[imgui] ImGui 튜토리얼과 프로젝트 구성

2023년 7월 17일
imgui

이전 튜토리얼에서 사용했던 CMakeLists를 사용하지 않고 프로젝트를 구성하는 방법을 작성할것이다. 백엔드는 동일하게 OpenGL과 GLFW이다. 참고링크 # imgui 깃헙 ImGui 프로젝트에 추가 : https://youtu.be/VRwhNKoxUtk GLFW 프로젝트에 추가하기 : https://inyongs.tistory.com/117 튜토리얼 공부 링크 # 0. 소개 및 튜토리얼 세팅 1. FileExplorer 구현 2. Plotter 구현 3. TextEditor 구현 4. DiffViewer 구현 5. Paint 구현 6. Calendar 7. CSVEditor 8. WallClock 구현 9. Desktop 구현 10. 통합 Desktop 구현 GLFW 설정 # 1️⃣ GLFW 파일 다운로드 및 프로젝트 폴더에 옮기기 # https://www. ...

[imgui] 10. 통합 Desktop 구현

2023년 7월 11일
imgui

목표 # Desktop에 지금까지 구현했던 프로그램들을 전부 로드 사실 추가로 구현한거 없이 그냥 연결만 했다. 파일트리 # 지금까지 작업했던 파일들을 복사해서 옮겼다. Own이 붙은것만 직접 작업한 파일이다. 1output 2│ Calendar_Own.cpp 3│ Calendar_Own.hpp 4│ CsvTool_Own.cpp 5│ CsvTool_Own.hpp 6│ Desktop_Own.cpp 7│ Desktop_Own.hpp 8│ DiffViewer_Own.cpp 9│ DiffViewer_Own.hpp 10│ FileExplorer_Own.cpp 11│ FileExplorer_Own.hpp 12│ main.cpp 13│ OtherTopics.cpp 14│ OtherTopics.hpp 15│ Paint_Own.cpp 16│ Paint_Own.hpp 17│ Plotter_Own.cpp 18│ Plotter_Own.hpp 19│ TextEditor_Own.cpp 20│ TextEditor_Own.hpp 21│ UiHelpers.cpp 22│ UiHelpers. ...

[imgui] 9. Desktop 구현

2023년 7월 11일
imgui

목표 # Windows 처럼 여러 창을 띄워둘 수 있는 Desktop 구현 윈도우 버튼에서 모든 애플리케이션을 실행할 수 있다. 시계 기능 구현코드 # github 링크 메인함수 # Desktop.hpp 1class Desktop 2{ 3public: 4 // 아이콘 숫자 기본값 10개 5 constexpr static auto numIcons = std::uint32_t{10}; 6 7 // 아이콘 구조체. Draw메서드로 아이콘윈도우를 그린다. 8 struct Icon 9 { 10 Icon(std::string_view label_) 11 : label(label_), position(ImVec2{}), popupOpen(false), 12 clickCount(0){}; 13 14 void Draw(); 15 16 std::string label; 17 ImVec2 position; 18 bool popupOpen; 19 std::uint32_t clickCount; 20 }; 21 22public: 23 // 10개의 아이콘을 초기화. ...

[imgui] 8. WallClock 구현

2023년 7월 11일
imgui

목표 # 아날로그 시계 구현코드 # github 링크 메인함수 # render.hpp 1class WindowClass 2{ 3private: 4 static constexpr auto PI = std::numbers::pi_v<float>; 5 static constexpr auto circleRadius = 250.0f; 6 static constexpr auto offset = PI / 2.0f; 7 static constexpr auto innerRadius = 5.0f; 8 9 // 시계의 시,분,초침 길이 10 static constexpr auto hrsClockHandLength = 0.75F; 11 static constexpr auto minsClockHandLength = 0.85F; 12 static constexpr auto secsClockHandLength = 0. ...

[imgui] 7. CSVEditor

2023년 7월 10일
imgui

목표 # float 데이터를 저장하는 테이블 구현 csv 형태로 저장, 로드 슬라이더로 행, 열 크기 조절가능 구현코드 # github 링크 메인함수 # render.hpp 1class WindowClass 2{ 3public: 4 static constexpr auto popUpFlags = 5 ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoMove | 6 ImGuiWindowFlags_NoCollapse | ImGuiWindowFlags_NoScrollbar; 7 static constexpr auto popUpSize = ImVec2(300.0f, 100.0f); 8 static constexpr auto popUpButtonSize = ImVec2(120.0f, 0.0f); 9 static constexpr auto popUpPos = ImVec2(1280.0f / 2.0f - popUpSize.x / 2. ...

[imgui] 6. Calendar

2023년 7월 10일
imgui

목표 # 해당하는 날짜에 스트링으로 일정을 메모할 수 있는 캘린더앱 윤년 적용 오늘날짜는 파란색, 선택된날짜는 초록색, 일정이 있다면 빨간색 프로그램 종료 시 자동으로 캘린더 파일 저장, 시작 시 로드 구현코드 # github 링크 메인함수 # render.hpp 1class WindowClass 2{ 3public: 4 // Add Meeting 버튼 윈도우 팝업 설정들 5 static constexpr auto popUpFlags = 6 ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoMove | 7 ImGuiWindowFlags_NoCollapse | ImGuiWindowFlags_NoScrollbar; 8 static constexpr auto popUpSize = ImVec2(300. ...

[imgui] 5. Paint 구현

2023년 7월 8일
imgui

목표 # 그림판을 만들기 색 변경, 펜 두께 변경, Save, Load, CLear 기능 구현코드 # 메인함수 # render.hpp 1#include <cstdint> 2#include <string_view> 3#include <imgui.h> 4#include <vector> 5 6class WindowClass 7{ 8public: 9 // position, color, size 3가지 데이터를 묶어서 하나의 PointData로 사용 10 using PointData = std::tuple<ImVec2, ImColor, float>; 11 12 static constexpr auto popUpFlags = 13 ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoMove | 14 ImGuiWindowFlags_NoCollapse | ImGuiWindowFlags_NoScrollbar; 15 static constexpr auto popUpSize = ImVec2(300. ...

[imgui] 4. DiffViewer 구현

2023년 7월 8일
imgui

목표 # 두 파일에서 다른 라인은 빨간색으로 표시 다른 라인 수에 대한 카운트 버튼으로 해당 라인 덮어쓰기 구현 코드 # 메인함수 # render.h 1#include <cstdint> 2#include <string_view> 3#include <vector> 4#include <string> 5 6class WindowClass 7{ 8public: 9 // 파일의 내용은 vector에 스트링형태로 저장 10 using FileContent = std::vector<std::string>; 11 12public: 13 WindowClass() : filePath1("text1.txt"), filePath2("text2.txt"), 14 fileContent1({}), fileContent2({}), 15 diffResult1({}), diffResult2({}) 16 {} 17 18 void Draw(std::string_view label); 19 20private: 21 void DrawSelection(); // 파일 선택 + Compare버튼 메뉴바 22 void DrawDiffView(); // 파일 로드 후 비교해서 보여주는 화면 23 void DrawStats(); // 다른라인 수를 출력 24 25 // 파일 로드, 세이브 26 FileContent LoadFileContent(std::string_view file_path); 27 void SaveFileContent(std::string_view file_path, FileContent fileContent); 28 29 // 로드된 파일들의 차이점을 계산하는 함수 30 void CreateDiff(); 31 32private: 33 std::string filePath1; 34 std::string filePath2; 35 36 FileContent fileContent1; 37 FileContent fileContent2; 38 39 FileContent diffResult1; 40 FileContent diffResult2; 41}; 42 43void render(WindowClass &window_obj); render. ...

[imgui] 3. TextEditor 구현

2023년 7월 6일
imgui

목표 # 텍스트 편집이 가능한 텍스트 에디터 파일의 줄 수를 표시 텍스트파일 저장과 로드 기능 (키보드 단축키까지) 현재 열린 파일명, 확장자 확인가능 구현 코드 # 메인함수 # render.h 1#include <cstring> 2#include <string> 3#include <cstdint> 4#include <string_view> 5#include <filesystem> 6 7namespace fs = std::filesystem; 8 9class WindowClass 10{ 11public: 12 // 코드에서 사용할 상수값들 초기화 13 static constexpr auto bufferSize = std::size_t{1024}; 14 15 static constexpr auto popUpFlags = 16 ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoMove | 17 ImGuiWindowFlags_NoCollapse | ImGuiWindowFlags_NoScrollbar; 18 static constexpr auto popUpSize = ImVec2(300. ...

[imgui] 2. Plotter 구현

2023년 7월 5일
imgui

목표 # ImPlot을 사용해서 sin(x), cos(x) 데이터 플로팅. ImPlot : 그래프를 플로팅 하는 ImGui 기반의 데이터 시각화 라이브러리이다. 구현코드 # 메인함수 # ImPlot 라이브러리의 자원과 컨텍스트 초기화, 정리를 수행하는 코드 1// main.cpp 2ImPlot::CreateContext(); // ImPlot 초기화 3while (!glfwWindowShouldClose(window)) 4{ 5 start_cycle(); 6 7 ImGui::NewFrame(); 8 render(window_obj); 9 ImGui::Render(); 10 11 end_cycle(window); 12} 13ImPlot::DestroyContext(); // ImPlot 정리 Plotter의 구현 코드 render.h 1#include <cstdint> 2#include <string_view> 3#include <array> 4#include <set> 5 6class WindowClass 7{ 8public: 9 // 표시할 그래프 이름들을 지정. ...