feature: supports preview and diff with image files

src/SourceGit/Views/DiffView.axaml

@@ -109,6 +109,36 @@
             </StackPanel>
           </DataTemplate>
 
+          <!-- Image Diff -->
+          <DataTemplate DataType="m:ImageDiff">
+            <Grid Margin="8,8,8,8" RowDefinitions="*,Auto" HorizontalAlignment="Center">
+              <Border Grid.Row="0" BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}">
+                <v:ImageDiffView Alpha="{Binding #ImageDiffSlider.Value}" 
+                                 OldImage="{Binding Old}" 
+                                 NewImage="{Binding New}"/>
+              </Border>
+
+              <Slider Grid.Row="1" 
+                      x:Name="ImageDiffSlider" 
+                      Minimum="0" Maximum="1"
+                      VerticalAlignment="Top"
+                      TickPlacement="BottomRight"
+                      TickFrequency="0.1"
+                      Margin="0,8,0,0"
+                      Foreground="{DynamicResource Brush.Border1}"
+                      Value="0.5">
+                <Slider.Resources>
+                  <Thickness x:Key="SliderTopHeaderMargin">0,0,0,4</Thickness>
+                  <GridLength x:Key="SliderPreContentMargin">0</GridLength>
+                  <GridLength x:Key="SliderPostContentMargin">0</GridLength>
+                  <CornerRadius x:Key="SliderThumbCornerRadius">8</CornerRadius>
+                  <x:Double x:Key="SliderHorizontalThumbWidth">16</x:Double>
+                  <x:Double x:Key="SliderHorizontalThumbHeight">16</x:Double>
+                </Slider.Resources>
+              </Slider>
+            </Grid>
+          </DataTemplate>
+
           <!-- Text Diff -->
           <DataTemplate DataType="m:TextDiff">
             <v:TextDiffView TextDiff="{Binding}" UseSideBySideDiff="{Binding Source={x:Static vm:Preference.Instance}, Path=UseSideBySideDiff, Mode=OneWay}"/>

src/SourceGit/Views/DiffView.axaml.cs

@@ -1,7 +1,111 @@
+using System;
+
+using Avalonia;
 using Avalonia.Controls;
+using Avalonia.Media;
+using Avalonia.Media.Imaging;
 
 namespace SourceGit.Views
 {
+    public class ImageDiffView : Control
+    {
+        public static readonly StyledProperty<double> AlphaProperty =
+            AvaloniaProperty.Register<ImageDiffView, double>(nameof(Alpha), 0.5);
+
+        public double Alpha
+        {
+            get => GetValue(AlphaProperty);
+            set => SetValue(AlphaProperty, value);
+        }
+
+        public static readonly StyledProperty<Bitmap> OldImageProperty =
+            AvaloniaProperty.Register<ImageDiffView, Bitmap>(nameof(OldImage), null);
+
+        public Bitmap OldImage
+        {
+            get => GetValue(OldImageProperty);
+            set => SetValue(OldImageProperty, value);
+        }
+
+        public static readonly StyledProperty<Bitmap> NewImageProperty =
+            AvaloniaProperty.Register<ImageDiffView, Bitmap>(nameof(NewImage), null);
+
+        public Bitmap NewImage
+        {
+            get => GetValue(NewImageProperty);
+            set => SetValue(NewImageProperty, value);
+        }
+
+        static ImageDiffView()
+        {
+            AffectsMeasure<ImageDiffView>(OldImageProperty, NewImageProperty);
+            AffectsRender<ImageDiffView>(AlphaProperty);
+        }
+
+        public override void Render(DrawingContext context)
+        {
+            var alpha = Alpha;
+            var x = Bounds.Width * Alpha;
+
+            var left = OldImage;
+            if (left != null && alpha > 0)
+            {
+                var src = new Rect(0, 0, left.Size.Width * Alpha, left.Size.Height);
+                var dst = new Rect(0, 0, x, Bounds.Height);
+                context.DrawImage(left, src, dst);
+            }
+
+            var right = NewImage;
+            if (right != null)
+            {
+                var src = new Rect(right.Size.Width * Alpha, 0, right.Size.Width - right.Size.Width * Alpha, right.Size.Height);
+                var dst = new Rect(x, 0, Bounds.Width - x, Bounds.Height);
+                context.DrawImage(right, src, dst);
+            }
+            
+            context.DrawLine(new Pen(Brushes.DarkGreen, 2), new Point(x, 0), new Point(x, Bounds.Height));
+        }
+
+        protected override Size MeasureOverride(Size availableSize)
+        {
+            var left = OldImage;
+            var right = NewImage;
+
+            if (left != null)
+            {
+                return GetDesiredSize(left.Size, availableSize);
+            } 
+            else if (right != null)
+            {
+                return GetDesiredSize(right.Size, availableSize);
+            }
+            else
+            {
+                return availableSize;
+            }
+        }
+
+        private Size GetDesiredSize(Size img, Size available)
+        {
+            if (img.Width <= available.Width)
+            {
+                if (img.Height <= available.Height)
+                {
+                    return img;
+                }
+                else
+                {
+                    return new Size(available.Height * img.Width / img.Height, available.Height);
+                }
+            }
+            else
+            {
+                var s = Math.Max(img.Width / available.Width, img.Height / available.Height);
+                return new Size(img.Width / s, img.Height / s);
+            }
+        }
+    }
+
     public partial class DiffView : UserControl
     {
         public DiffView()

src/SourceGit/Views/NameHighlightedTextBlock.cs

@@ -9,7 +9,6 @@ namespace SourceGit.Views
 {
     public class NameHighlightedTextBlock : Control
     {
-
         public static readonly StyledProperty<string> TextProperty =
             AvaloniaProperty.Register<NameHighlightedTextBlock, string>(nameof(Text));
 

src/SourceGit/Views/RevisionFiles.axaml

@@ -91,6 +91,10 @@
               <v:RevisionTextFileView FontFamily="{Binding Source={x:Static vm:Preference.Instance}, Path=MonospaceFont}" Background="{DynamicResource Brush.Contents}"/>
             </DataTemplate>
 
+            <DataTemplate DataType="m:RevisionImageFile">
+              <Image Source="{Binding Image}" Margin="8"/>
+            </DataTemplate>
+
             <DataTemplate DataType="m:RevisionLFSObject">
               <StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Center">
                 <TextBlock Text="{DynamicResource Text.CommitDetail.Files.LFS}" FontSize="18" FontWeight="Bold" HorizontalAlignment="Center" Foreground="{DynamicResource Brush.FG2}"/>