Migrate all the bindings in Material.Styles to CompiledBindings #232

Directory.Build.props

@@ -30,5 +30,8 @@
       <SubType>Designer</SubType>
     </AvaloniaResource>
   </ItemGroup>
-
+
+  <PropertyGroup>
+    <AvaloniaUseCompiledBindingsByDefault>true</AvaloniaUseCompiledBindingsByDefault>
+  </PropertyGroup>
 </Project>

Material.Avalonia.DataGrid/DataGrid.xaml

@@ -1,5 +1,6 @@
 <Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:collections="clr-namespace:Avalonia.Collections;assembly=Avalonia.Controls.DataGrid">
   <!--TODO: Validation and Focus-->
 
   <Styles.Resources>
@@ -108,7 +109,7 @@
   </Style>
 
   <Style Selector="DataGridRow">
-    <Setter Property="Background" Value="{Binding $parent[DataGrid].RowBackground}" />
+    <Setter Property="Background" Value="{CompiledBinding $parent[DataGrid].RowBackground}" />
     <Setter Property="Template">
       <ControlTemplate>
         <Border x:Name="RowBorder"
@@ -179,7 +180,7 @@
 
           <StackPanel Grid.Column="3" Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center" Margin="0,1,0,1">
             <TextBlock Name="PART_PropertyNameElement" Margin="4,0,0,0" IsVisible="{TemplateBinding IsPropertyNameVisible}" />
-            <TextBlock Margin="4,0,0,0" Text="{Binding Key}" />
+            <TextBlock Margin="4,0,0,0" Text="{CompiledBinding Key, DataType=collections:DataGridCollectionViewGroup}" />
             <TextBlock Name="PART_ItemCountElement" Margin="4,0,0,0" IsVisible="{TemplateBinding IsItemCountVisible}" />
           </StackPanel>
 

Material.Demo/Material.Demo.csproj

@@ -6,6 +6,8 @@
     <GeneratePackageOnBuild>false</GeneratePackageOnBuild>
     <AvaloniaVersion>11.1.999-cibuild0043160-beta</AvaloniaVersion>
     <IsPackable>false</IsPackable>
+
+    <AvaloniaUseCompiledBindingsByDefault>false</AvaloniaUseCompiledBindingsByDefault>
   </PropertyGroup>
 
   <ItemGroup>

Material.Styles/Controls/CircleClockPicker.axaml

@@ -9,7 +9,7 @@
       <ControlTemplate>
         <Panel Name="PART_RootPanel">
           <Ellipse Name="PART_CircleBackground"
-                   Width="{Binding $self.Bounds.Height}" />
+                   Width="{CompiledBinding $self.Bounds.Height}" />
 
           <Ellipse Name="PART_PointerCenter" />
 

Material.Styles/Controls/CircleClockPickerCell.axaml

@@ -13,7 +13,7 @@
       <ControlTemplate>
         <Panel Name="PART_RootPanel">
           <Ellipse Name="PART_HoverEffect"
-                   Width="{Binding $self.Bounds.Height}" />
+                   Width="{CompiledBinding $self.Bounds.Height}" />
           <ContentPresenter Name="PART_ContentPresenter"
                             Content="{TemplateBinding Content}"
                             ContentTemplate="{TemplateBinding ContentTemplate}"

Material.Styles/Controls/Clock.axaml

@@ -10,15 +10,15 @@
       </Border>
       <Border BorderThickness="1" BorderBrush="Black" HorizontalAlignment="Center">
         <controls:Clock CanSelectSeconds="False" TimeFormat="TwelveHour"
-                        SelectedTime="{Binding #MainClock.SelectedTime}" />
+                        SelectedTime="{CompiledBinding #MainClock.SelectedTime}" />
       </Border>
       <Border BorderThickness="1" BorderBrush="Black" HorizontalAlignment="Center">
         <controls:Clock CanSelectSeconds="True" TimeFormat="TwentyFourHour"
-                        SelectedTime="{Binding #MainClock.SelectedTime}" />
+                        SelectedTime="{CompiledBinding #MainClock.SelectedTime}" />
       </Border>
       <Border BorderThickness="1" BorderBrush="Black" HorizontalAlignment="Center">
         <controls:Clock CanSelectSeconds="False" TimeFormat="TwentyFourHour"
-                        SelectedTime="{Binding #MainClock.SelectedTime}" />
+                        SelectedTime="{CompiledBinding #MainClock.SelectedTime}" />
       </Border>
     </UniformGrid>
   </Design.PreviewWith>
@@ -34,7 +34,7 @@
     <Setter Property="TextBlock.FontWeight" Value="Medium" />
 
     <Style Selector="^:not(:checked)">
-      <Setter Property="Foreground" Value="{Binding Foreground, 
+      <Setter Property="Foreground" Value="{CompiledBinding Foreground, 
       RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:Clock}}" />
     </Style>
   </ControlTheme>
@@ -95,13 +95,13 @@
                              Grid.Row="0"
                              Theme="{StaticResource MaterialCircleClockTimeFormatRadioButton}"
                              Content="AM"
-                             IsChecked="{Binding !!(controls:ClockInternals.IsAm), Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
+                             IsChecked="{CompiledBinding !!(controls:ClockInternals.IsAm), Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                 <Rectangle Grid.Row="1" Fill="{DynamicResource MaterialTextBoxBorderBrush}" />
                 <RadioButton x:Name="PART_PmSelector"
                              Grid.Row="2"
                              Theme="{StaticResource MaterialCircleClockTimeFormatRadioButton}"
                              Content="PM"
-                             IsChecked="{Binding !(controls:ClockInternals.IsAm), Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
+                             IsChecked="{CompiledBinding !(controls:ClockInternals.IsAm), Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
               </Grid>
             </Border>
           </Grid>

Material.Styles/Controls/FloatingButton.axaml

@@ -25,7 +25,7 @@
     <Setter Property="Padding" Value="16" />
     <Setter Property="assists:ShadowAssist.ShadowDepth" Value="Depth1" />
     <Setter Property="assists:ButtonAssist.HoverColor"
-            Value="{Binding Foreground, Converter={StaticResource BrushRoundConverter}, RelativeSource={RelativeSource Self}}" />
+            Value="{CompiledBinding Foreground, Converter={StaticResource BrushRoundConverter}, RelativeSource={RelativeSource Self}}" />
     <Setter Property="assists:ButtonAssist.ClickFeedbackColor" Value="#000000" />
     <Setter Property="TextBlock.FontWeight" Value="Medium" />
     <Setter Property="TextBlock.FontSize" Value="14" />
@@ -171,8 +171,8 @@
   </Style>
   
   <Style Selector="cc|FloatingButton[IsExtended=true] /template/ Grid#TemplateRoot">
-    <Setter Property="Width" Value="{Binding #ContentBorder.Bounds.Width}" /> 
-    <Setter Property="Height" Value="{Binding #ContentBorder.Bounds.Height}" /> 
+    <Setter Property="Width" Value="{CompiledBinding #ContentBorder.Bounds.Width}" /> 
+    <Setter Property="Height" Value="{CompiledBinding #ContentBorder.Bounds.Height}" /> 
   </Style-->
 
 

Material.Styles/Controls/MaterialInternalIcon.axaml

@@ -13,7 +13,7 @@
                   BorderThickness="{TemplateBinding BorderThickness}">
             <Viewbox>
               <Canvas Width="24" Height="24">
-                <Path Data="{Binding Data, RelativeSource={RelativeSource TemplatedParent}}"
+                <Path Data="{CompiledBinding $parent[controls:MaterialInternalIcon].Data}"
                       Fill="{TemplateBinding Foreground}" />
               </Canvas>
             </Viewbox>

Material.Styles/Controls/MaterialInternalIcon.axaml.cs

@@ -28,7 +28,7 @@ public string? Kind {
         /// <summary>
         /// Gets the icon path data for the current <see cref="Kind"/>.
         /// </summary>
-        public Geometry? Data {
+        public Geometry Data {
             get {
                 _data = _data switch {
                     null => Geometry.Parse(IconsDataSet.UnknownIconData),

Material.Styles/Controls/MaterialUnderline.axaml

@@ -49,7 +49,7 @@
 
 
     <Style Selector="^[IsActive=True] /template/ Rectangle#PART_ActiveIndicator">
-      <Setter Property="Width" Value="{Binding $parent[Control].Bounds.Width}" />
+      <Setter Property="Width" Value="{CompiledBinding $parent[Control].Bounds.Width}" />
     </Style>
 
     <Style Selector="^[IsHovered=True] /template/ Rectangle#PART_BaseBorder">

Material.Styles/Controls/NavigationDrawer.axaml

@@ -38,7 +38,7 @@
               <Border.Styles>
                 <Style Selector="controls|NavigationDrawer /template/ Border#PART_LeftDrawerBorder">
                   <Setter Property="Margin"
-                          Value="{Binding $self.Width, 
+                          Value="{CompiledBinding $self.Width, 
                                         Converter={StaticResource MarginCreator}, 
                                         ConverterParameter={StaticResource LeftMarginCreatorParam}}" />
                 </Style>
@@ -56,7 +56,7 @@
               <Border.Styles>
                 <Style Selector="controls|NavigationDrawer /template/ Border#PART_RightDrawerBorder">
                   <Setter Property="Margin"
-                          Value="{Binding $self.Width, 
+                          Value="{CompiledBinding $self.Width, 
                                         Converter={StaticResource MarginCreator}, 
                                         ConverterParameter={StaticResource RightMarginCreatorParam}}" />
                 </Style>

Material.Styles/Controls/Scroller.axaml

@@ -19,17 +19,17 @@
                                   Padding="{TemplateBinding Padding}">
             <ScrollContentPresenter.GestureRecognizers>
               <ScrollGestureRecognizer
-                CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
-                CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}" />
+                CanHorizontallyScroll="{CompiledBinding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                CanVerticallyScroll="{CompiledBinding CanVerticallyScroll, ElementName=PART_ContentPresenter}" />
             </ScrollContentPresenter.GestureRecognizers>
           </ScrollContentPresenter>
 
           <Button Name="PART_PageUpButton" Grid.Column="0"
                   IsVisible="{TemplateBinding controls:Scroller.CanScrollToStart}"
-                  Command="{Binding $parent[controls:Scroller].ScrollPageBackOnce}" />
+                  Command="{CompiledBinding $parent[controls:Scroller].ScrollPageBackOnce}" />
           <Button Name="PART_PageDownButton" Grid.Column="2"
                   IsVisible="{TemplateBinding controls:Scroller.CanScrollToEnd}"
-                  Command="{Binding $parent[controls:Scroller].ScrollPageForwardOnce}" />
+                  Command="{CompiledBinding $parent[controls:Scroller].ScrollPageForwardOnce}" />
         </Grid>
       </ControlTemplate>
     </Setter>

Material.Styles/Controls/SideSheet.axaml

@@ -2,7 +2,8 @@
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:parameters="clr-namespace:Material.Styles.Converters.Parameters"
                     xmlns:converters="clr-namespace:Material.Styles.Converters"
-                    xmlns:controls="clr-namespace:Material.Styles.Controls">
+                    xmlns:controls="clr-namespace:Material.Styles.Controls"
+                    xmlns:system="clr-namespace:System;assembly=netstandard">
   <Design.PreviewWith>
     <Border Margin="40" BorderThickness="1" BorderBrush="Black">
       <StackPanel Orientation="Horizontal">
@@ -11,7 +12,7 @@
 
             <controls:SideSheet Width="400" Height="200"
                                 SideSheetDirection="Left"
-                                SideSheetOpened="{Binding ElementName=LeftToggler, Path=IsChecked, Mode=TwoWay}"
+                                SideSheetOpened="{CompiledBinding ElementName=LeftToggler, Path=IsChecked, Mode=TwoWay}"
                                 SideSheetHeader="Left side sheet"
                                 Padding="8">
               <controls:SideSheet.SideSheetContent>
@@ -29,7 +30,7 @@
         <Border>
           <StackPanel>
             <controls:SideSheet Width="400" Height="200"
-                                SideSheetOpened="{Binding ElementName=toggler, Path=IsChecked, Mode=TwoWay}"
+                                SideSheetOpened="{CompiledBinding ElementName=toggler, Path=IsChecked, Mode=TwoWay}"
                                 SideSheetHeader="Right side sheet"
                                 Padding="8">
               <controls:SideSheet.SideSheetContent>
@@ -62,7 +63,7 @@
     <Setter Property="Background" Value="{DynamicResource MaterialPaperBrush}" />
     <Setter Property="SideSheetHeaderTemplate">
       <DataTemplate>
-        <TextBlock Classes="Headline6" Text="{Binding}" />
+        <TextBlock Classes="Headline6" Text="{CompiledBinding ., DataType={x:Type system:Object}}" />
       </DataTemplate>
     </Setter>
     <Setter Property="Template">
@@ -130,7 +131,7 @@
 
     <Style Selector="^:left:closed /template/ Border#PART_SideSheet">
       <Setter Property="Margin"
-              Value="{Binding $self.Width, 
+              Value="{CompiledBinding $self.Width, 
                 Converter={StaticResource MarginCreator}, 
                 ConverterParameter={StaticResource LeftMarginCreatorParam}}" />
     </Style>
@@ -141,7 +142,7 @@
 
     <Style Selector="^:right:closed /template/ Border#PART_SideSheet">
       <Setter Property="Margin"
-              Value="{Binding $self.Width, 
+              Value="{CompiledBinding $self.Width, 
                 Converter={StaticResource MarginCreator}, 
                 ConverterParameter={StaticResource RightMarginCreatorParam}}" />
     </Style>

Material.Styles/Controls/SnackbarHost.axaml

@@ -46,8 +46,8 @@
 
                     <Button Grid.Column="3" Grid.Row="1"
                             Theme="{StaticResource MaterialFlatButton}"
-                            Content="{Binding Button}"
-                            Command="{Binding Command}"
+                            Content="{CompiledBinding Button}"
+                            Command="{CompiledBinding Command}"
                             IsVisible="{CompiledBinding !!Command}" />
                   </Grid>
                 </controls:Card>

Material.Styles/Resources/Themes/AutoCompleteBox.axaml

@@ -17,7 +17,7 @@
                    DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" />
 
           <Popup Name="PART_Popup"
-                 MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                 MinWidth="{CompiledBinding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                  MaxHeight="{TemplateBinding MaxDropDownHeight}"
                  PlacementTarget="{TemplateBinding}"
                  IsLightDismissEnabled="True">

Material.Styles/Resources/Themes/Button.axaml

@@ -20,7 +20,7 @@
     <Setter Property="Padding" Value="16 8" />
     <Setter Property="assists:ShadowAssist.ShadowDepth" Value="Depth1" />
     <Setter Property="assists:ButtonAssist.HoverColor"
-            Value="{Binding Foreground,
+            Value="{CompiledBinding Foreground,
                               Converter={StaticResource BrushRoundConverter}, RelativeSource={RelativeSource Self}}" />
     <Setter Property="assists:ButtonAssist.ClickFeedbackColor" Value="#000000" />
     <Setter Property="TextBlock.FontWeight" Value="Medium" />
@@ -180,7 +180,7 @@
     <Setter Property="Padding" Value="16 6" />
     <Setter Property="assists:ShadowAssist.ShadowDepth" Value="Depth0" />
     <Setter Property="assists:ButtonAssist.HoverColor" Value="{DynamicResource MaterialBodyBrush}" />
-    <Setter Property="assists:ButtonAssist.ClickFeedbackColor" Value="{Binding $self.Foreground}" />
+    <Setter Property="assists:ButtonAssist.ClickFeedbackColor" Value="{CompiledBinding $self.Foreground}" />
 
     <!-- Colour variants -->
 

Material.Styles/Resources/Themes/ButtonSpinner.axaml

@@ -11,7 +11,7 @@
     <Style Selector="^ /template/ RepeatButton#PART_IncreaseButton">
       <Setter Property="Content">
         <Template>
-          <Path Fill="{Binding $parent[ButtonSpinner].Foreground}"
+          <Path Fill="{CompiledBinding $parent[ButtonSpinner].Foreground}"
                 Width="8"
                 Height="4"
                 Stretch="Uniform"
@@ -24,7 +24,7 @@
     <Style Selector="^ /template/ RepeatButton#PART_DecreaseButton">
       <Setter Property="Content">
         <Template>
-          <Path Fill="{Binding $parent[ButtonSpinner].Foreground}"
+          <Path Fill="{CompiledBinding $parent[ButtonSpinner].Foreground}"
                 Width="8"
                 Height="4"
                 Stretch="Uniform"

Material.Styles/Resources/Themes/CalendarItem.axaml

@@ -1,12 +1,13 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:controls="clr-namespace:Material.Styles.Controls">
+                    xmlns:controls="clr-namespace:Material.Styles.Controls"
+                    xmlns:system="clr-namespace:System;assembly=netstandard">
   <ControlTheme x:Key="MaterialCalendarItem" TargetType="CalendarItem">
     <Setter Property="HorizontalAlignment" Value="Stretch" />
     <Setter Property="VerticalAlignment" Value="Stretch" />
     <Setter Property="DayTitleTemplate">
       <Template>
-        <TextBlock Text="{Binding}"
+        <TextBlock Text="{CompiledBinding ., DataType={x:Type system:Object}}"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    TextAlignment="Center"

Material.Styles/Resources/Themes/CheckBox.axaml

@@ -74,15 +74,15 @@
     <Style Selector="^:indeterminate /template/ Path#Graphic">
       <Setter Property="Data"
               Value="M6,13L6,11L18,11L18,13M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" />
-      <Setter Property="Fill" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(assists:SelectionControlAssist.InnerForeground)}" />
+      <Setter Property="Fill" Value="{CompiledBinding RelativeSource={RelativeSource TemplatedParent}, Path=(assists:SelectionControlAssist.InnerForeground)}" />
     </Style>
 
     <!-- Checked state -->
 
     <Style Selector="^:checked /template/ Path#Graphic">
       <Setter Property="Data"
               Value="M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" />
-      <Setter Property="Fill" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(assists:SelectionControlAssist.InnerForeground)}" />
+      <Setter Property="Fill" Value="{CompiledBinding RelativeSource={RelativeSource TemplatedParent}, Path=(assists:SelectionControlAssist.InnerForeground)}" />
     </Style>
 
     <!-- Accent variant -->