[feat] change recent connections layout

src/single_window/main_window.cpp

@@ -74,29 +74,36 @@ int Render::ShowRecentConnections() {
   int recent_connection_sub_container_width =
       recent_connection_image_width_ + 16.0f;
   int recent_connection_sub_container_height =
-      recent_connection_image_height_ + 32.0f;
+      recent_connection_image_height_ + 36.0f;
-  ImGui::PushStyleColor(ImGuiCol_ChildBg, ImVec4(1.0f, 1.0f, 1.0f, 1.0f));
+  ImGui::PushStyleColor(ImGuiCol_ChildBg,
+                        ImVec4(239.0 / 255, 240.0 / 255, 242.0 / 255, 1.0f));
+  ImGui::PushStyleVar(ImGuiStyleVar_ChildRounding, 10.0f);
   ImGui::BeginChild("RecentConnectionsContainer",
-                    ImVec2(main_window_width_default_ - 50.0f, 152.0f),
+                    ImVec2(main_window_width_default_ - 50.0f, 145.0f),
                     ImGuiChildFlags_Border,
                     ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoCollapse |
                         ImGuiWindowFlags_NoMove | ImGuiWindowFlags_NoTitleBar |
                         ImGuiWindowFlags_NoBringToFrontOnFocus |
-                        ImGuiWindowFlags_AlwaysHorizontalScrollbar);
+                        ImGuiWindowFlags_AlwaysHorizontalScrollbar |
+                        ImGuiWindowFlags_NoScrollbar |
+                        ImGuiWindowFlags_NoScrollWithMouse);
+  ImGui::PopStyleVar();
   ImGui::PopStyleColor();
   int recent_connections_count = recent_connection_textures_.size();
   int count = 0;
-  int button_width = 20;
+  int button_width = 22;
-  int button_height = 20;
+  int button_height = 22;
   for (auto it = recent_connection_textures_.begin();
        it != recent_connection_textures_.end(); ++it) {
     sub_containers_pos[it->first] = ImGui::GetCursorPos();
     std::string recent_connection_sub_window_name =
         "RecentConnectionsSubContainer" + it->first;
+    // recent connections sub container
+
     ImGui::BeginChild(recent_connection_sub_window_name.c_str(),
                       ImVec2(recent_connection_sub_container_width,
                              recent_connection_sub_container_height),
-                      ImGuiChildFlags_Border,
+                      ImGuiChildFlags_None,
                       ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoCollapse |
                           ImGuiWindowFlags_NoMove |
                           ImGuiWindowFlags_NoTitleBar |
@@ -109,8 +116,8 @@ int Render::ShowRecentConnections() {
 
     // remote id length is 9
     // password length is 6
-    // connection_info -> remote_id + Y + password + host_name
+    // connection_info -> remote_id + 'Y' + password + host_name
-    //                 -> remote_id + N + host_name
+    //                 -> remote_id + 'N' + host_name
     if ('Y' == connection_info[9] && connection_info.size() >= 16) {
       remote_id = connection_info.substr(0, 9);
       password = connection_info.substr(10, 6);
@@ -122,34 +129,62 @@ int Render::ShowRecentConnections() {
       host_name = "unknown";
     }
 
-    ImGui::SetWindowFontScale(0.4f);
+    ImVec2 image_screen_pos = ImVec2(ImGui::GetCursorScreenPos().x + 5.0f,
-    ImVec2 window_size = ImGui::GetWindowSize();
+                                     ImGui::GetCursorScreenPos().y + 5.0f);
-    ImVec2 text_size = ImGui::CalcTextSize(host_name.c_str());
+    ImVec2 image_pos =
-    ImVec2 pos = ImGui::GetCursorPos();
+        ImVec2(ImGui::GetCursorPosX() + 5.0f, ImGui::GetCursorPosY() + 5.0f);
-    pos.x = (window_size.x - text_size.x) / 2.0f;
+    ImGui::SetCursorPos(image_pos);
-    ImGui::SetCursorPos(pos);
-    ImGui::Text(host_name.c_str());
-    ImGui::SetWindowFontScale(1.0f);
-    ImVec2 image_pos = ImGui::GetCursorPos();
     ImGui::Image((ImTextureID)(intptr_t)it->second,
                  ImVec2((float)recent_connection_image_width_,
                         (float)recent_connection_image_height_));
 
-    ImGui::PushStyleColor(ImGuiCol_Button, ImVec4(1.0f, 1.0f, 1.0f, 0.8f));
+    // remote id display button
+    {
+      ImGui::PushStyleColor(ImGuiCol_Button, ImVec4(0, 0, 0, 0.2f));
+      ImGui::PushStyleColor(ImGuiCol_ButtonHovered, ImVec4(0, 0, 0, 0.2f));
+      ImGui::PushStyleColor(ImGuiCol_ButtonActive, ImVec4(0, 0, 0, 0.2f));
+
+      ImVec2 dummy_button_pos =
+          ImVec2(image_pos.x, image_pos.y + recent_connection_image_height_);
+      std::string dummy_button_name = "##DummyButton" + remote_id;
+      ImGui::SetCursorPos(dummy_button_pos);
+      ImGui::SetWindowFontScale(0.6f);
+      ImGui::Button(dummy_button_name.c_str(),
+                    ImVec2(recent_connection_image_width_ - 2 * button_width,
+                           button_height));
+      ImGui::SetCursorPos(
+          ImVec2(dummy_button_pos.x + 2.0f, dummy_button_pos.y + 1.0f));
+      ImGui::Text(remote_id.c_str());
+      ImGui::PopStyleColor(3);
+
+      if (ImGui::IsItemHovered()) {
+        ImGui::BeginTooltip();
+        ImGui::SetWindowFontScale(0.5f);
+        ImGui::Text(host_name.c_str());
+        ImGui::SetWindowFontScale(1.0f);
+        ImGui::EndTooltip();
+      }
+    }
+
+    ImGui::PushStyleColor(ImGuiCol_Button, ImVec4(0, 0, 0, 0.2f));
     ImGui::PushStyleColor(ImGuiCol_ButtonHovered,
                           ImVec4(0.1f, 0.4f, 0.8f, 1.0f));
     ImGui::PushStyleColor(ImGuiCol_ButtonActive,
                           ImVec4(1.0f, 1.0f, 1.0f, 0.7f));
-    ImVec2 trash_can_button_pos =
+
-        ImVec2(image_pos.x,
+    // trash button
-               image_pos.y + recent_connection_image_height_ - button_height);
+    {
+      ImVec2 trash_can_button_pos = ImVec2(
+          image_pos.x + recent_connection_image_width_ - 2 * button_width,
+          image_pos.y + recent_connection_image_height_);
       ImGui::SetCursorPos(trash_can_button_pos);
       ImGui::SetWindowFontScale(0.5f);
       std::string trash_can = ICON_FA_TRASH_CAN;
       std::string recent_connection_delete_button_name =
           trash_can + "##RecentConnectionDelete" +
           std::to_string(trash_can_button_pos.x);
-    if (ImGui::Button(recent_connection_delete_button_name.c_str())) {
+      if (ImGui::Button(recent_connection_delete_button_name.c_str(),
+                        ImVec2(button_width, button_height))) {
         show_confirm_delete_connection_ = true;
       }
 
@@ -159,10 +194,13 @@ int Render::ShowRecentConnections() {
           delete_connection_ = false;
         }
       }
+    }
 
+    // connect button
+    {
       ImVec2 connect_button_pos =
           ImVec2(image_pos.x + recent_connection_image_width_ - button_width,
-               image_pos.y + recent_connection_image_height_ - button_height);
+                 image_pos.y + recent_connection_image_height_);
       ImGui::SetCursorPos(connect_button_pos);
       std::string connect = ICON_FA_ARROW_RIGHT_LONG;
       std::string connect_to_this_connection_button_name =
@@ -175,13 +213,27 @@ int Render::ShowRecentConnections() {
         strncpy(remote_password_, password.c_str(), 6);
         ConnectTo();
       }
+    }
+
     ImGui::SetWindowFontScale(1.0f);
     ImGui::PopStyleColor(3);
 
     ImGui::EndChild();
 
+    // 绘制纵向分割线
+    if (count != recent_connections_count - 1) {
+      ImVec2 line_start =
+          ImVec2(image_screen_pos.x + recent_connection_image_width_ + 20.0f,
+                 image_screen_pos.y);  // 起点
+      ImVec2 line_end = ImVec2(
+          image_screen_pos.x + recent_connection_image_width_ + 20.0f,
+          image_screen_pos.y + recent_connection_image_height_ + button_height);
+      ImGui::GetForegroundDrawList()->AddLine(line_start, line_end,
+                                              IM_COL32(0, 0, 0, 122), 1.0f);
+    }
+
     count++;
-    ImGui::SameLine(0, count != recent_connections_count ? 23.0f : 0.0f);
+    ImGui::SameLine(0, count != recent_connections_count ? 26.0f : 0.0f);
   }
 
   ImGui::EndChild();

src/single_window/render.cpp

@@ -533,7 +533,6 @@ int Render::SetupFontAndStyle() {
                                  30.0f, &config, icon_ranges);
 
   io.Fonts->Build();
-
   // Setup Dear ImGui style
   // ImGui::StyleColorsDark();
   ImGui::StyleColorsLight();
@@ -842,6 +841,7 @@ int Render::Run() {
           audio_capture_button_pressed_ = false;
           fullscreen_button_pressed_ = false;
           reload_recent_connections_ = true;
+          remember_password_ = false;
 
           SDL_SetWindowFullscreen(main_window_, SDL_FALSE);
           memset(audio_buffer_, 0, 720);

src/single_window/thumbnail.cpp

@@ -97,13 +97,13 @@ int Thumbnail::SaveToThumbnail(const char* yuv420p, int width, int height,
 
     std::string image_name;
     if (password.empty()) {
-      image_name = remote_id + "N" + host_name;
+      image_name = remote_id + 'N' + host_name;
     } else {
       // delete the file which has no password in its name
       std::string filename_without_password = remote_id + "N" + host_name;
       DeleteThumbnail(filename_without_password);
 
-      image_name = remote_id + "Y" + password + host_name;
+      image_name = remote_id + 'Y' + password + host_name;
     }
 
     std::string ciphertext = AES_encrypt(image_name, aes128_key_, aes128_iv_);