[gtk: 1/3] TreeView: Get expander size from CSS min-width|height



commit 91784238447e9127324127dc41810ed6383ecd8e
Author: Daniel Boles <dboles src gmail com>
Date:   Wed Jun 20 21:11:59 2018 +0100

    TreeView: Get expander size from CSS min-width|height
    
    Rather than hard-coding this, get it from CSS. That way, themes will be
    able to set larger expanders than a fixed 16 px, e.g. for accessibility.
    
    See https://gitlab.gnome.org/GNOME/gtk/merge_requests/167

 gtk/gtktreeview.c                                | 25 ++++++++++++++++++++----
 gtk/theme/Adwaita/_common.scss                   |  3 +++
 gtk/theme/Adwaita/gtk-contained-dark.css         |  2 +-
 gtk/theme/Adwaita/gtk-contained.css              |  2 +-
 gtk/theme/HighContrast/_common.scss              |  3 +++
 gtk/theme/HighContrast/gtk-contained-inverse.css |  2 +-
 gtk/theme/HighContrast/gtk-contained.css         |  2 +-
 7 files changed, 31 insertions(+), 8 deletions(-)
---
diff --git a/gtk/gtktreeview.c b/gtk/gtktreeview.c
index f77f60d3a8..87bb56ce88 100644
--- a/gtk/gtktreeview.c
+++ b/gtk/gtktreeview.c
@@ -262,9 +262,7 @@ typedef enum {
 #define TREE_WINDOW_Y_TO_RBTREE_Y(tree_view,y) ((y) + tree_view->priv->dy)
 #define RBTREE_Y_TO_TREE_WINDOW_Y(tree_view,y) ((y) - tree_view->priv->dy)
 
-/* Size of the expander arrow */
-#define _TREE_VIEW_EXPANDER_SIZE 16
-/* Vertical separator width. Must be an eben number. */
+/* Vertical separator width. Must be an even number. */
 #define _TREE_VIEW_VERTICAL_SEPARATOR 2
 /* Horizontal separator width. Must be an even number.  */
 #define _TREE_VIEW_HORIZONTAL_SEPARATOR 4
@@ -2712,7 +2710,26 @@ row_is_separator (GtkTreeView *tree_view,
 static int
 gtk_tree_view_get_expander_size (GtkTreeView *tree_view)
 {
-  return _TREE_VIEW_EXPANDER_SIZE + (_TREE_VIEW_HORIZONTAL_SEPARATOR / 2);
+  GtkStyleContext *context;
+  GtkCssStyle *style;
+  int min_width;
+  int min_height;
+  int expander_size;
+
+  context = gtk_widget_get_style_context (GTK_WIDGET (tree_view));
+  gtk_style_context_save (context);
+  gtk_style_context_add_class (context, GTK_STYLE_CLASS_EXPANDER);
+
+  style = gtk_style_context_lookup_style (context);
+  min_width = _gtk_css_number_value_get
+    (gtk_css_style_get_value (style, GTK_CSS_PROPERTY_MIN_WIDTH), 100);
+  min_height = _gtk_css_number_value_get
+    (gtk_css_style_get_value (style, GTK_CSS_PROPERTY_MIN_HEIGHT), 100);
+
+  gtk_style_context_restore (context);
+
+  expander_size = MAX (min_width, min_height);
+  return expander_size + (_TREE_VIEW_HORIZONTAL_SEPARATOR / 2);
 }
 
 static void
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 52461e0789..f50f86211e 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -1783,6 +1783,9 @@ treeview.view {
   }
 
   &.expander {
+    // GtkTreeView uses the larger of the expander’s min-width and min-height
+    min-width: 16px;
+    min-height: 16px;
     -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
 
     &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index d5222330b1..b6493e9959 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -726,7 +726,7 @@ treeview.view:drop(active).after { border-top-style: none; }
 
 treeview.view:drop(active).before { border-bottom-style: none; }
 
-treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); color: #bdbebf; }
+treeview.view.expander { min-width: 16px; min-height: 16px; -gtk-icon-source: 
-gtk-icontheme("pan-end-symbolic"); color: #bdbebf; }
 
 treeview.view.expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index d99d1b1691..e48eddb017 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -734,7 +734,7 @@ treeview.view:drop(active).after { border-top-style: none; }
 
 treeview.view:drop(active).before { border-bottom-style: none; }
 
-treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); color: #4d4d4d; }
+treeview.view.expander { min-width: 16px; min-height: 16px; -gtk-icon-source: 
-gtk-icontheme("pan-end-symbolic"); color: #4d4d4d; }
 
 treeview.view.expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
 
diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index 5b7cab92f1..58d28c5def 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -1367,6 +1367,9 @@ treeview.view {
   }
 
   &.expander {
+    // GtkTreeView uses the larger of the expander’s min-width and min-height
+    min-width: 16px;
+    min-height: 16px;
     -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
     &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
     color: mix($fg_color, $base_color, 70%);
diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css 
b/gtk/theme/HighContrast/gtk-contained-inverse.css
index 1ac9d8db13..fd341012fc 100644
--- a/gtk/theme/HighContrast/gtk-contained-inverse.css
+++ b/gtk/theme/HighContrast/gtk-contained-inverse.css
@@ -572,7 +572,7 @@ treeview.view:backdrop { color: #fff; border-left-color: gray; border-top: #000;
 
 treeview.view.dnd { border-style: solid none; border-width: 1px; border-color: #eeeeee; }
 
-treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); color: #b8b8b8; }
+treeview.view.expander { min-width: 16px; min-height: 16px; -gtk-icon-source: 
-gtk-icontheme("pan-end-symbolic"); color: #b8b8b8; }
 
 treeview.view.expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
 
diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css
index 1e6e2e6b40..14cd0c6341 100644
--- a/gtk/theme/HighContrast/gtk-contained.css
+++ b/gtk/theme/HighContrast/gtk-contained.css
@@ -576,7 +576,7 @@ treeview.view:backdrop { color: #000; border-left-color: gray; border-top: #fff;
 
 treeview.view.dnd { border-style: solid none; border-width: 1px; border-color: black; }
 
-treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); color: #4d4d4d; }
+treeview.view.expander { min-width: 16px; min-height: 16px; -gtk-icon-source: 
-gtk-icontheme("pan-end-symbolic"); color: #4d4d4d; }
 
 treeview.view.expander:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]