Merge pull request #553 from AndreasReitberger/552-apply-stylecoregri…

…dselectable-to-list-itemtemplates Applied `Style.Core.Grid.Selectable` to list `ItemTemplates`
AndreasReitberger · Sep 11, 2024 · 323003e · 323003e
2 parents 0b747ac + fcff52a
commit 323003e
Show file tree

Hide file tree

Showing 7 changed files with 42 additions and 14 deletions.
diff --git a/src/SharedMauiXamlStylesLibrary.SampleApp/Hosting/AppHostBuilderExtensions.cs b/src/SharedMauiXamlStylesLibrary.SampleApp/Hosting/AppHostBuilderExtensions.cs
@@ -1,4 +1,6 @@
-using Microsoft.Maui.Handlers;
+#if WINDOWS
+using Microsoft.Maui.Handlers;
+#endif
 using SharedMauiXamlStylesLibrary.SampleApp.ViewModels;
 using SharedMauiXamlStylesLibrary.SampleApp.Views;
 
@@ -9,7 +11,6 @@ public static class AppHostBuilderExtensions
         /*
          * The view models do not inherit from an interface, so they only need their concrete type provided to the AddSingleton<T> and AddTransient<T> methods.
          */
-
         public static MauiAppBuilder ConfigureApp(this MauiAppBuilder builder)
         {
             builder

diff --git a/src/SharedMauiXamlStylesLibrary.SampleApp/Views/CollectionViewPage.xaml b/src/SharedMauiXamlStylesLibrary.SampleApp/Views/CollectionViewPage.xaml
@@ -20,7 +20,7 @@
             <CollectionView.ItemTemplate>
                 <DataTemplate>
                     <Grid
-                        Style="{StaticResource Style.Core.Grid.CollectionView}"
+                        Style="{StaticResource Style.Core.Grid.ListItem}"
                         >
                         <Label
                             Text="{Binding .}"

diff --git a/src/SharedMauiXamlStylesLibrary/Resources/Themes/Controls/CollectionView.xaml b/src/SharedMauiXamlStylesLibrary/Resources/Themes/Controls/CollectionView.xaml
@@ -38,6 +38,7 @@
     <Style TargetType="CollectionView" BasedOn="{StaticResource Style.Core.CollectionView.Default}"/>
 
     <!-- Source: https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/collectionview/selection?view=net-maui-8.0&viewFallbackFrom=net-maui-7.0#change-selected-item-color-->
+    <!-- Deprecated, use Style.Core.Grid.ListItem instead -->
     <Style x:Key="Style.Core.Grid.CollectionView" TargetType="Grid">
         <Setter Property="Padding" Value="10,5" />
         <Setter Property="VisualStateManager.VisualStateGroups">

diff --git a/src/SharedMauiXamlStylesLibrary/Resources/Themes/Controls/Grid.xaml b/src/SharedMauiXamlStylesLibrary/Resources/Themes/Controls/Grid.xaml
@@ -84,4 +84,26 @@
         <Setter Property="Margin" Value="0" />
         <Setter Property="Padding" Value="0" />
     </Style>
+
+    <Style x:Key="Style.Core.Grid.ListItem" TargetType="Grid">
+        <Setter Property="Padding" Value="10,5" />
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup x:Name="CommonStates">
+                    <VisualState x:Name="Normal" />
+                    <VisualState x:Name="Selected">
+                        <VisualState.Setters>
+                            <Setter Property="Background" Value="{AppThemeBinding Light={StaticResource Gray100}, Dark={StaticResource Gray900}}" />
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="Disabled">
+                        <VisualState.Setters>
+                            <Setter Property="Background" Value="{AppThemeBinding Light={StaticResource Gray700}, Dark={StaticResource Gray300}}" />
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="PointerOver" />
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
 </ResourceDictionary>
diff --git a/src/SharedMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/GeneralItemTemplates.xaml b/src/SharedMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/GeneralItemTemplates.xaml
@@ -20,6 +20,7 @@
 
     <DataTemplate x:Key="DataTemplate.Core.TutorialStep.Default" x:DataType="documentation:TutorialStep">
         <Grid 
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="8,6"
             ColumnSpacing="4"
             RowSpacing="4"
@@ -47,7 +48,6 @@
                 SemanticProperties.HeadingLevel="Level1"
                 SemanticProperties.Description="{Binding Heading}"
                 />
-
             <Label
                 Grid.Row="2"
                 Style="{StaticResource Style.Core.Label.Default}"

diff --git a/...redMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/ListViewGroupHeaderTemplates.xaml b/...redMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/ListViewGroupHeaderTemplates.xaml
@@ -32,7 +32,6 @@
                     </Style>
                 </Label.Style>
             </Label>
-
             <Label 
                 Text="{Binding Key}" 
                 Style="{StaticResource Style.Core.Label.GroupingHeader}"

diff --git a/src/SharedMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/ListViewItemTemplates.xaml b/src/SharedMauiXamlStylesLibrary/Resources/Themes/ItemTemplates/ListViewItemTemplates.xaml
@@ -15,7 +15,8 @@
     <converters:UriToStringConverter x:Key="UriToStringConverter" />
 
     <DataTemplate x:Key="DataTemplate.Core.ProVersionFeature.Default" x:DataType="documentation:ProVersionFeature">
-        <Grid 
+        <Grid
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="8,6"
             ColumnSpacing="4"
             RowSpacing="4"
@@ -33,7 +34,6 @@
                     TextColor="{StaticResource White}"
                     />
             </Border>
-
             <Label 
                 Grid.Column="1"
                 Text="{Binding Feature}"
@@ -46,7 +46,7 @@
 
     <DataTemplate x:Key="DataTemplate.Core.AppEvent.Default" x:DataType="eventLogger:AppEvent">
         <Grid 
-            x:Name="Grid"
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="16,12"
             ColumnSpacing="16"
             RowSpacing="2"
@@ -123,7 +123,8 @@
 
     <!-- Localization -->
     <DataTemplate x:Key="DataTemplate.Core.LocalizationInfo.Default" x:DataType="language:LocalizationInfo">
-        <Grid 
+        <Grid
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="2" 
             Margin="1" 
             ColumnDefinitions="48,*"
@@ -160,6 +161,7 @@
 
     <DataTemplate x:Key="DataTemplate.Core.LocalizationInfo.Selected" x:DataType="language:LocalizationInfo">
         <Grid 
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="2"
             Margin="1"
             Background="{DynamicResource PrimaryColor}"
@@ -200,7 +202,7 @@
     <!-- Documentation -->
     <DataTemplate x:Key="DataTemplate.Core.ChangelogInfo.Default" x:DataType="documentation:ChangelogInfo">
         <Grid
-            x:Name="Grid"
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="16,12"
             ColumnSpacing="16"
             RowSpacing="2"
@@ -230,7 +232,7 @@
 
     <DataTemplate x:Key="DataTemplate.Core.ChangeInfo.Default" x:DataType="documentation:ChangeInfo">
         <Grid
-            x:Name="Grid"
+            Style="{StaticResource Style.Core.Grid.ListItem}"
             Padding="16,12"
             ColumnSpacing="16"
             RowSpacing="2"
@@ -260,7 +262,9 @@
 
     <!-- Theme -->
     <DataTemplate x:Key="DataTemplate.Core.ThemeColorInfo.Default" x:DataType="theme:ThemeColorInfo">
-        <Grid>
+        <Grid
+            Style="{StaticResource Style.Core.Grid.ListItem}"
+            >
             <Border
                 StrokeShape="RoundRectangle 10"
                 StrokeThickness="0"
@@ -327,7 +331,9 @@
     </DataTemplate>
 
     <DataTemplate x:Key="DataTemplate.Core.ColorInfo.Default" x:DataType="theme:ColorInfo">
-        <Grid>
+        <Grid
+            Style="{StaticResource Style.Core.Grid.ListItem}"
+            >
             <Border
                 StrokeShape="RoundRectangle 5"
                 StrokeThickness="0"
@@ -352,7 +358,6 @@
                         Margin="10,20"
                         Text="{Binding Name}"
                         />
-
                     <VerticalStackLayout
                         Grid.Column="1"
                         >