[refactor] update stream window rendering for high-DPI scaling support

src/gui/panels/remote_peer_panel.cpp

@@ -188,20 +188,13 @@ int Render::ConnectTo(const std::string& remote_id, const char* password,
         memcpy(&props->params_, &params_, sizeof(Params));
         props->params_.user_id = props->local_id_.c_str();
         props->peer_ = CreatePeer(&props->params_);
-        props->control_window_min_width_ =
+
-            props->control_window_min_width_ * dpi_scale_;
+        props->control_window_width_ = title_bar_button_height_ * 7.5f;
-        props->control_window_min_height_ =
+        props->control_window_height_ = title_bar_button_height_ * 1.16f;
-            props->control_window_min_height_ * dpi_scale_;
+        props->control_window_min_width_ = title_bar_button_height_ * 0.65f;
-        props->control_window_max_width_ =
+        props->control_window_min_height_ = title_bar_button_height_ * 1.16f;
-            props->control_window_max_width_ * dpi_scale_;
+        props->control_window_max_width_ = title_bar_button_height_ * 7.5f;
-        props->control_window_max_height_ =
+        props->control_window_max_height_ = title_bar_button_height_ * 6.0f;
-            props->control_window_max_height_ * dpi_scale_;
-        props->control_window_width_ =
-            props->control_window_width_ * dpi_scale_;
-        props->control_window_height_ =
-            props->control_window_height_ * dpi_scale_;
-        // props->control_bar_pos_x_ = props->control_bar_pos_x_ * dpi_scale_;
-        // props->control_bar_pos_y_ = props->control_bar_pos_y_ * dpi_scale_;
 
         if (!props->peer_) {
           LOG_INFO("Create peer [{}] instance failed", props->local_id_);

src/gui/render.cpp

@@ -11,7 +11,7 @@
 #include "device_controller_factory.h"
 #include "fa_regular_400.h"
 #include "fa_solid_900.h"
-#include "layout.h"
+#include "layout_relative.h"
 #include "localization.h"
 #include "platform.h"
 #include "rd_log.h"
@@ -969,10 +969,11 @@ int Render::DrawStreamWindow() {
   StreamWindow();
 
   if (!fullscreen_button_pressed_) {
+    ImGuiIO& io = ImGui::GetIO();
     ImGui::SetNextWindowPos(ImVec2(0, 0), ImGuiCond_Always);
     ImGui::SetNextWindowSize(
-        ImVec2(stream_window_width_,
+        ImVec2(io.DisplaySize.x,
-               fullscreen_button_pressed_ ? 0 : title_bar_height_),
+               fullscreen_button_pressed_ ? 0 : title_bar_button_height_),
         ImGuiCond_Always);
     ImGui::Begin("StreamWindowTitleBar", nullptr,
                  ImGuiWindowFlags_NoMove | ImGuiWindowFlags_NoDecoration |

src/gui/render.h

@@ -294,6 +294,8 @@ class Render {
   /* ------ all windows property start ------ */
   float title_bar_width_ = 640;
   float title_bar_height_ = 30;
+  float title_bar_button_width_ = 30;
+  float title_bar_button_height_ = 30;
   /* ------ all windows property end ------ */
 
   /* ------ main window property start ------ */

src/gui/toolbars/control_bar.cpp

@@ -32,32 +32,29 @@ int LossRateDisplay(float loss_rate) {
 }
 
 int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
-  ImGui::PushStyleVar(ImGuiStyleVar_FrameRounding, 3.0f * dpi_scale_);
+  float button_width = title_bar_button_height_ * 0.8f;
+  float button_height = title_bar_button_height_ * 0.8f;
+  float line_padding = title_bar_button_height_ * 0.12f;
+  float line_thickness = title_bar_button_height_ * 0.07f;
 
+  ImGui::PushStyleVar(ImGuiStyleVar_FrameRounding, 3.0f);
   if (props->control_bar_expand_) {
-    float button_width = 24.0f * dpi_scale_;
+    ImGui::SetCursorPosX(props->is_control_bar_in_left_
-    float button_height = 24.0f * dpi_scale_;
+                             ? props->control_window_width_ * 1.02f
-    float line_padding = 4.0f * dpi_scale_;
+                             : props->control_window_width_ * 0.23f);
 
-    ImGui::SetCursorPosX(
-        props->is_control_bar_in_left_
-            ? (props->control_window_width_ + 5.0f * dpi_scale_)
-            : 50.0f * dpi_scale_);
-    // mouse control button
     ImDrawList* draw_list = ImGui::GetWindowDrawList();
-
+    if (!props->is_control_bar_in_left_) {
-    if (props->is_control_bar_in_left_) {
       draw_list->AddLine(
-          ImVec2(ImGui::GetCursorScreenPos().x - 5.0f * dpi_scale_,
+          ImVec2(ImGui::GetCursorScreenPos().x - button_height * 0.48f,
-                 ImGui::GetCursorScreenPos().y - 7.0f * dpi_scale_),
+                 ImGui::GetCursorScreenPos().y + button_height * 0.2f),
-          ImVec2(ImGui::GetCursorScreenPos().x - 5.0f * dpi_scale_,
+          ImVec2(ImGui::GetCursorScreenPos().x - button_height * 0.48f,
-                 ImGui::GetCursorScreenPos().y - 7.0f * dpi_scale_ +
+                 ImGui::GetCursorScreenPos().y + button_height * 0.8f),
-                     props->control_window_height_),
+          IM_COL32(178, 178, 178, 255), 2.0f);
-          IM_COL32(178, 178, 178, 255), 1.0f);
     }
 
     std::string display = ICON_FA_DISPLAY;
-    ImGui::SetWindowFontScale(0.5f);
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(display.c_str(), ImVec2(button_width, button_height))) {
       ImGui::OpenPopup("display");
     }
@@ -66,7 +63,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     ImVec2 btn_size_actual = ImGui::GetItemRectSize();
 
     if (ImGui::BeginPopup("display")) {
-      ImGui::SetWindowFontScale(0.5f);
+      ImGui::SetWindowFontScale(0.8f);
       for (int i = 0; i < props->display_info_list_.size(); i++) {
         if (ImGui::Selectable(props->display_info_list_[i].name.c_str())) {
           props->selected_display_ = i;
@@ -90,7 +87,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
         std::to_string(props->selected_display_ + 1).c_str());
     ImVec2 text_pos =
         ImVec2(btn_min.x + (btn_size_actual.x - text_size.x) * 0.5f,
-               btn_min.y + (btn_size_actual.y - text_size.y) * 0.5f - 2.0f);
+               btn_min.y + (btn_size_actual.y - text_size.y) * 0.35f);
     ImGui::GetWindowDrawList()->AddText(
         text_pos, IM_COL32(0, 0, 0, 255),
         std::to_string(props->selected_display_ + 1).c_str());
@@ -103,6 +100,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     std::string mouse = props->mouse_control_button_pressed_
                             ? ICON_FA_COMPUTER_MOUSE
                             : ICON_FA_COMPUTER_MOUSE;
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(mouse.c_str(), ImVec2(button_width, button_height))) {
       if (props->connection_established_) {
         start_keyboard_capturer_ = !start_keyboard_capturer_;
@@ -117,7 +115,6 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     }
 
     if (!props->mouse_control_button_pressed_) {
-      float line_thickness = 2.0f * dpi_scale_;
       draw_list->AddLine(ImVec2(disable_mouse_x, disable_mouse_y),
                          ImVec2(mouse_x + button_width - line_padding,
                                 mouse_y + button_height - line_padding),
@@ -143,6 +140,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     std::string audio = props->audio_capture_button_pressed_
                             ? ICON_FA_VOLUME_HIGH
                             : ICON_FA_VOLUME_HIGH;
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(audio.c_str(), ImVec2(button_width, button_height))) {
       if (props->connection_established_) {
         props->audio_capture_button_pressed_ =
@@ -162,7 +160,6 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     }
 
     if (!props->audio_capture_button_pressed_) {
-      float line_thickness = 2.0f * dpi_scale_;
       draw_list->AddLine(ImVec2(disable_audio_x, disable_audio_y),
                          ImVec2(audio_x + button_width - line_padding,
                                 audio_y + button_height - line_padding),
@@ -187,6 +184,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
       button_color_style_pushed = true;
     }
     std::string net_traffic_stats = ICON_FA_SIGNAL;
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(net_traffic_stats.c_str(),
                       ImVec2(button_width, button_height))) {
       props->net_traffic_stats_button_pressed_ =
@@ -210,6 +208,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     // fullscreen button
     std::string fullscreen =
         fullscreen_button_pressed_ ? ICON_FA_COMPRESS : ICON_FA_EXPAND;
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(fullscreen.c_str(),
                       ImVec2(button_width, button_height))) {
       fullscreen_button_pressed_ = !fullscreen_button_pressed_;
@@ -229,6 +228,7 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
     ImGui::SameLine();
     // close button
     std::string close_button = ICON_FA_XMARK;
+    ImGui::SetWindowFontScale(0.8f);
     if (ImGui::Button(close_button.c_str(),
                       ImVec2(button_width, button_height))) {
       CleanupPeer(props);
@@ -236,20 +236,27 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
 
     ImGui::SameLine();
 
-    if (!props->is_control_bar_in_left_) {
+    if (props->is_control_bar_in_left_) {
-      draw_list->AddLine(ImVec2(ImGui::GetCursorScreenPos().x - 3.0f,
+      draw_list->AddLine(
-                                ImGui::GetCursorScreenPos().y - 7.0f),
+          ImVec2(ImGui::GetCursorScreenPos().x + button_height * 0.2f,
-                         ImVec2(ImGui::GetCursorScreenPos().x - 3.0f,
+                 ImGui::GetCursorScreenPos().y + button_height * 0.2f),
-                                ImGui::GetCursorScreenPos().y - 7.0f +
+          ImVec2(ImGui::GetCursorScreenPos().x + button_height * 0.2f,
-                                    props->control_window_height_),
+                 ImGui::GetCursorScreenPos().y + button_height * 0.8f),
-                         IM_COL32(178, 178, 178, 255), 1.0f);
+          IM_COL32(178, 178, 178, 255), 2.0f);
     }
+
+    ImGui::SameLine();
   }
 
-  ImGui::SetCursorPosX(
+  float expand_button_pos_x =
-      props->is_control_bar_in_left_
+      props->control_bar_expand_ ? (props->is_control_bar_in_left_
-          ? (props->control_window_width_ * 2 - 20.0f * dpi_scale_)
+                                        ? props->control_window_width_ * 1.9f
-          : 5.0f * dpi_scale_);
+                                        : props->control_window_width_ * 0.03f)
+                                 : (props->is_control_bar_in_left_
+                                        ? props->control_window_width_ * 1.02f
+                                        : props->control_window_width_ * 0.23f);
+
+  ImGui::SetCursorPosX(expand_button_pos_x);
 
   std::string control_bar =
       props->control_bar_expand_
@@ -258,13 +265,13 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
           : (props->is_control_bar_in_left_ ? ICON_FA_ANGLE_RIGHT
                                             : ICON_FA_ANGLE_LEFT);
   if (ImGui::Button(control_bar.c_str(),
-                    ImVec2(15.0f * dpi_scale_, 25.0f * dpi_scale_))) {
+                    ImVec2(button_height * 0.6f, button_height))) {
     props->control_bar_expand_ = !props->control_bar_expand_;
     props->control_bar_button_pressed_time_ = ImGui::GetTime();
     props->control_window_width_is_changing_ = true;
 
     if (!props->control_bar_expand_) {
-      props->control_window_height_ = 35 * dpi_scale_;
+      props->control_window_height_ = props->control_window_min_height_;
       props->net_traffic_stats_button_pressed_ = false;
     }
   }
@@ -280,12 +287,13 @@ int Render::ControlBar(std::shared_ptr<SubStreamWindowProperties>& props) {
 
 int Render::NetTrafficStats(std::shared_ptr<SubStreamWindowProperties>& props) {
   ImGui::SetCursorPos(ImVec2(props->is_control_bar_in_left_
-                                 ? (props->control_window_width_ + 5.0f)
+                                 ? props->control_window_width_ * 1.02f
-                                 : 5.0f,
+                                 : props->control_window_width_ * 0.02f,
-                             35.0f * dpi_scale_));
+                             props->control_window_min_height_));
+  ImGui::SetWindowFontScale(0.8f);
   if (ImGui::BeginTable("NetTrafficStats", 4, ImGuiTableFlags_BordersH,
-                        ImVec2(props->control_window_max_width_ - 10.0f,
+                        ImVec2(props->control_window_max_width_ * 0.9f,
-                               props->control_window_max_height_ - 60.0f))) {
+                               props->control_window_max_height_ - 0.9f))) {
     ImGui::TableSetupColumn("", ImGuiTableColumnFlags_WidthFixed);
     ImGui::TableSetupColumn("", ImGuiTableColumnFlags_WidthStretch);
     ImGui::TableSetupColumn("", ImGuiTableColumnFlags_WidthStretch);
@@ -344,9 +352,12 @@ int Render::NetTrafficStats(std::shared_ptr<SubStreamWindowProperties>& props) {
     ImGui::Text("FPS");
     ImGui::TableNextColumn();
     ImGui::Text("%d", props->fps_);
+    ImGui::TableNextColumn();
+    ImGui::TableNextColumn();
 
     ImGui::EndTable();
   }
+  ImGui::SetWindowFontScale(1.0f);
 
   return 0;
 }

src/gui/toolbars/title_bar.cpp

@@ -9,10 +9,24 @@ namespace crossdesk {
 
 int Render::TitleBar(bool main_window) {
   ImGuiIO& io = ImGui::GetIO();
-  float title_bar_width = io.DisplaySize.x;
+  float title_bar_width = title_bar_width_;
-  float title_bar_height = io.DisplaySize.y * (TITLE_BAR_HEIGHT + 0.01f);
+  float title_bar_height = title_bar_height_;
-  float title_bar_button_width = io.DisplaySize.x * TITLE_BAR_BUTTON_WIDTH;
+  float title_bar_button_width = title_bar_button_width_;
-  float title_bar_button_height = io.DisplaySize.y * TITLE_BAR_BUTTON_HEIGHT;
+  float title_bar_button_height = title_bar_button_height_;
+  if (main_window) {
+    title_bar_width = io.DisplaySize.x;
+    title_bar_height = io.DisplaySize.y * (TITLE_BAR_HEIGHT + 0.01f);
+    title_bar_button_width = io.DisplaySize.x * TITLE_BAR_BUTTON_WIDTH;
+    title_bar_button_height = io.DisplaySize.y * TITLE_BAR_BUTTON_HEIGHT;
+    title_bar_height_ = title_bar_height;
+    title_bar_button_width_ = title_bar_button_width;
+    title_bar_button_height_ = title_bar_button_height;
+  } else {
+    title_bar_width = io.DisplaySize.x;
+    title_bar_height = title_bar_button_height_;
+    title_bar_button_width = title_bar_button_width_;
+    title_bar_button_height = title_bar_button_height_;
+  }
 
   ImGui::PushStyleColor(ImGuiCol_ChildBg, ImVec4(1.0f, 1.0f, 1.0f, 1.0f));
   ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(0, 0));
@@ -185,7 +199,7 @@ int Render::TitleBar(bool main_window) {
     ImGui::PushStyleColor(ImGuiCol_ButtonActive,
                           ImVec4(1.0f, 1.0f, 1.0f, 1.0f));
 
-    if (!window_maximized_) {
+    if (window_maximized_) {
       float pos_x_top = title_bar_width - title_bar_button_width * 1.65f;
       float pos_y_top = title_bar_button_height * 0.36f;
       float pos_x_bottom = title_bar_width - title_bar_button_width * 1.6f;

src/gui/windows/control_window.cpp

@@ -53,11 +53,11 @@ int Render::ControlWindow(std::shared_ptr<SubStreamWindowProperties>& props) {
       ImVec2(props->control_window_width_, props->control_window_height_),
       ImGuiCond_Always);
 
-  ImGui::SetNextWindowPos(ImVec2(0, title_bar_height_ + 1), ImGuiCond_Once);
+  ImGui::SetNextWindowPos(ImVec2(0, title_bar_height_), ImGuiCond_Once);
 
   float pos_x = 0;
   float pos_y = 0;
-  float y_boundary = fullscreen_button_pressed_ ? 0 : (title_bar_height_ + 1);
+  float y_boundary = fullscreen_button_pressed_ ? 0 : title_bar_height_;
 
   if (props->reset_control_bar_pos_) {
     float new_cursor_pos_x = 0;
@@ -94,7 +94,7 @@ int Render::ControlWindow(std::shared_ptr<SubStreamWindowProperties>& props) {
   } else if (!props->reset_control_bar_pos_ &&
                  ImGui::IsMouseReleased(ImGuiMouseButton_Left) ||
              props->control_window_width_is_changing_) {
-    if (props->control_window_pos_.x <= stream_window_width_ / 2) {
+    if (props->control_window_pos_.x <= stream_window_width_ * 0.5f) {
       if (props->control_window_pos_.y + props->control_window_height_ >
           stream_window_height_) {
         pos_y = stream_window_height_ - props->control_window_height_;
@@ -118,18 +118,16 @@ int Render::ControlWindow(std::shared_ptr<SubStreamWindowProperties>& props) {
         }
       }
       props->is_control_bar_in_left_ = true;
-    } else if (props->control_window_pos_.x > stream_window_width_ / 2) {
+    } else if (props->control_window_pos_.x > stream_window_width_ * 0.5f) {
       pos_x = 0;
       pos_y =
           (props->control_window_pos_.y >= y_boundary &&
            props->control_window_pos_.y <=
                stream_window_height_ - props->control_window_height_)
               ? props->control_window_pos_.y
-              : (props->control_window_pos_.y < (fullscreen_button_pressed_
+              : (props->control_window_pos_.y <
-                                                     ? 0
+                         (fullscreen_button_pressed_ ? 0 : title_bar_height_)
-                                                     : (title_bar_height_ + 1))
+                     ? (fullscreen_button_pressed_ ? 0 : title_bar_height_)
-                     ? (fullscreen_button_pressed_ ? 0
-                                                   : (title_bar_height_ + 1))
                      : (stream_window_height_ - props->control_window_height_));
 
       if (props->control_bar_expand_) {
@@ -205,10 +203,10 @@ int Render::ControlWindow(std::shared_ptr<SubStreamWindowProperties>& props) {
 
   std::string control_child_window_title =
       props->remote_id_ + "ControlChildWindow";
-  ImGui::BeginChild(
+  ImGui::BeginChild(control_child_window_title.c_str(),
-      control_child_window_title.c_str(),
+                    ImVec2(props->control_window_width_ * 2.0f,
-      ImVec2(props->control_window_width_ * 2, props->control_window_height_),
+                           props->control_window_height_),
-      ImGuiChildFlags_Border, ImGuiWindowFlags_NoDecoration);
+                    ImGuiChildFlags_Border, ImGuiWindowFlags_NoDecoration);
   ImGui::PopStyleColor();
 
   ControlBar(props);

src/gui/windows/stream_window.cpp

@@ -69,9 +69,13 @@ int Render::StreamWindow() {
       ImGuiWindowFlags_NoBringToFrontOnFocus | ImGuiWindowFlags_NoMove;
 
   if (!fullscreen_button_pressed_) {
-    ImGui::SetNextWindowPos(ImVec2(20.0f * dpi_scale_, 0), ImGuiCond_Always);
+    ImGui::SetNextWindowPos(
-    ImGui::SetNextWindowSize(ImVec2(0, 30.0f * dpi_scale_), ImGuiCond_Always);
+        ImVec2(title_bar_height_ * 0.2f, title_bar_height_ * 0.2f),
-    ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(0.0f, 8.0f));
+        ImGuiCond_Always);
+    ImGui::SetNextWindowSize(
+        ImVec2(title_bar_height_ * 4.0f, title_bar_height_ * 0.8f),
+        ImGuiCond_Always);
+    ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(0.0f, 0.0f));
     ImGui::PushStyleVar(ImGuiStyleVar_WindowBorderSize, 0.0f);
     ImGui::PushStyleColor(ImGuiCol_WindowBg, ImVec4(0, 0, 0, 0.0f));
     ImGui::Begin("TabBar", nullptr,