PowerToys/src/modules/powerrename/PowerRenameUILib/MainWindow.xaml

<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">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Padding="12">
        <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="40" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <StackPanel Orientation="Horizontal">
                <CheckBox x:Name="checkBox_selectAll" IsChecked="True" MinWidth="0" Content="" x:Uid="SelectAllCheckBox" Margin="10,0,0,0" Checked="SelectAll" Unchecked="SelectAll" />
                <Image Width="16" Margin="4,0,0,0" Source="ms-appx:///Assets/file.png" HorizontalAlignment="Left" />

                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Grid.Column="2" Margin="6,-2,0,0" >
                    <TextBlock x:Uid="TxtBlock_Original" FontWeight="Medium" />
                    <TextBlock FontWeight="Medium" Margin="4,0,0,0" >
                        <Run Text="(" /><Run Text="{x:Bind UIUpdatesItem.OriginalCount, Mode=OneWay}" /><Run Text=")" />
                    </TextBlock>
                </StackPanel>
            </StackPanel>
            <AppBarSeparator Margin="-6,4,0,4" HorizontalAlignment="Right" />
            
            <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Grid.Column="2" Margin="4,-2,0,0" >
                <TextBlock x:Uid="TxtBlock_Renamed" FontWeight="Medium" />
                <TextBlock FontWeight="Medium" Margin="4,0,0,0" >
                        <Run Text="(" /><Run Text="{x:Bind UIUpdatesItem.RenamedCount, Mode=OneWay}" /><Run Text=")" />
                </TextBlock>
            </StackPanel>
            
            <Button Content="&#xE16E;" Background="Transparent" FontFamily="{ThemeResource SymbolThemeFontFamily}" Height="32" x:Uid="FilterButton" Grid.Column="1" 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" />
            <ListView IsTabStop="false"
                        SelectionMode="None"
                        XYFocusKeyboardNavigation="Enabled"
                        IsItemClickEnabled="False"
                        Grid.ColumnSpan="6" 
                        ItemsSource="{x:Bind ExplorerItems, Mode=OneWay}"
                        Grid.Row="1">
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="IsTabStop" Value="False" />
                        <Setter Property="Padding" Value="0"/>
                        <Setter Property="Margin" Value="0"/>
                        <Setter Property="MinHeight" Value="0"/>
                        <Setter Property="HorizontalContentAlignment"  Value="Stretch"/>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListViewItem">
                                    <StackPanel Orientation="Vertical">
                                        <ContentPresenter />
                                        <Rectangle Height="1" Margin="0,0,0,0" Opacity="0.8" Grid.ColumnSpan="5" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" />

                                    </StackPanel>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListView.ItemContainerStyle>
                <ListView.ItemTemplate>
                    <DataTemplate x:Name="ExplorerItemTemplate" x:DataType="local:ExplorerItem">
                        <Grid Height="28" Padding="0,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>

                            <Border HorizontalAlignment="Stretch" Grid.ColumnSpan="2" BorderThickness="0,0,0,1" Margin="0,0,0,-1" BorderBrush="{ThemeResource SystemAccentColor}" VerticalAlignment="Stretch" Background="{ThemeResource AccentTextFillColorPrimaryBrush}" Opacity="0.1" Visibility="{x:Bind Highlight, Mode=OneWay}" />

                            <Grid Grid.Column="0" HorizontalAlignment="Left" Margin="10,4,0,4">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition MinWidth="{x:Bind Indentation}"/>
                                        <ColumnDefinition Width="Auto"/>
                                        <ColumnDefinition Width="Auto"/>
                                        <ColumnDefinition Width="Auto"/>
                                    </Grid.ColumnDefinitions>
                                 
                             
                                    <CheckBox TabIndex="0"
                                          MinWidth="0"
                                              Width="28"
                                              Height="28"
                                          Grid.Column="1"
                                          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"
                                            Grid.Column="2"
                                           Margin="4,0,0,0"
                                           Source="{x:Bind ImagePath}"
                                           HorizontalAlignment="Left" />
                                    <TextBlock Margin="6,0,0,0"
                                           Grid.Column="3"
                                           Text="{x:Bind Original, Mode=OneWay}"
                                           Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                           VerticalAlignment="Center"
                                           FontSize="12" />
                                </Grid>
                            <TextBlock Text="{x:Bind Renamed, Mode=OneWay}"
                                       Grid.Column="1"
                                       FontWeight="Bold"
                                       Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
                                       VerticalAlignment="Center"
                                       FontSize="12" />
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>

        <Grid Grid.Column="0" Grid.Row="1" MaxWidth="357" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="48" />
            </Grid.RowDefinitions>
          
                <StackPanel Orientation="Vertical" Padding="0,0,0,16" Margin="0,0,12,0">
                    <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <AutoSuggestBox x:Name="textBox_search" x:Uid="SearchBox" Height="40" VerticalContentAlignment="Center" ItemsSource="{x:Bind SearchMRU}" />

                        <Button Grid.Column="1"
                                FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                VerticalAlignment="Center"
                                Visibility="{Binding ElementName=checkBox_regex, Path=IsChecked}"
                                Height="40"
                                Width="28" 
                                Padding="0"
                                Margin="0,0,-4,0"
                                BorderBrush="Transparent"
                                Background="Transparent"
                                x:Uid="RegExButton"
                                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" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" />
                                                    </Grid>
                                                </DataTemplate>
                                            </ListView.ItemTemplate>
                                        </ListView>
                                        <HyperlinkButton Grid.Row="2" VerticalAlignment="Bottom" NavigateUri="https://aka.ms/powertoysRegExHelp">
                                            <TextBlock x:Uid="RegExCheatSheet_LearnMore" />
                                        </HyperlinkButton>
                                    </Grid>
                                </Flyout>
                            </Button.Flyout>
                        </Button>
                    </Grid>


                    <CheckBox x:Name="checkBox_regex" x:Uid="CheckBox_RegEx" Margin="2,6,0,0" />
                    <CheckBox x:Name="checkBox_matchAll" x:Uid="CheckBox_MatchAll" Margin="2,0,0,0" />
                    <CheckBox x:Name="checkBox_case" x:Uid="CheckBox_Case" Margin="2,0,0,0" />

                    <Rectangle Height="1" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" Margin="0,16,0,20" />
                    <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <AutoSuggestBox x:Name="textBox_replace" x:Uid="ReplaceBox" Height="40" VerticalContentAlignment="Center" Padding="12,12,0,0" ItemsSource="{x:Bind ReplaceMRU}" />

                        <Button FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                VerticalAlignment="Center"
                                x:Uid="FileCreationButton"
                                Grid.Column="1"
                                Width="28"
                                Height="40"
                                Padding="0"
                                Margin="0,0,-4,0"
                                BorderBrush="Transparent"
                                Background="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" 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,12,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="0" Height="31" IsChecked="True" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="ToggleButton_IncludeFiles" Style="{StaticResource CustomToggleButtonStyle}" />
                        <ToggleButton x:Name="toggleButton_includeFolders" Content="&#xE8B7;" MinHeight="0" Height="31" IsChecked="True" FontFamily="{ThemeResource SymbolThemeFontFamily}" x:Uid="ToggleButton_IncludeFolders" Style="{StaticResource CustomToggleButtonStyle}" />
                        <ToggleButton x:Name="toggleButton_includeSubfolders" Content="&#xE12F;" MinHeight="0" Height="31" 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,12,0,8" />


                    <StackPanel Orientation="Horizontal" Spacing="4">
                        <ToggleButton x:Name="toggleButton_lowerCase" Content="aa" FontWeight="Medium" MinHeight="0" Height="31" x:Uid="ToggleButton_Lowercase" Style="{StaticResource CustomToggleButtonStyle}" />
                        <ToggleButton x:Name="toggleButton_upperCase" Content="AA" FontWeight="Medium" MinHeight="0" Height="31" x:Uid="ToggleButton_Uppercase" Style="{StaticResource CustomToggleButtonStyle}" />
                        <ToggleButton x:Name="toggleButton_titleCase" Content="Aa" FontWeight="Medium" MinHeight="0" Height="31" x:Uid="ToggleButton_TitleCase" Style="{StaticResource CustomToggleButtonStyle}" />
                        <ToggleButton x:Name="toggleButton_capitalize" Content="Aa Aa" FontWeight="Medium" MinHeight="0" Height="31" 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>
        

            <Rectangle Height="1" Fill="{ThemeResource CardStrokeColorDefaultBrush}" HorizontalAlignment="Stretch" Margin="0,0,12,0" VerticalAlignment="Top" Grid.Row="1" />


      
        </Grid>

        <StackPanel Orientation="Horizontal"
                    Grid.Row="2"
                    Spacing="8"
                    Margin="0"
                    Grid.Column="0"
                    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="2" Style="{StaticResource SplitAccentButtonStyle}" Grid.Column="0" Margin="0,0,12,1" x:Name="button_rename" x:Uid="ButtonApply" Click="button_rename_Click" HorizontalAlignment="Right" VerticalAlignment="Bottom" IsEnabled="{x:Bind UIUpdatesItem.ButtonRenameEnabled, Mode=OneWay}">
            <muxc:SplitButton.KeyboardAccelerators>
                <KeyboardAccelerator Key="Enter" />
                <KeyboardAccelerator Key="Enter" Modifiers="Control" />
            </muxc:SplitButton.KeyboardAccelerators>
            <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>

        <!--<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>