Fixed column resizing when the number of items are less than the number of columns

Author: Morten Nielsen

Microsoft.Toolkit.Uwp.UI.Controls/AdaptiveGridView/AdaptiveGridView.Properties.cs

@@ -62,10 +62,10 @@ public sealed partial class AdaptiveGridView
             DependencyProperty.Register(nameof(OneRowModeEnabled), typeof(bool), typeof(AdaptiveGridView), new PropertyMetadata(false, (o, e) => { OnOneRowModeEnabledChanged(o, e.NewValue); }));
 
         /// <summary>
-        /// Identifies the <see cref="VerticalScroll"/> dependency property.
+        /// Identifies the <see cref="VerticalScrollMode"/> dependency property.
         /// </summary>
-        private static readonly DependencyProperty VerticalScrollProperty =
-            DependencyProperty.Register(nameof(VerticalScroll), typeof(ScrollMode), typeof(AdaptiveGridView), new PropertyMetadata(ScrollMode.Auto));
+        private static readonly DependencyProperty VerticalScrollModeProperty =
+            DependencyProperty.Register(nameof(VerticalScrollMode), typeof(ScrollMode), typeof(AdaptiveGridView), new PropertyMetadata(ScrollMode.Auto));
 
         /// <summary>
         /// Identifies the <see cref="ItemWidth"/> dependency property.
@@ -94,7 +94,7 @@ private static void OnOneRowModeEnabledChanged(DependencyObject d, object newVal
                     };
 
                     self._listView.SetBinding(GridView.MaxHeightProperty, b);
-                    self.VerticalScroll = ScrollMode.Disabled;
+                    self.VerticalScrollMode = ScrollMode.Disabled;
                 }
             }
         }
@@ -173,10 +173,10 @@ public bool OneRowModeEnabled
         /// </summary>
         public event ItemClickEventHandler ItemClick;
 
-        private ScrollMode VerticalScroll
+        private ScrollMode VerticalScrollMode
         {
-            get { return (ScrollMode)GetValue(VerticalScrollProperty); }
-            set { SetValue(VerticalScrollProperty, value); }
+            get { return (ScrollMode)GetValue(VerticalScrollModeProperty); }
+            set { SetValue(VerticalScrollModeProperty, value); }
         }
 
         private double ItemWidth

Microsoft.Toolkit.Uwp.UI.Controls/AdaptiveGridView/AdaptiveGridView.cs

@@ -9,6 +9,7 @@
 // TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH
 // THE CODE OR THE USE OR OTHER DEALINGS IN THE CODE.
 // ******************************************************************
+using System.Collections.Generic;
 using Windows.UI.Xaml;
 using Windows.UI.Xaml.Controls;
 
@@ -60,7 +61,42 @@ private void RecalculateLayout(double containerWidth)
                 }
             }
 
-            ItemWidth = (containerWidth / _columns) - 5;
+            // Determine the amount of items
+            // If there's less items than there's columns,
+            // fix the ItemWidth to DesiredWidth;
+            int count = 0;
+            if (_listView != null)
+            {
+                count = _listView.Items.Count;
+            }
+            else if (ItemsSource is System.Collections.ICollection)
+            {
+                count = (ItemsSource as System.Collections.ICollection).Count;
+            }
+            else if (ItemsSource is System.Array)
+            {
+                count = (ItemsSource as System.Array).Length;
+            }
+            else if (ItemsSource is System.Collections.IEnumerable)
+            {
+                var enumerable = ((System.Collections.IEnumerable)ItemsSource).GetEnumerator();
+                while (count < _columns && enumerable.MoveNext())
+                {
+                    // All we need to know is if there's less than columns, so we'll stop when reaching _columns
+                    count++;
+                }
+            }
+
+            if (count < _columns && count != 0)
+            {
+                // If there aren't enough items to fill the column, set the fixed size
+                // as the largest an item would be before introducing one less column
+                ItemWidth = (DesiredWidth / count * (count + 1)) - 5;
+            }
+            else
+            {
+                ItemWidth = (containerWidth / _columns) - 5;
+            }
         }
 
         /// <summary>

Microsoft.Toolkit.Uwp.UI.Controls/AdaptiveGridView/AdaptiveGridView.xaml

@@ -8,8 +8,8 @@
 				<ControlTemplate TargetType="controls:AdaptiveGridView">
                     <Grid>
 						<ContentPresenter x:Name="templateProxy" Width="{TemplateBinding ItemWidth}" Height="{TemplateBinding ItemHeight}" ContentTemplate="{TemplateBinding ItemTemplate}" Visibility="Collapsed" />
-						<GridView x:Name="ListView" IsItemClickEnabled="True" SelectionMode="None" IsSwipeEnabled="False" IsTabStop="False"
-                          ScrollViewer.VerticalScrollMode="{TemplateBinding VerticalScroll}" ScrollViewer.VerticalScrollBarVisibility="Hidden"
+						<GridView HorizontalAlignment="Stretch" x:Name="ListView" IsItemClickEnabled="True" SelectionMode="None" IsSwipeEnabled="False" IsTabStop="False"
+                          ScrollViewer.VerticalScrollMode="{TemplateBinding VerticalScrollMode}" ScrollViewer.VerticalScrollBarVisibility="Hidden"
                           ItemsSource="{TemplateBinding ItemsSource}">
                             <GridView.ItemTemplate>
                                 <DataTemplate>