ui: lower vertical spacing to 6 pixels

Chilledheart · Jul 25, 2024 · dae7878 · dae7878
1 parent 87ac973
commit dae7878
Show file tree

Hide file tree

Showing 9 changed files with 148 additions and 134 deletions.
diff --git a/src/gtk/option_dialog.cpp b/src/gtk/option_dialog.cpp
@@ -57,7 +57,7 @@ OptionDialog::OptionDialog(const std::string& title, GtkWindow* parent, bool mod
   gtk_widget_set_margin_right(GTK_WIDGET(grid), 12);
 #endif
   gtk_grid_set_column_spacing(GTK_GRID(grid), 12);
-  gtk_grid_set_row_spacing(GTK_GRID(grid), 12);
+  gtk_grid_set_row_spacing(GTK_GRID(grid), 6);
 
   okay_button_ = GTK_BUTTON(gtk_button_new());
   gtk_button_set_label(okay_button_, _("Okay"));

diff --git a/src/gtk/yass_window.cpp b/src/gtk/yass_window.cpp
@@ -266,7 +266,7 @@ YASSWindow::YASSWindow() : impl_(GTK_WINDOW(gtk_window_new(GTK_WINDOW_TOPLEVEL))
   gtk_widget_set_margin_right(GTK_WIDGET(grid), 12);
 #endif
   gtk_grid_set_column_spacing(GTK_GRID(grid), 12);
-  gtk_grid_set_row_spacing(GTK_GRID(grid), 12);
+  gtk_grid_set_row_spacing(GTK_GRID(grid), 6);
 
   gtk_box_pack_start(vbox, GTK_WIDGET(grid), true, false, 0);
 

diff --git a/src/gtk4/option_dialog.ui b/src/gtk4/option_dialog.ui
@@ -11,7 +11,7 @@
             <property name="margin-end">12</property>
             <property name="margin-top">12</property>
             <property name="margin-bottom">12</property>
-            <property name="row-spacing">12</property>
+            <property name="row-spacing">6</property>
             <property name="column-spacing">12</property>
             <child>
               <object class="GtkLabel">

diff --git a/src/gtk4/yass_window.ui b/src/gtk4/yass_window.ui
@@ -23,7 +23,7 @@
             <property name="margin-end">12</property>
             <property name="margin-top">12</property>
             <property name="margin-bottom">12</property>
-            <property name="row-spacing">12</property>
+            <property name="row-spacing">6</property>
             <property name="column-spacing">12</property>
             <property name="row-homogeneous">true</property>
             <child>
@@ -302,6 +302,10 @@
         </child>
         <child type="statusbar">
           <object class="GtkStatusbar" id="status_bar">
+            <property name="margin-start">10</property>
+            <property name="margin-end">10</property>
+            <property name="margin-top">6</property>
+            <property name="margin-bottom">6</property>
           </object>
         </child>
       </object>

diff --git a/src/mac/Base.lproj/Main.storyboard b/src/mac/Base.lproj/Main.storyboard
diff --git a/src/qt6/option_dialog.cpp b/src/qt6/option_dialog.cpp
@@ -20,7 +20,8 @@ OptionDialog::OptionDialog(QWidget* parent) : QDialog(parent) {
 
   QGridLayout* grid = new QGridLayout;
   grid->setContentsMargins(12, 12, 12, 12);
-  grid->setSpacing(12);
+  grid->setHorizontalSpacing(12);
+  grid->setVerticalSpacing(6);
 
   auto tcp_keep_alive_label = new QLabel(tr("TCP keep alive"));
   auto tcp_keep_alive_cnt_label = new QLabel(tr("The number of TCP keep-alive probes"));

diff --git a/src/qt6/yass_window.cpp b/src/qt6/yass_window.cpp
@@ -67,7 +67,8 @@ YASSWindow::YASSWindow(QWidget* parent) : QMainWindow(parent) {
 
   QGridLayout* grid = new QGridLayout;
   grid->setContentsMargins(12, 12, 12, 12);
-  grid->setSpacing(12);
+  grid->setHorizontalSpacing(12);
+  grid->setVerticalSpacing(6);
 
   // Left (Column 0) << Grid << Vertical Box
 

diff --git a/src/win32/yass.cpp b/src/win32/yass.cpp
@@ -165,7 +165,7 @@ BOOL CYassApp::InitInstance() {
   std::wstring frame_name = LoadStringStdW(m_hInstance, IDS_APP_TITLE);
 
   UINT uDpi = Utils::GetDpiForWindowOrSystem(nullptr);
-  RECT rect{0, 0, MULDIVDPI(530), MULDIVDPI(540)};
+  RECT rect{0, 0, MULDIVDPI(500), MULDIVDPI(520)};
 
   // https://docs.microsoft.com/en-us/windows/win32/api/winuser/nf-winuser-showwindow
   int nCmdShow = absl::GetFlag(FLAGS_background) ? SW_HIDE : SW_SHOW;

diff --git a/src/win32/yass_frame.cpp b/src/win32/yass_frame.cpp
@@ -35,25 +35,29 @@ __CRT_UUID_DECL(TrayIcon, 0x4324603D, 0x4274, 0x47AA, 0xBA, 0xD5, 0x7C, 0xF6, 0x
 #endif
 #endif
 
-#define INITIAL_COLUMN_ONE_LEFT 20
-#define INITIAL_COLUMN_TWO_LEFT 120
-#define INITIAL_COLUMN_THREE_LEFT 240
-
+#define INITIAL_ROW_HEIGHT 12
 #define INITIAL_VERTICAL_HEIGHT 30
 
-#define INITIAL_BUTTON_WIDTH 75
+#define INITIAL_BUTTON_WIDTH 80
 #define INITIAL_BUTTON_HEIGHT 30
 
-#define INITIAL_LABEL_WIDTH 130
-#define INITIAL_LABEL_HEIGHT 25
-#define INITIAL_EDIT_WIDTH 220
-#define INITIAL_EDIT_HEIGHT 25
+#define INITIAL_LABEL_WIDTH 200
+#define INITIAL_LABEL_HEIGHT 24
+#define INITIAL_EDIT_WIDTH 160
+#define INITIAL_EDIT_HEIGHT 24
 #define INITIAL_STATUS_BAR_HEIGHT 20
 
+static_assert(INITIAL_LABEL_HEIGHT == INITIAL_EDIT_HEIGHT);
+
+#define INITIAL_COLUMN_ONE_LEFT 12
+#define INITIAL_COLUMN_TWO_LEFT (INITIAL_COLUMN_ONE_LEFT + INITIAL_BUTTON_WIDTH + 12)
+#define INITIAL_COLUMN_THREE_LEFT (INITIAL_COLUMN_TWO_LEFT + INITIAL_LABEL_WIDTH + 12)
+
 #define COLUMN_ONE_LEFT MulDiv(INITIAL_COLUMN_ONE_LEFT, uDpi, 96)
 #define COLUMN_TWO_LEFT MulDiv(INITIAL_COLUMN_TWO_LEFT, uDpi, 96)
 #define COLUMN_THREE_LEFT MulDiv(INITIAL_COLUMN_THREE_LEFT, uDpi, 96)
 
+#define ROW_HEIGHT MulDiv(INITIAL_ROW_HEIGHT, uDpi, 96)
 #define VERTICAL_HEIGHT MulDiv(INITIAL_VERTICAL_HEIGHT, uDpi, 96)
 
 #define BUTTON_WIDTH MulDiv(INITIAL_BUTTON_WIDTH, uDpi, 96)
@@ -841,124 +845,128 @@ void CYassFrame::UpdateLayoutForDpi(UINT uDpi) {
   // RIGHT Panel
   // Column 2
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 0;
   SetWindowPos(server_host_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 2;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 1;
   SetWindowPos(server_sni_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 3;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 2;
   SetWindowPos(server_port_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 4;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 3;
   SetWindowPos(username_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 5;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 4;
   SetWindowPos(password_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 6;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 5;
   SetWindowPos(method_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 7;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 6;
   SetWindowPos(local_host_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 8;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 7;
   SetWindowPos(local_port_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 9;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 8;
   SetWindowPos(doh_url_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 10;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 9;
   SetWindowPos(dot_host_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 11;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 10;
   SetWindowPos(limit_rate_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 12;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 11;
   SetWindowPos(timeout_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 13;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 12;
   SetWindowPos(autostart_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_TWO_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 14;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 13;
   SetWindowPos(systemproxy_label_, nullptr, rect.left, rect.top, LABEL_WIDTH, LABEL_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);
 
   // Column 3
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 0;
   SetWindowPos(server_host_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 2;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 1;
   SetWindowPos(server_sni_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 3;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 2;
   SetWindowPos(server_port_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 4;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 3;
   SetWindowPos(username_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 5;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 4;
   SetWindowPos(password_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
+  for (int i = 0, cnt = ComboBox_GetCount(method_combo_box_); i < cnt; ++i) {
+    ComboBox_SetItemHeight(method_combo_box_, i, EDIT_HEIGHT);
+  }
+
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 6;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 5;
   SetWindowPos(method_combo_box_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 7;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 6;
   SetWindowPos(local_host_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 8;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 7;
   SetWindowPos(local_port_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 9;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 8;
   SetWindowPos(doh_url_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 10;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 9;
   SetWindowPos(dot_host_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 11;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 10;
   SetWindowPos(limit_rate_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 12;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 11;
   SetWindowPos(timeout_edit_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 13;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 12;
   SetWindowPos(autostart_button_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT, SWP_NOZORDER | SWP_NOACTIVATE);
 
   rect.left = client_rect.left + COLUMN_THREE_LEFT;
-  rect.top = client_rect.top + VERTICAL_HEIGHT * 14;
+  rect.top = client_rect.top + ROW_HEIGHT + VERTICAL_HEIGHT * 13;
   SetWindowPos(systemproxy_button_, nullptr, rect.left, rect.top, EDIT_WIDTH, EDIT_HEIGHT,
                SWP_NOZORDER | SWP_NOACTIVATE);