Fix color transitions code. Reworked animation example page a little bit.

samples/RenderTest/Pages/AnimationsPage.xaml

@@ -11,14 +11,21 @@
         <Setter Property="Margin" Value="15"/>
         <Setter Property="Width" Value="100"/>
         <Setter Property="Height" Value="100"/>
+        <Setter Property="Background" Value="Cyan"/>
         <Setter Property="Child" Value="{StaticResource Acorn}"/>
       </Style>
-      <Style Selector="Border.Test">
-        <Setter Property="Margin" Value="15"/>
-        <Setter Property="Width" Value="100"/>
-        <Setter Property="Height" Value="100"/>
+
+      <Style Selector="Border.Rect1">
+        <Setter Property="Transitions">
+          <Transitions>
+            <ColorTransition Property="Background" Duration="0:0:1" />
+          </Transitions>
+        </Setter>
       </Style>
+
       <Style Selector="Border.Rect1:pointerover">
+        <Setter Property="Background" Value="Red"/>
+  
         <Style.Animations>
           <Animation Duration="0:0:2.5" Easing="SineEaseInOut">
             <TransformKeyFrames Property="RotateTransform.Angle">
@@ -71,7 +78,7 @@
             </TransformKeyFrames>
           </Animation>
         </Style.Animations>
-      </Style>
+      </Style> 
     </Styles>
   </UserControl.Styles>
   <Grid>
@@ -83,15 +90,17 @@
         <Button Content="{Binding PlayStateText}" Command="{Binding ToggleGlobalPlayState}"/>
       </StackPanel>
       <WrapPanel ClipToBounds="False">
-        <Border Classes="Test Rect1" Background="DarkRed">
-          <Border.RenderTransform>
-            <TransformGroup>
-              <RotateTransform/>
-              <ScaleTransform/>
-            </TransformGroup>
-          </Border.RenderTransform>
+        <Border Classes="Test Rect1">
+            <Border.RenderTransform>
+             <TransformGroup>
+                         <RotateTransform/>
+
+                         <ScaleTransform/>
+
+             </TransformGroup>
+           </Border.RenderTransform>
         </Border>
-        <Border Classes="Test Rect2" Background="DarkMagenta">
+         <Border Classes="Test Rect2" Background="DarkMagenta">
           <Border.RenderTransform>
             <ScaleTransform/>
           </Border.RenderTransform>
@@ -105,7 +114,7 @@
           <Border.RenderTransform>
             <SkewTransform/>
           </Border.RenderTransform>
-        </Border>
+        </Border> 
 
       </WrapPanel>
     </StackPanel>

src/Avalonia.Animation/ColorInterpolationMode.cs

@@ -8,7 +8,6 @@ namespace Avalonia.Animation
     {
         /// <summary>
         /// Premultiply the alpha component and interpolate from RGB color space.
-        /// Fast but relatively accurate, perception-wise.
         /// </summary>
         PremultipliedRGB,
 

src/Avalonia.Animation/Transitions/Transition.cs

@@ -45,7 +45,7 @@ namespace Avalonia.Animation.Transitions
             }
             set
             {
-                if (!(typeof(T) == value.PropertyType))
+                if (!(value.PropertyType.IsAssignableFrom(typeof(T))))
                     throw new InvalidCastException
                         ($"Invalid property type \"{typeof(T).Name}\" for this {GetType().Name} transition.");
 

src/Avalonia.Visuals/Animation/Transitions/ColorTransition.cs

@@ -36,11 +36,12 @@ namespace Avalonia.Animation.Transitions
         }
 
         private ColorInterpolationMode _interpolationMode;
-  
+
         public override IObservable<SolidColorBrush> DoTransition(IObservable<double> progress, SolidColorBrush oldValue, SolidColorBrush newValue)
         {
-            var oldColor = new Vector4(oldValue.Color.A, oldValue.Color.R, oldValue.Color.G, oldValue.Color.B);
-            var newColor = new Vector4(newValue.Color.A, newValue.Color.R, newValue.Color.G, newValue.Color.B);
+
+            var oldColor = new Vector4(oldValue.Color.R, oldValue.Color.G, oldValue.Color.B, oldValue.Color.A);
+            var newColor = new Vector4(newValue.Color.R, newValue.Color.G, newValue.Color.B, oldValue.Color.A);
             oldColor = oldColor / 255f;
             newColor = newColor / 255f;
             var deltaColor = newColor - oldColor;
@@ -48,10 +49,10 @@ namespace Avalonia.Animation.Transitions
             switch (InterpolationMode)
             {
                 case ColorInterpolationMode.PremultipliedRGB:
-                    
-                    var premultOV = new Vector4(1, oldColor.W, oldColor.W, oldColor.W);
-                    var premultNV = new Vector4(1, newColor.W, newColor.W, newColor.W);
-                    
+
+                    var premultOV = new Vector4(oldColor.W, oldColor.W, oldColor.W, 1);
+                    var premultNV = new Vector4(newColor.W, newColor.W, newColor.W, 1);
+
                     oldColor *= premultOV;
                     newColor *= premultNV;
 
@@ -72,10 +73,11 @@ namespace Avalonia.Animation.Transitions
                         return new SolidColorBrush(Color.FromVector4(interpolatedColor, true));
                     });
                 default:
-                    throw new NotImplementedException($"{Enum.GetName(typeof(ColorInterpolationMode), InterpolationMode)} color interpolation is not supported.");
+                    throw new NotImplementedException($"'{Enum.GetName(typeof(ColorInterpolationMode), InterpolationMode)}' color interpolation is not supported.");
             }
 
+
         }
- 
+
     }
 }