mirror of
https://github.com/sourcegit-scm/sourcegit.git
synced 2024-10-31 13:03:20 -07:00
ux: re-design the image diff view
This commit is contained in:
parent
8b1f28ac95
commit
cf02c890bf
1 changed files with 42 additions and 35 deletions
|
@ -176,52 +176,59 @@
|
|||
|
||||
<!-- Image Diff -->
|
||||
<DataTemplate DataType="m:ImageDiff">
|
||||
<Grid RowDefinitions="Auto,*,Auto" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,8,8,0">
|
||||
<Grid Grid.Row="0" RowDefinitions="24,24" ColumnDefinitions="Auto,Auto,Auto,Auto">
|
||||
<Border Grid.Row="0" Grid.Column="0" Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
|
||||
<Grid RowDefinitions="Auto,*" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,16,8,0">
|
||||
<Grid Grid.Row="0" ColumnDefinitions="Auto,Auto,Auto,Auto,Auto,Auto,Auto,Auto" HorizontalAlignment="Center">
|
||||
<Border Grid.Column="0" Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
|
||||
<TextBlock Classes="monospace" Text="{DynamicResource Text.Diff.Binary.Old}" Margin="8,0" FontSize="10"/>
|
||||
</Border>
|
||||
|
||||
<TextBlock Grid.Row="0" Grid.Column="1" Classes="monospace" Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
|
||||
<TextBlock Grid.Row="0" Grid.Column="2" Classes="monospace" Text="{Binding OldFileSize}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0" HorizontalAlignment="Right"/>
|
||||
<TextBlock Grid.Row="0" Grid.Column="3" Classes="monospace" Text="{DynamicResource Text.Bytes}" Foreground="{DynamicResource Brush.FG2}" Margin="2,0,0,0"/>
|
||||
<TextBlock Grid.Column="1" Classes="monospace" Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
|
||||
<TextBlock Grid.Column="2" Classes="monospace" Text="{Binding OldFileSize}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0" HorizontalAlignment="Right"/>
|
||||
<TextBlock Grid.Column="3" Classes="monospace" Text="{DynamicResource Text.Bytes}" Foreground="{DynamicResource Brush.FG2}" Margin="2,0,0,0"/>
|
||||
|
||||
<Border Grid.Row="1" Grid.Column="0" Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center">
|
||||
<Border Grid.Column="4" Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center" Margin="32,0,0,0">
|
||||
<TextBlock Classes="monospace" Text="{DynamicResource Text.Diff.Binary.New}" Margin="8,0" FontSize="10"/>
|
||||
</Border>
|
||||
|
||||
<TextBlock Grid.Row="1" Grid.Column="1" Classes="monospace" Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
|
||||
<TextBlock Grid.Row="1" Grid.Column="2" Classes="monospace" Text="{Binding NewFileSize}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0" HorizontalAlignment="Right"/>
|
||||
<TextBlock Grid.Row="1" Grid.Column="3" Classes="monospace" Text="{DynamicResource Text.Bytes}" Foreground="{DynamicResource Brush.FG2}" Margin="2,0,0,0"/>
|
||||
<TextBlock Grid.Column="5" Classes="monospace" Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
|
||||
<TextBlock Grid.Column="6" Classes="monospace" Text="{Binding NewFileSize}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0" HorizontalAlignment="Right"/>
|
||||
<TextBlock Grid.Column="7" Classes="monospace" Text="{DynamicResource Text.Bytes}" Foreground="{DynamicResource Brush.FG2}" Margin="2,0,0,0"/>
|
||||
</Grid>
|
||||
|
||||
<Border Grid.Row="1" Background="{DynamicResource Brush.Window}" Effect="drop-shadow(0 0 8 #A0000000)" Margin="0,8,0,0" HorizontalAlignment="Center">
|
||||
<Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}" Margin="8">
|
||||
<v:ImageDiffView Alpha="{Binding #ImageDiffSlider.Value}"
|
||||
OldImage="{Binding Old}"
|
||||
NewImage="{Binding New}"
|
||||
RenderOptions.BitmapInterpolationMode="HighQuality"/>
|
||||
<Grid Grid.Row="1" RowDefinitions="*,Auto,Auto" Margin="0,16,0,0" HorizontalAlignment="Center">
|
||||
<Border Grid.Row="0" Background="{DynamicResource Brush.Window}" Effect="drop-shadow(0 0 8 #A0000000)">
|
||||
<Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}" Margin="8">
|
||||
<v:ImageDiffView Alpha="{Binding #ImageDiffSlider.Value}"
|
||||
OldImage="{Binding Old}"
|
||||
NewImage="{Binding New}"
|
||||
RenderOptions.BitmapInterpolationMode="HighQuality"/>
|
||||
</Border>
|
||||
</Border>
|
||||
</Border>
|
||||
|
||||
<Slider Grid.Row="2"
|
||||
x:Name="ImageDiffSlider"
|
||||
Minimum="0" Maximum="1"
|
||||
VerticalAlignment="Top"
|
||||
TickPlacement="None"
|
||||
Margin="0,4,0,0"
|
||||
MinHeight="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 Grid.Row="1" ColumnDefinitions="*,*" Margin="0,8,0,0">
|
||||
<TextBlock Grid.Column="0" Classes="monospace" Text="{DynamicResource Text.Diff.Binary.Old}" Foreground="{DynamicResource Brush.FG2}" FontSize="10"/>
|
||||
<TextBlock Grid.Column="1" Classes="monospace" Text="{DynamicResource Text.Diff.Binary.New}" Foreground="{DynamicResource Brush.FG2}" HorizontalAlignment="Right" FontSize="10"/>
|
||||
</Grid>
|
||||
|
||||
<Slider Grid.Row="2"
|
||||
x:Name="ImageDiffSlider"
|
||||
Minimum="0" Maximum="1"
|
||||
VerticalAlignment="Top"
|
||||
TickPlacement="None"
|
||||
Margin="8,4,8,0"
|
||||
MinHeight="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>
|
||||
</Grid>
|
||||
</DataTemplate>
|
||||
|
||||
|
|
Loading…
Reference in a new issue