高保真-合并

PDF Office/ViewModels/Dialog/ToolsDialogs/MergeDialogViewModel.cs

@@ -244,31 +244,32 @@ namespace PDF_Office.ViewModels.Dialog.ToolsDialogs
                 case PageSizeType.kDefault:
                     break;
                 case PageSizeType.A4:
-                    rect.Width = 210;
-                    rect.Height = 297;
+
+                    rect.Width = CommonHelper.GetPageSizeFomrUnit(210);
+                    rect.Height = CommonHelper.GetPageSizeFomrUnit(297);
                     break;
                 case PageSizeType.A3:
-                    rect.Width = 297;
-                    rect.Height = 420;
+                    rect.Width = CommonHelper.GetPageSizeFomrUnit(297);
+                    rect.Height = CommonHelper.GetPageSizeFomrUnit(420);
                     break;
                 case PageSizeType.Letter:
-                    rect.Width = 216;
-                    rect.Height = 279;
+                    rect.Width = CommonHelper.GetPageSizeFomrUnit(216);
+                    rect.Height = CommonHelper.GetPageSizeFomrUnit(279);
                     break;
                 case PageSizeType.Legal:
-                    rect.Width = 216;
-                    rect.Height = 356;
+                    rect.Width = CommonHelper.GetPageSizeFomrUnit(216);
+                    rect.Height = CommonHelper.GetPageSizeFomrUnit(356);
                     break;
                 case PageSizeType.Customized:
                     if (!string.IsNullOrEmpty(InputWidth) && !string.IsNullOrEmpty(InputHeight))
                     {
-                        rect.Width = Convert.ToInt32(InputWidth);
-                        rect.Height = Convert.ToInt32(InputHeight);
+                        rect.Width = CommonHelper.GetPageSizeFomrUnit(Convert.ToInt32(InputWidth));
+                        rect.Height = CommonHelper.GetPageSizeFomrUnit(Convert.ToInt32(InputHeight));
                     }
                     else
                     {
-                        rect.Width = 595;
-                        rect.Height = 841;
+                        rect.Width = CommonHelper.GetPageSizeFomrUnit(595);
+                        rect.Height = CommonHelper.GetPageSizeFomrUnit(841);
                     }
                     break;
                 default:

PDF Office/Views/Dialog/ToolsDialogs/MergeDialog.xaml

@@ -16,13 +16,68 @@
         <dataconvert:UnVisivleConvert x:Key="UnVisivleConvert" />
         <dataconvert:ListCountToVisible x:Key="ListCountToVisible"/>
         <dataconvert:UnVisibleToBoolConvert x:Key="UnVisibleToBoolConvert"/>
+        <PathGeometry x:Key="Ic_ClearButtonPath" Figures="M6 1.75H10V0.25H6V1.75ZM1 4.25H2.25V15C2.25 15.4142 2.58579 15.75 3 15.75H13C13.4142 15.75 13.75 15.4142 13.75 15V4.25H15V2.75H1V4.25ZM3.75 14.25V4.25H12.25V14.25H3.75ZM7.25 6.5V11.5H8.75V6.5H7.25Z" />
+        <PathGeometry x:Key="Ic_DeleteButtonPath" Figures="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.5303 5.53038L9.06069 8L11.5303 10.4696L10.4697 11.5303L8.00002 9.06066L5.53033 11.5303L4.46967 10.4697L6.93936 8L4.46967 5.53033L5.53033 4.46967L8.00002 6.93934L10.4697 4.46971L11.5303 5.53038Z" />
+        <SolidColorBrush x:Key="Item.MouseOver.Background" Color="#1F26A0DA"/>
+        <SolidColorBrush x:Key="Item.MouseOver.Border" Color="#a826A0Da"/>
+        <SolidColorBrush x:Key="Item.SelectedInactive.Background" Color="#3DDADADA"/>
+        <SolidColorBrush x:Key="Item.SelectedInactive.Border" Color="#FFDADADA"/>
+        <SolidColorBrush x:Key="Item.SelectedActive.Background" Color="#3D26A0DA"/>
+        <SolidColorBrush x:Key="Item.SelectedActive.Border" Color="#FF26A0DA"/>
+        <Style x:Key="ListViewItemStyle1" TargetType="{x:Type ListViewItem}">
+            <Setter Property="SnapsToDevicePixels" Value="True"/>
+            <Setter Property="Padding" Value="0"/>
+            <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
+            <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
+            <Setter Property="Background" Value="Transparent"/>
+            <Setter Property="BorderBrush" Value="Transparent"/>
+            <Setter Property="BorderThickness" Value="1"/>
+            <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="{x:Type ListViewItem}">
+                        <Border Grid.Row="2" CornerRadius="8" x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
+                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                            </Border>
+                            <ControlTemplate.Triggers>
+                            <MultiTrigger>
+                                <MultiTrigger.Conditions>
+                                    <Condition Property="IsMouseOver" Value="True"/>
+                                </MultiTrigger.Conditions>
+                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.MouseOver.Background}"/>
+                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.MouseOver.Border}"/>
+                            </MultiTrigger>
+                            <MultiTrigger>
+                                <MultiTrigger.Conditions>
+                                    <Condition Property="Selector.IsSelectionActive" Value="False"/>
+                                    <Condition Property="IsSelected" Value="True"/>
+                                </MultiTrigger.Conditions>
+                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Background}"/>
+                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Border}"/>
+                            </MultiTrigger>
+                            <MultiTrigger>
+                                <MultiTrigger.Conditions>
+                                    <Condition Property="Selector.IsSelectionActive" Value="True"/>
+                                    <Condition Property="IsSelected" Value="True"/>
+                                </MultiTrigger.Conditions>
+                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Background}"/>
+                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Border}"/>
+                            </MultiTrigger>
+                            <Trigger Property="IsEnabled" Value="False">
+                                <Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
+                            </Trigger>
+                        </ControlTemplate.Triggers>
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style>
     </UserControl.Resources>
     <Grid Background="{StaticResource color.sys.layout.anti}">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="16"/>
-            <ColumnDefinition Width="558"/>
-            <ColumnDefinition Width="260"/>
+            <ColumnDefinition Width="526"/>
             <ColumnDefinition Width="16"/>
+            <ColumnDefinition Width="260"/>
         </Grid.ColumnDefinitions>
         <Grid.RowDefinitions>
             <RowDefinition Height="16"/>
@@ -33,7 +88,7 @@
             <RowDefinition Height="50"/>
             <RowDefinition Height="16"/>
         </Grid.RowDefinitions>
-        <Border Grid.Column="1" Grid.Row="3">
+        <Border Grid.Column="1" Grid.Row="3" >
             <Grid AllowDrop="True" Background="{StaticResource color.sys.layout.anti}"
                 PreviewDrop="Grid_Drop"
                 PreviewDragEnter="Grid_DragEnter"
@@ -51,6 +106,9 @@
                     <TextBlock Text="Drop files here or Click Add Files at bottom right button. You can drag files to reorder as you need." FontSize="14" FontFamily="Segoe UI" HorizontalAlignment="Center" TextAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap"/>
                 </StackPanel>
                 <ListView x:Name="MergeView" AllowDrop="True" 
+                          Padding="0"
+                ItemContainerStyle="{StaticResource ListViewItemStyle1}"
+                BorderThickness="0"
                 Visibility="{Binding ElementName=NoFileStackPanel,Path=Visibility,Converter={StaticResource UnVisivleConvert}}"          
                 Drop="MergeView_Drop"
                 DragEnter="MergeView_DragEnter"
@@ -62,38 +120,53 @@
                 HorizontalContentAlignment="Stretch">
                     <ListView.ItemTemplate>
                         <DataTemplate  >
-                            <Grid x:Name="ContentPanel" >
+                            <Grid x:Name="ContentPanel" Margin="0,0,0,8"  Height="76" >
                                 <Grid.ColumnDefinitions>
-                                    <ColumnDefinition Width="Auto"/>
-                                    <ColumnDefinition Width="*"/>
-                                    <ColumnDefinition Width="*"/>
-                                    <ColumnDefinition Width="*"/>
-                                    <ColumnDefinition Width="*"/>
-                                    <ColumnDefinition Width="*"/>
+                                    <ColumnDefinition Width="40"/>
+                                    <ColumnDefinition Width="60"/>
+                                    <ColumnDefinition Width="151"/>
+                                    <ColumnDefinition Width="auto"/>
+                                    <ColumnDefinition Width="auto"/>
+                                    <ColumnDefinition Width="auto"/>
                                 </Grid.ColumnDefinitions>
                                 <TextBlock Text="{Binding RelativeSource={RelativeSource FindAncestor, 
                                          AncestorType={x:Type ListViewItem}}, 
                                          Converter={StaticResource IndexConverter}}"
                                  VerticalAlignment="Center"  HorizontalAlignment="Center"/>
-                                <Image Grid.Column="1" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center" Source="{Binding DocThumbnail}"  Stretch="Uniform"  />
-                                <StackPanel Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding DocName}" TextTrimming="CharacterEllipsis"/>
-                                    <TextBlock Text="{Binding DocPageCount}" />
-                                </StackPanel>
-                                <StackPanel Grid.Column="3" HorizontalAlignment="Center" VerticalAlignment="Center">
-                                    <customcontrol:WritableComboBox SelectedIndex="0" MaxPageRange="{Binding SDKPageCount}" Text="{Binding SetPageRange,Mode=TwoWay}"/>
+                                <Image Margin="8" Grid.Column="1"  HorizontalAlignment="Stretch" VerticalAlignment="Center" Source="{Binding DocThumbnail}"  Stretch="Uniform"  />
+                                <StackPanel Grid.Column="2" Margin="16,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Center">
+                                    <TextBlock Text="{Binding DocName}" FontFamily="Segoe UI" FontSize="14" FontWeight="Regular" Foreground="{StaticResource color.sys.text.neutral.lv1}"  TextTrimming="CharacterEllipsis"/>
+                                    <TextBlock Text="{Binding DocPageCount}"  FontFamily="Segoe UI" FontSize="14" FontWeight="Regular" Foreground="{StaticResource color.sys.text.neutral.lv3}"/>
                                 </StackPanel>
-                                <TextBlock Grid.Column="4" Text="{Binding DocSize}"  HorizontalAlignment="Center" VerticalAlignment="Center"/>
-                                <StackPanel Grid.Column="5" VerticalAlignment="Center">
-                                    <Button Content="删除" Click="Delete_Click"/>
+                                <StackPanel Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="16,0,0,0">
+                                    <customcontrol:WritableComboBox SelectedIndex="0" Width="160" Height="30" MaxPageRange="{Binding SDKPageCount}" Text="{Binding SetPageRange,Mode=TwoWay}"/>
                                 </StackPanel>
+                                <TextBlock Grid.Column="4" Text="{Binding DocSize}"  HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="16,0,0,0"/>
+                                <StackPanel Grid.Column="5" VerticalAlignment="Center" HorizontalAlignment="Stretch" Margin="16,0">
 
-                                <StackPanel Grid.ColumnSpan="5" Visibility="{Binding IsForward, Converter={StaticResource BoolToVisible}}" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Bottom">
-                                    <Line  Margin="0,0,0,0" X1="0"  X2="{Binding ElementName=ContentPanel,Path=ActualWidth}" HorizontalAlignment="Stretch" StrokeThickness="1.5" Stroke="#FF0078D7" VerticalAlignment="Bottom"/>
+                                    <customcontrol:PathButton
+            HorizontalAlignment="Center"
+            VerticalAlignment="Center"
+            VerticalContentAlignment="Center"
+            x:Name="BtnAdd"
+            Width="32" Height="32"
+           Click="Delete_Click"
+            Icon="{StaticResource Ic_DeleteButtonPath}" IconFill="#616469"
+            IconHeight="16" IconWidth="16"
+            IconMouseOver="{StaticResource Ic_DeleteButtonPath}" IconMouseOverFill="#616469"
+            IconPress="{StaticResource Ic_DeleteButtonPath}" IconPressFill="#616469"
+            CornerRadius="4"  HorizontalContentAlignment="Center"
+            MouseOverBackground="{StaticResource color.item-state.hov.bg}"
+            MouseDownBackground="{StaticResource color.item-state.sel.bg.lv3}"                          
+            MouseDownBorderBrush="{StaticResource color.item-state.sel.border.lv3}"
+                    />
+                                </StackPanel>
+                                <StackPanel Grid.ColumnSpan="6" Visibility="{Binding IsForward, Converter={StaticResource BoolToVisible}}" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Bottom">
+                                    <Line  Margin="0,0,0,0" X1="0"  X2="{Binding ElementName=ContentPanel,Path=ActualWidth}" HorizontalAlignment="Stretch" StrokeThickness="1.5" Stroke="{StaticResource color.sys.layout.accent}" VerticalAlignment="Bottom"/>
                                 </StackPanel>
 
-                                <StackPanel Grid.ColumnSpan="5" Visibility="{Binding IsBackwards, Converter={StaticResource BoolToVisible}}" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Top">
-                                    <Line  X1="0"  X2="{Binding ElementName=ContentPanel,Path=ActualWidth}" HorizontalAlignment="Stretch" StrokeThickness="1.5" Stroke="Red" VerticalAlignment="Bottom"/>
+                                <StackPanel Grid.ColumnSpan="6" Visibility="{Binding IsBackwards, Converter={StaticResource BoolToVisible}}" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Top">
+                                    <Line  X1="0"  X2="{Binding ElementName=ContentPanel,Path=ActualWidth}" HorizontalAlignment="Stretch" StrokeThickness="1.5" Stroke="{StaticResource color.sys.layout.accent}" VerticalAlignment="Bottom"/>
                                 </StackPanel>
                             </Grid>
                         </DataTemplate>
@@ -101,66 +174,73 @@
                 </ListView>
             </Grid>
         </Border>
-        <Border Grid.Column="2" Grid.Row="3">
+        <Border Grid.Column="3" Grid.RowSpan="7" Background="{StaticResource color.sys.layout.mg}">
             <Grid>
                 <Grid.RowDefinitions>
-                    <RowDefinition Height="20"/>
+                    <RowDefinition Height="14"/>
                     <RowDefinition Height="*"/>
+                    <RowDefinition Height="auto"/>
+                    <RowDefinition Height="16"/>
                 </Grid.RowDefinitions>
-                <TextBlock Text=" Page Size"/>
-                <StackPanel Grid.Row="1">
-                    <RadioButton Content="Original page size" Tag="0">
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="16"/>
+                    <ColumnDefinition Width="*"/>
+                    <ColumnDefinition Width="16"/>
+                </Grid.ColumnDefinitions>
+                <StackPanel Grid.Row="1" Grid.Column="1">
+                    <TextBlock Text=" Page Size" VerticalAlignment="Center" FontSize="14" FontFamily="Segoe UI" FontWeight="Bold"/>
+                    <RadioButton Content="Original page size" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Tag="0" Margin="0,14,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <RadioButton Content="A4" Tag="1">
+                    <RadioButton Content="A4" Tag="1" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="0,8,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <RadioButton Content="A3" Tag="2">
+                    <RadioButton Content="A3" Tag="2" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="0,8,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <RadioButton Content="U.S.Letter" Tag="3">
+                    <RadioButton Content="U.S.Letter" Tag="3" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="0,8,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <RadioButton Content="U.S.Legal" Tag="4">
+                    <RadioButton Content="U.S.Legal" Tag="4" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="0,8,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <RadioButton x:Name="Customized" Content="Customized" Tag="5">
+                    <RadioButton x:Name="Customized" Content="Customized" Tag="5" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="0,8,0,0">
                         <i:Interaction.Triggers>
                             <i:EventTrigger EventName="Checked">
                                 <i:InvokeCommandAction Command="{Binding SetPageSizeTypeCommand}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=RadioButton}}" PassEventArgsToCommand="True" />
                             </i:EventTrigger>
                         </i:Interaction.Triggers>
                     </RadioButton>
-                    <Grid IsEnabled="{Binding ElementName=Customized, Path=IsChecked}">
-                        <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="*"/>
-                            <ColumnDefinition Width="20"/>
-                            <ColumnDefinition Width="*"/>
-                        </Grid.ColumnDefinitions>
-                        <customcontrol:TextBoxEx PreviewKeyDown="TextBoxEx_PreviewKeyDown" x:Name="TextWidth" PlaceholderText="595" Text="{Binding InputWidth,Mode=TwoWay}"  PreviewTextInput="TextBox_PreviewTextInput" LostFocus="TextBoxEx_LostFocus"/>
-                        <TextBlock Text="X" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-                        <customcontrol:TextBoxEx PreviewKeyDown="TextBoxEx_PreviewKeyDown" x:Name="TextHeight" PlaceholderText="841" Grid.Column="2" Text="{Binding InputHeight,Mode=TwoWay}" PreviewTextInput="TextBox_PreviewTextInput" LostFocus="TextBoxEx_LostFocus"/>
-                    </Grid>
+                    <StackPanel IsEnabled="{Binding ElementName=Customized, Path=IsChecked}" Margin="0,8,0,0" Orientation="Horizontal" HorizontalAlignment="Stretch">
+                        <customcontrol:TextBoxEx Width="85" PreviewKeyDown="TextBoxEx_PreviewKeyDown" x:Name="TextWidth" PlaceholderText="595" Text="{Binding InputWidth,Mode=TwoWay}"  PreviewTextInput="TextBox_PreviewTextInput" LostFocus="TextBoxEx_LostFocus"/>
+                        <TextBlock Text="X" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,0"/>
+                        <customcontrol:TextBoxEx Width="85" PreviewKeyDown="TextBoxEx_PreviewKeyDown" x:Name="TextHeight" PlaceholderText="841" Grid.Column="2" Text="{Binding InputHeight,Mode=TwoWay}" PreviewTextInput="TextBox_PreviewTextInput" LostFocus="TextBoxEx_LostFocus"/>
+                        <TextBlock Text="mm" VerticalAlignment="Center" FontWeight="Regular" FontSize="14" FontFamily="Segoe UI" Margin="8,0,0,0"/>
+                    </StackPanel>
+                </StackPanel>
+                <StackPanel Grid.Column="1" Grid.Row="2"  HorizontalAlignment="Center" VerticalAlignment="Bottom">
+                    <Button x:Name="BtnMerge" Width="228" Content="Merge"  Height="32" Style="{StaticResource Btn.cta}" Command="{Binding MergeCommand}" IsEnabled="{Binding ElementName=NoFileStackPanel,Path=Visibility,Converter={StaticResource UnVisibleToBoolConvert}}"/>
+                    <Button Margin="0,16,0,0" Width="228" Content="Cancel" Height="32" Style="{StaticResource btn.sec}" Command="{Binding CancelCommand}"/>
                 </StackPanel>
             </Grid>
         </Border>
@@ -201,10 +281,24 @@
 
             </ComboBoxItem>
         </ComboBox>
-        <Button Grid.Column="1" Grid.Row="5"  Content="Clear"  HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="80" Height="32" Style="{StaticResource btn.sec}" Command="{Binding ClearCommand}"/>
-        <StackPanel Grid.Column="2" Grid.RowSpan="2" Grid.Row="4"  HorizontalAlignment="Center" VerticalAlignment="Bottom">
-            <Button x:Name="BtnMerge" Content="Merge" Width="80" Height="32" Style="{StaticResource Btn.cta}" Command="{Binding MergeCommand}" IsEnabled="{Binding ElementName=NoFileStackPanel,Path=Visibility,Converter={StaticResource UnVisibleToBoolConvert}}"/>
-            <Button Content="Cancel" Width="80" Height="32" Style="{StaticResource btn.sec}" Command="{Binding CancelCommand}"/>
-        </StackPanel>
+        <Border BorderThickness="1" Width="32" Height="32" Grid.Column="1" Grid.Row="5" BorderBrush="{StaticResource color.btn.sec.border-color}" 
+            HorizontalAlignment="Right" VerticalAlignment="Bottom" CornerRadius="4">
+            <customcontrol:PathButton
+            HorizontalAlignment="Center"
+            VerticalAlignment="Center"
+            VerticalContentAlignment="Center"
+            x:Name="BtnAdd"
+            Width="32" Height="32"
+            Command="{Binding ClearCommand}"
+            Icon="{StaticResource Ic_ClearButtonPath}" IconFill="#616469"
+            IconHeight="16" IconWidth="16"
+            IconMouseOver="{StaticResource Ic_ClearButtonPath}" IconMouseOverFill="#616469"
+            IconPress="{StaticResource Ic_ClearButtonPath}" IconPressFill="#616469"
+            CornerRadius="4"  HorizontalContentAlignment="Center"
+            MouseOverBackground="{StaticResource color.item-state.hov.bg}"
+            MouseDownBackground="{StaticResource color.item-state.sel.bg.lv3}"                          
+            MouseDownBorderBrush="{StaticResource color.item-state.sel.border.lv3}"
+                    />
+        </Border>
     </Grid>
 </UserControl>