PowerToys/src/modules/powerrename/PowerRenameUILib/MainWindow.xaml
Stefan Markovic 5cfbd72fa8
[PowerRename] Fluent UX (#13678)
* PowerRename new UI

* Add scrollviewer

* Don't deploy PowerRenameUI_new

* Visual updates

* Visual updates

* Updates

* Update Resources.resw

* Added docs button

* Update MainWindow.xaml

* Wire Docs button

* RegEx -> regular expressions

* Update Show only renamed list on search/replace text changed

* Update Show only renamed list on search/replace text changed - proper fix
Set searchTerm to NULL when cleared - fix Show only renamed files on clear searchTerm

* Files/folders input error handling

* Fix renaming with keeping UI window opened

After renaming folder, all of it's children need path update.
Without path update, further renaming of children items would
fail.

* Update only children, not all items with greater depth

* Fix dictionary false positives

* Remove .NET dep

* Rename PowerRenameUI_new to PowerRenameUILib
Rename executable PowerRenameUIHost to PowerRename

Co-authored-by: Laute <Niels.Laute@philips.com>
2021-10-25 14:40:19 +01:00

326 lines
23 KiB
XML

<UserControl x:Class="PowerRenameUILib.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:PowerRenameUILib" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:controls="using:Microsoft.UI.Xaml.Controls" xmlns:muxc="using:Microsoft.UI.Xaml.Controls" controls:BackdropMaterial.ApplyToRootOrPageBackground="True" xmlns:animatedVisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals" mc:Ignorable="d">
<UserControl.Resources>
<local:ExplorerItemTemplateSelector x:Key="ExplorerItemTemplateSelector" FolderTemplate="{StaticResource FolderTemplate}" FileTemplate="{StaticResource FileTemplate}" />
<local:ExplorerItemTemplateSelector x:Key="RenamedExplorerItemTemplateSelector" FolderTemplate="{StaticResource RenamedFolderTemplate}" FileTemplate="{StaticResource RenamedFileTemplate}" />
<DataTemplate x:Key="FileTemplate" x:DataType="local:ExplorerItem">
<Grid Height="24" Margin="0,4,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="36" />
<ColumnDefinition Width="36" />
<ColumnDefinition Width="300" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<CheckBox TabIndex="0" Grid.Column="0" XYFocusKeyboardNavigation="Enabled" Checked="Checked_ids" IsTabStop="True" Unchecked="Checked_ids" Content="" Name="{x:Bind IdStr}" AutomationProperties.Name="{x:Bind Original}" AutomationProperties.HelpText="{x:Bind Renamed}" IsChecked="{x:Bind Checked, Mode=TwoWay}" />
<Image Width="16" Source="ms-appx:///Assets/file.png" HorizontalAlignment="Left" Grid.Column="1" />
<TextBlock Text="{x:Bind Original, Mode=OneWay}" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" FontSize="12" Grid.Column="2" />
</Grid>
</DataTemplate>
<DataTemplate x:Key="FolderTemplate" x:DataType="local:ExplorerItem">
<Grid Margin="0,4,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="36" />
<ColumnDefinition Width="36" />
<ColumnDefinition Width="300" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="24" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<CheckBox TabIndex="0" IsTabStop="True" XYFocusKeyboardNavigation="Enabled" Grid.Row="0" Grid.Column="0" Checked="Checked_ids" Unchecked="Checked_ids" Content="" Name="{x:Bind IdStr}" AutomationProperties.Name="{x:Bind Original}" AutomationProperties.HelpText="{x:Bind Renamed}" IsChecked="{x:Bind Checked, Mode=TwoWay}" />
<Image Width="16" Source="ms-appx:///Assets/folder.png" HorizontalAlignment="Left" Grid.Column="1" />
<TextBlock Text="{x:Bind Original, Mode=OneWay}" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" FontSize="12" Grid.Column="2" />
<ListView Grid.ColumnSpan="3" IsTabStop="false" XYFocusKeyboardNavigation="Enabled" SelectionMode="None" IsItemClickEnabled="False" ItemsSource="{x:Bind Children}" Grid.Row="1" ItemTemplateSelector="{StaticResource ExplorerItemTemplateSelector}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
</Grid>
</DataTemplate>
<DataTemplate x:Key="RenamedFileTemplate" x:DataType="local:ExplorerItem">
<Grid Height="24" Margin="0,4,0,0">
<TextBlock Text="{x:Bind Renamed, Mode=OneWay}" FontWeight="SemiBold" VerticalAlignment="Center" FontSize="14" />
</Grid>
</DataTemplate>
<DataTemplate x:Key="RenamedFolderTemplate" x:DataType="local:ExplorerItem">
<Grid Margin="0,4,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="24" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock Text="{x:Bind Renamed, Mode=OneWay}" FontWeight="Bold" VerticalAlignment="Center" FontSize="14" />
<ListView IsTabStop="false" Margin="-12,0,0,0" SelectionMode="None" IsItemClickEnabled="False" ItemsSource="{x:Bind Children}" Grid.Row="1" ItemTemplateSelector="{StaticResource RenamedExplorerItemTemplateSelector}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
</Grid>
</DataTemplate>
</UserControl.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Padding="20">
<Grid.RowDefinitions>
<RowDefinition Height="0" /> <!-- 48 if we need to draw the title bar ourself -->
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Grid.Row="1" Grid.Column="1" Background="{ThemeResource LayerFillColorDefaultBrush}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" CornerRadius="8" BorderThickness="1" BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="48" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="36" />
<ColumnDefinition Width="48" />
<ColumnDefinition Width="Auto" MinWidth="324" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="48" />
</Grid.ColumnDefinitions>
<CheckBox x:Name="checkBox_selectAll" IsChecked="True" Content="" x:Uid="SelectAllCheckBox" Margin="16,0,0,0" Checked="SelectAll" Unchecked="SelectAll" />
<Image Width="16" Grid.Column="1" Source="ms-appx:///Assets/file.png" HorizontalAlignment="Center" />
<TextBlock x:Uid="TxtBlock_Original" Grid.Column="2" FontWeight="Medium" Margin="2,-2,0,0" VerticalAlignment="Center" />
<AppBarSeparator Grid.Column="3" Margin="-6,4,0,4" HorizontalAlignment="Left" />
<TextBlock x:Uid="TxtBlock_Renamed" FontWeight="Medium" Grid.Column="3" Margin="4,-2,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" />
<Button Content="&#xE16E;" Background="Transparent" FontFamily="{ThemeResource SymbolThemeFontFamily}" Height="32" x:Uid="FilterButton" Grid.Column="4" BorderThickness="0" HorizontalAlignment="Right" Margin="0,0,8,0">
<Button.Flyout>
<MenuBarItemFlyout Placement="Bottom">
<controls:RadioMenuFlyoutItem x:Name="button_showAll" Click="ShowAll" x:Uid="ShowAll" IsChecked="True" GroupName="Filter" />
<controls:RadioMenuFlyoutItem x:Name="button_showRenamed" Click="ShowRenamed" x:Uid="ShowOnly" GroupName="Filter" />
</MenuBarItemFlyout>
</Button.Flyout>
</Button>
<Rectangle Height="1" Grid.ColumnSpan="5" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" />
<ScrollViewer Grid.ColumnSpan="6" HorizontalScrollMode="Enabled" Grid.Row="1">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" MinWidth="286" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ListView IsTabStop="false" SelectionMode="None" XYFocusKeyboardNavigation="Enabled" IsItemClickEnabled="False" ItemsSource="{x:Bind ExplorerItems, Mode=OneWay}" Margin="4,0,0,0" ItemTemplateSelector="{StaticResource ExplorerItemTemplateSelector}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
<!--<controls:ItemsRepeater ItemsSource="{x:Bind ExplorerItems, Mode=OneWay}"
Margin="16,0,0,0"
ItemTemplate="{StaticResource ExplorerItemTemplateSelector}" />-->
<ListView Grid.Column="1" IsTabStop="false" SelectionMode="None" IsItemClickEnabled="False" ItemsSource="{x:Bind ExplorerItems, Mode=OneWay}" ItemTemplateSelector="{StaticResource RenamedExplorerItemTemplateSelector}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
<!--<controls:ItemsRepeater ItemsSource="{x:Bind ExplorerItems, Mode=OneWay}"
Grid.Column="1"
ItemTemplate="{StaticResource RenamedExplorerItemTemplateSelector}" />-->
</Grid>
</ScrollViewer>
</Grid>
<Grid Grid.Column="0" Grid.Row="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="48" />
</Grid.RowDefinitions>
<ScrollViewer>
<StackPanel Orientation="Vertical" Padding="0,0,0,16" Margin="0,0,20,0">
<Grid>
<AutoSuggestBox x:Name="textBox_search" x:Uid="SearchBox" Height="48" VerticalContentAlignment="Center" ItemsSource="{x:Bind SearchMRU}" />
<Button FontFamily="{ThemeResource SymbolThemeFontFamily}" VerticalAlignment="Center" Visibility="{Binding ElementName=checkBox_regex, Path=IsChecked}" MinHeight="32" Margin="4" x:Uid="RegExButton" Background="Transparent" BorderBrush="Transparent" Content="&#xE946;" HorizontalAlignment="Right">
<Button.Flyout>
<Flyout x:Name="RegExFlyout">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="28" />
<RowDefinition Height="*" />
<RowDefinition Height="48" />
</Grid.RowDefinitions>
<TextBlock x:Uid="RegExCheatSheet_Title" FontWeight="SemiBold" />
<ListView ItemsSource="{x:Bind SearchRegExShortcuts}" Grid.Row="1" IsItemClickEnabled="True" Margin="-4,12,0,0" ItemClick="RegExItemClick">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:PatternSnippet">
<Grid ColumnSpacing="8" Margin="-10,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="48" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border CornerRadius="4" Padding="8" HorizontalAlignment="Left" BorderThickness="1" BorderBrush="{ThemeResource ButtonBorderBrush}" Background="{ThemeResource ButtonBackground}">
<TextBlock FontFamily="Consolas" Foreground="{ThemeResource ButtonForeground}" Text="{x:Bind Code}" />
</Border>
<TextBlock Text="{x:Bind Description}" FontSize="12" Grid.Column="1" Margin="0,0,0,0" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<HyperlinkButton Grid.Row="2" VerticalAlignment="Bottom">
<TextBlock x:Uid="RegExCheatSheet_LearnMore" />
</HyperlinkButton>
</Grid>
</Flyout>
</Button.Flyout>
</Button>
</Grid>
<CheckBox x:Name="checkBox_regex" x:Uid="CheckBox_RegEx" Margin="2,12,0,0" />
<CheckBox x:Name="checkBox_matchAll" x:Uid="CheckBox_MatchAll" Margin="2,4,0,0" />
<CheckBox x:Name="checkBox_case" x:Uid="CheckBox_Case" Margin="2,4,0,0" />
<Rectangle Height="1" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" Margin="0,16,0,20" />
<Grid>
<AutoSuggestBox x:Name="textBox_replace" Margin="0,0,0,0" x:Uid="ReplaceBox" Height="48" VerticalContentAlignment="Center" Padding="12,12,0,0" ItemsSource="{x:Bind ReplaceMRU}" />
<Button FontFamily="{ThemeResource SymbolThemeFontFamily}" VerticalAlignment="Center" MinHeight="32" Margin="4" x:Uid="FileCreationButton" Background="Transparent" BorderBrush="Transparent" Content="&#xE946;" HorizontalAlignment="Right">
<Button.Flyout>
<Flyout x:Name="DateTimeFlyout" ShouldConstrainToRootBounds="False">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="28" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock x:Uid="DateTimeCheatSheet_Title" FontWeight="SemiBold" />
<ListView ItemsSource="{x:Bind DateTimeShortcuts}" Grid.Row="1" IsItemClickEnabled="True" Margin="-4,12,0,0" ItemClick="DateTimeItemClick">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:PatternSnippet">
<Grid ColumnSpacing="8" Margin="-10,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="56" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border CornerRadius="4" Padding="8" HorizontalAlignment="Left" BorderThickness="1" BorderBrush="{ThemeResource ButtonBorderBrush}" Background="{ThemeResource ButtonBackground}">
<TextBlock FontFamily="Consolas" Foreground="{ThemeResource ButtonForeground}" Text="{x:Bind Code}" />
</Border>
<TextBlock Text="{x:Bind Description}" FontSize="12" Grid.Column="1" Margin="0,0,0,0" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</Flyout>
</Button.Flyout>
</Button>
</Grid>
<TextBlock x:Uid="TextBox_ApplyTo" x:Name="ApplyToLabel" FontSize="12" Margin="0,20,0,8" Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
<StackPanel Orientation="Horizontal" Grid.Column="1" Spacing="4" Grid.Row="1">
<ComboBox x:Name="comboBox_renameParts" SelectedIndex="0" Width="200" AutomationProperties.LabeledBy="{Binding ElementName=ApplyToLabel}" HorizontalAlignment="Stretch" Grid.Column="0" Grid.Row="1">
<x:String>Filename + extension</x:String>
<x:String>Filename only</x:String>
<x:String>Extension only</x:String>
</ComboBox>
<AppBarSeparator Margin="5,0,5,0" />
<ToggleButton x:Name="toggleButton_includeFiles" Content="&#xE160;" MinHeight="32" IsChecked="True" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="ToggleButton_IncludeFiles" Style="{StaticResource CustomToggleButtonStyle}" />
<ToggleButton x:Name="toggleButton_includeFolders" Content="&#xE8B7;" MinHeight="32" IsChecked="True" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="ToggleButton_IncludeFolders" Style="{StaticResource CustomToggleButtonStyle}" />
<ToggleButton x:Name="toggleButton_includeSubfolders" Content="&#xE12F;" MinHeight="32" IsChecked="True" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="ToggleButton_IncludeSubFolders" Style="{StaticResource CustomToggleButtonStyle}" />
</StackPanel>
<TextBlock x:Uid="TextBlock_TextFormatting" FontSize="12" Foreground="{ThemeResource TextFillColorSecondaryBrush}" Margin="0,20,0,8" />
<StackPanel Orientation="Horizontal" Spacing="4">
<ToggleButton x:Name="toggleButton_lowerCase" Content="aa" FontWeight="Medium" MinHeight="32" x:Uid="ToggleButton_Lowercase" Style="{StaticResource CustomToggleButtonStyle}" />
<ToggleButton x:Name="toggleButton_upperCase" Content="AA" FontWeight="Medium" MinHeight="32" x:Uid="ToggleButton_Uppercase" Style="{StaticResource CustomToggleButtonStyle}" />
<ToggleButton x:Name="toggleButton_titleCase" Content="Aa" FontWeight="Medium" MinHeight="32" x:Uid="ToggleButton_TitleCase" Style="{StaticResource CustomToggleButtonStyle}" />
<ToggleButton x:Name="toggleButton_capitalize" Content="Aa Aa" FontWeight="Medium" MinHeight="32" x:Uid="ToggleButton_Capitalize" Style="{StaticResource CustomToggleButtonStyle}" />
<AppBarSeparator Margin="5,0,5,0" />
<ToggleButton x:Name="toggleButton_enumItems" Content="&#xEA40;" FontFamily="{ThemeResource SymbolThemeFontFamily}" MinHeight="32" x:Uid="ToggleButton_EnumItems" Style="{StaticResource CustomToggleButtonStyle}" />
</StackPanel>
</StackPanel>
</ScrollViewer>
<Rectangle Height="1" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" Margin="0,0,20,0" VerticalAlignment="Top" Grid.Row="1" />
<StackPanel Orientation="Horizontal" Grid.Row="1" Spacing="8" Margin="0" Grid.Column="1" VerticalAlignment="Bottom" HorizontalAlignment="Left">
<Button x:Name="button_settings" Height="32" x:Uid="TxtBlock_ButtonSettings" FontFamily="{ThemeResource SymbolThemeFontFamily}" Grid.Row="5" Padding="6" Background="Transparent" BorderBrush="Transparent" Grid.Column="1">
<Button.Content>
<controls:AnimatedIcon x:Name="SearchAnimatedIcon">
<controls:AnimatedIcon.Source>
<animatedVisuals:AnimatedSettingsVisualSource />
</controls:AnimatedIcon.Source>
<controls:AnimatedIcon.FallbackIconSource>
<controls:SymbolIconSource Symbol="Setting" />
</controls:AnimatedIcon.FallbackIconSource>
</controls:AnimatedIcon>
</Button.Content>
</Button>
<Button x:Name="button_docs" Content="&#xE11B;" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="DocsButton" Background="Transparent" BorderBrush="Transparent" Grid.Row="1" Height="32" VerticalAlignment="Bottom" HorizontalAlignment="Left" Click="OpenDocs" />
<!--<Button Content="&#xE728;"
FontFamily="{ThemeResource SymbolThemeFontFamily}"
ToolTipService.ToolTip="Presets"
Background="Transparent"
BorderBrush="Transparent"
Grid.Row="1"
Height="36"
VerticalAlignment="Bottom"
HorizontalAlignment="Left">
<Button.Flyout>
<MenuFlyout>
<MenuFlyoutItem Text="Photo rule 1" />
<MenuFlyoutItem Text="Date time rule" />
<MenuFlyoutItem Text="And another rule" />
</MenuFlyout>
</Button.Flyout>
</Button>-->
</StackPanel>
<muxc:SplitButton Grid.Row="1" Style="{StaticResource SplitAccentButtonStyle}" x:Name="button_rename" Margin="0,0,20,0" x:Uid="ButtonApply" Click="button_rename_Click" HorizontalAlignment="Right" VerticalAlignment="Bottom" IsEnabled="{x:Bind UIUpdatesItem.ButtonRenameEnabled, Mode=OneWay}">
<muxc:SplitButton.Content>
<StackPanel Orientation="Horizontal">
<FontIcon Glyph="&#xE13E;" FontSize="14" VerticalAlignment="Center" Margin="0,2,10,0" />
<TextBlock x:Uid="TxtBlock_ButtonApply" />
</StackPanel>
</muxc:SplitButton.Content>
<muxc:SplitButton.Flyout>
<MenuFlyout>
<MenuFlyoutItem x:Uid="TxtBlock_ButtonApplyAndClose" Click="MenuFlyoutItem_Click" />
</MenuFlyout>
</muxc:SplitButton.Flyout>
</muxc:SplitButton>
</Grid>
<!--<StackPanel x:Name="TitleBar" Orientation="Horizontal">
<Image Source="Assets/PowerRename.png" Width="16" Height="16" VerticalAlignment="Top" Margin="20,9,0,0"/>
<TextBlock Text="PowerRename" Style="{StaticResource CaptionTextBlockStyle}" Margin="18,8,8,0" VerticalAlignment="Top" />
</StackPanel>-->
</Grid>
</UserControl>