view-icon-item-ui: Fix labels sizing

We want all items to have the same width and for this we have been
setting GtkLabel:max-width-characters to 0, such that labels take
grow only until the width defined by the icon container.

Unfortunately, doing this for wrapping labels in a dynamic grid causes
allocation warnings and visual glytches (labels overflowing the height
of their container), which I assume are due to the labels reporting a
minumum height for a width which goes beyong the minimum width set on
the icon container.

So, instead of setting Gtk:Label:max-width-characters to 0, wrap the
whole thing in a horizontal AdwClamp with its :maximum-size set to 0.
This forces the labels to report a height which corresponds to the
actual minimum width set by the icon container.

Also, remove some meaningless properties from the UI file.

1 files changed, 69 insertions, 73 deletions

diff --git a/src/resources/ui/nautilus-view-icon-item-ui.ui b/src/resources/ui/nautilus-view-icon-item-ui.ui
index e005a6d68..6b384f5db 100644
--- a/src/resources/ui/nautilus-view-icon-item-ui.ui
+++ b/src/resources/ui/nautilus-view-icon-item-ui.ui
@@ -3,90 +3,86 @@
   <requires lib="gtk" version="4.0"/>
   <template class="NautilusViewIconItemUi" parent="GtkBox">
     <child>
-      <object class="GtkBox">
-        <property name="orientation">vertical</property>
-        <property name="halign">center</property>
-        <property name="valign">start</property>
-        <property name="spacing">6</property>
-        <child>
-          <object class="GtkBox" id="fixed_height_box">
-            <property name="orientation">vertical</property>
-            <property name="halign">center</property>
-            <property name="height-request">96</property>
-            <property name="valign">center</property>
-            <property name="width-request">96</property>
-            <child>
-              <object class="GtkPicture" id="icon">
-                <property name="halign">center</property>
-                <property name="hexpand">True</property>
-                <property name="valign">center</property>
-                <property name="vexpand">True</property>
-                <property name="can-shrink">False</property>
-              </object>
-            </child>
-          </object>
-        </child>
-        <child>
+      <object class="AdwClamp">
+        <property name="maximum-size">0</property>
+        <property name="child">
           <object class="GtkBox">
             <property name="orientation">vertical</property>
-            <property name="valign">start</property>
-            <child>
-              <object class="GtkLabel" id="label">
-                <property name="ellipsize">middle</property>
-                <property name="justify">center</property>
-                <property name="lines">3</property>
-                <property name="max-width-chars">0</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word-char</property>
-                <attributes>
-                  <attribute name="insert-hyphens" value="false"></attribute>
-                </attributes>
-              </object>
-            </child>
+            <property name="spacing">6</property>
             <child>
-              <object class="GtkLabel" id="first_caption">
-                <property name="ellipsize">end</property>
-                <property name="justify">center</property>
-                <property name="lines">2</property>
-                <property name="max-width-chars">0</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word-char</property>
-                <property name="valign">start</property>
-                <style>
-                  <class name="caption"/>
-                </style>
-              </object>
-            </child>
-            <child>
-              <object class="GtkLabel" id="second_caption">
-                <property name="ellipsize">end</property>
-                <property name="justify">center</property>
-                <property name="lines">2</property>
-                <property name="max-width-chars">0</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word-char</property>
-                <property name="valign">start</property>
-                <style>
-                  <class name="caption"/>
-                </style>
+              <object class="GtkBox" id="fixed_height_box">
+                <property name="orientation">vertical</property>
+                <property name="halign">center</property>
+                <child>
+                  <object class="GtkPicture" id="icon">
+                    <property name="halign">center</property>
+                    <property name="hexpand">True</property>
+                    <property name="valign">center</property>
+                    <property name="vexpand">True</property>
+                    <property name="can-shrink">False</property>
+                  </object>
+                </child>
               </object>
             </child>
             <child>
-              <object class="GtkLabel" id="third_caption">
-                <property name="ellipsize">end</property>
-                <property name="justify">center</property>
-                <property name="lines">2</property>
-                <property name="max-width-chars">0</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word-char</property>
-                <property name="valign">start</property>
+              <object class="GtkBox">
+                <property name="orientation">vertical</property>
                 <style>
-                  <class name="caption"/>
+                  <class name="icon-ui-labels-box"/>
                 </style>
+                <child>
+                  <object class="GtkLabel" id="label">
+                    <property name="ellipsize">middle</property>
+                    <property name="justify">center</property>
+                    <property name="lines">3</property>
+                    <property name="wrap">True</property>
+                    <property name="wrap-mode">word-char</property>
+                    <attributes>
+                      <attribute name="insert-hyphens" value="false"></attribute>
+                    </attributes>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel" id="first_caption">
+                    <property name="ellipsize">end</property>
+                    <property name="justify">center</property>
+                    <property name="lines">2</property>
+                    <property name="wrap">True</property>
+                    <property name="wrap-mode">word-char</property>
+                    <property name="valign">start</property>
+                    <style>
+                      <class name="caption"/>
+                    </style>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel" id="second_caption">
+                    <property name="ellipsize">end</property>
+                    <property name="justify">center</property>
+                    <property name="lines">2</property>
+                    <property name="wrap">True</property>
+                    <property name="wrap-mode">word-char</property>
+                    <style>
+                      <class name="caption"/>
+                    </style>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel" id="third_caption">
+                    <property name="ellipsize">end</property>
+                    <property name="justify">center</property>
+                    <property name="lines">2</property>
+                    <property name="wrap">True</property>
+                    <property name="wrap-mode">word-char</property>
+                    <style>
+                      <class name="caption"/>
+                    </style>
+                  </object>
+                </child>
               </object>
             </child>
           </object>
-        </child>
+        </property>
       </object>
     </child>
   </template>