PowerToys/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/ImageResizerPage.xaml

389 lines
23 KiB
Plaintext
Raw Normal View History

 <Page
x:Class="Microsoft.PowerToys.Settings.UI.Views.ImageResizerPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:CustomControls="using:Microsoft.PowerToys.Settings.UI.Controls"
xmlns:models="using:Microsoft.PowerToys.Settings.UI.Library"
xmlns:viewModels="using:Microsoft.PowerToys.Settings.UI.Library.ViewModels"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
AutomationProperties.LandmarkType="Main">
<Page.Resources>
<!--<viewModel:ImageResizerViewModel x:Key="ViewModel"/>-->
</Page.Resources>
<Grid RowSpacing="{StaticResource DefaultRowSpacing}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="LayoutVisualStates">
<VisualState x:Name="WideLayout">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="{StaticResource WideLayoutMinWidth}" />
</VisualState.StateTriggers>
</VisualState>
<VisualState x:Name="SmallLayout">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="{StaticResource SmallLayoutMinWidth}" />
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="SidePanel.(Grid.Column)" Value="0"/>
<Setter Target="SidePanel.Width" Value="Auto"/>
<Setter Target="ImageResizerView.(Grid.Row)" Value="1" />
<Setter Target="ImageResizerView.Margin" Value="0" />
<Setter Target="LinksPanel.(RelativePanel.RightOf)" Value="AboutImage"/>
<Setter Target="LinksPanel.(RelativePanel.AlignTopWith)" Value="AboutImage"/>
<Setter Target="AboutImage.Margin" Value="0,12,12,0"/>
<Setter Target="AboutTitle.Visibility" Value="Collapsed" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Orientation="Vertical" x:Name="ImageResizerView"
Margin="0,0,48,0">
<ToggleSwitch x:Uid="ImageResizer_EnableToggle"
IsOn="{x:Bind Mode=TwoWay, Path=ViewModel.IsEnabled}"/>
<TextBlock x:Uid="ImageResizer_CustomSizes"
Style="{StaticResource SettingsGroupTitleStyle}"
Foreground="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled, Converter={StaticResource ModuleEnabledToForegroundConverter}}"/>
<ListView x:Name="ImagesSizesListView"
x:Uid="ImagesSizesListView"
ItemsSource="{x:Bind ViewModel.Sizes, Mode=TwoWay}"
Padding="0,0,0,24"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"
SelectionMode="None"
ScrollViewer.HorizontalScrollMode="Enabled"
ScrollViewer.HorizontalScrollBarVisibility="Auto"
ScrollViewer.IsHorizontalRailEnabled="True"
ContainerContentChanging="ImagesSizesListView_ContainerContentChanging">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
<Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
<Setter Property="Background" Value="{ThemeResource ListViewItemBackground}"/>
<Setter Property="Foreground" Value="{ThemeResource ListViewItemForeground}"/>
<Setter Property="TabNavigation" Value="Local"/>
<Setter Property="IsHoldingEnabled" Value="True"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}"/>
<Setter Property="MinHeight" Value="0"/>
<Setter Property="AllowDrop" Value="False"/>
<Setter Property="UseSystemFocusVisuals" Value="True"/>
<Setter Property="FocusVisualMargin" Value="0"/>
<Setter Property="FocusVisualPrimaryBrush" Value="{ThemeResource ListViewItemFocusVisualPrimaryBrush}"/>
<Setter Property="FocusVisualPrimaryThickness" Value="2"/>
<Setter Property="FocusVisualSecondaryBrush" Value="{ThemeResource ListViewItemFocusVisualSecondaryBrush}"/>
<Setter Property="FocusVisualSecondaryThickness" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<ListViewItemPresenter
CheckBrush="{ThemeResource ListViewItemCheckBrush}"
ContentMargin="{TemplateBinding Padding}"
CheckMode="{ThemeResource ListViewItemCheckMode}"
ContentTransitions="{TemplateBinding ContentTransitions}"
CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
DragForeground="{ThemeResource ListViewItemDragForeground}"
DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
DragBackground="{ThemeResource ListViewItemDragBackground}"
DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
FocusVisualPrimaryBrush="{TemplateBinding FocusVisualPrimaryBrush}"
FocusVisualSecondaryThickness="{TemplateBinding FocusVisualSecondaryThickness}"
FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
FocusVisualPrimaryThickness="{TemplateBinding FocusVisualPrimaryThickness}"
FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
FocusVisualSecondaryBrush="{TemplateBinding FocusVisualSecondaryBrush}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
Control.IsTemplateFocusTarget="True"
PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
PressedBackground="{ThemeResource ListViewItemBackgroundPressed}"
PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
PointerOverBackground="{ThemeResource ListViewItemBackgroundPointerOver}" ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
SelectedPressedBackground="{ThemeResource ListViewItemBackgroundSelectedPressed}"
SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}"
SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
SelectedPointerOverBackground="{ThemeResource ListViewItemBackgroundSelectedPointerOver}"
SelectedBackground="{ThemeResource ListViewItemBackgroundSelected}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate x:Name="SingleLineDataTemplate" x:DataType="models:ImageSize" >
<StackPanel Name="ImageResizer_Configurations" x:Uid="ImageResizer_Configurations" Orientation="Horizontal" Padding="0" Spacing="4">
<TextBox Name="ImageResizer_Name"
x:Uid="ImageResizer_Name"
Text="{x:Bind Path=Name, Mode=TwoWay}"
Width="90"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}"/>
<ComboBox Name="ImageResizer_Fit_Property"
x:Uid="ImageResizer_Fit_Property"
SelectedIndex="{x:Bind Path=Fit, Mode=TwoWay}"
Width="90"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}">
<ComboBoxItem x:Uid="ImageResizer_Sizes_Fit_Fill" />
<ComboBoxItem x:Uid="ImageResizer_Sizes_Fit_Fit" />
<ComboBoxItem x:Uid="ImageResizer_Sizes_Fit_Stretch" />
</ComboBox>
<muxc:NumberBox Name="ImageResizer_Width_Property"
x:Uid="ImageResizer_Width_Property"
Value="{x:Bind Path=Width, Mode=TwoWay}"
2021-05-21 21:58:57 +08:00
Minimum="0"
MinWidth="68"
SpinButtonPlacementMode="Compact"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}"/>
<TextBlock Name="ImageResizer_Times_Symbol"
x:Uid="ImageResizer_Times_Symbol"
Text="&#xE711;"
FontFamily="Segoe MDL2 Assets"
TextAlignment="Center"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}"
Opacity="{x:Bind Path=ExtraBoxOpacity, Mode=OneWay}"
Width="25"/>
<muxc:NumberBox Name="ImageResizer_Height_Property"
x:Uid="ImageResizer_Height_Property"
Value="{x:Bind Path=Height, Mode=TwoWay}"
MinWidth="68"
2021-05-21 21:58:57 +08:00
Minimum="0"
VerticalAlignment="Center"
SpinButtonPlacementMode="Compact"
Opacity="{x:Bind Path=ExtraBoxOpacity, Mode=OneWay}"
IsEnabled="{x:Bind Path=EnableEtraBoxes, Mode=OneWay}"
Margin="{StaticResource SmallTopMargin}"/>
<ComboBox Name="ImageResizer_Size_Property"
x:Uid="ImageResizer_Size_Property"
SelectedIndex="{Binding Path=Unit, Mode=TwoWay}"
MinWidth="120"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}">
<ComboBoxItem x:Uid="ImageResizer_Sizes_Units_CM" />
<ComboBoxItem x:Uid="ImageResizer_Sizes_Units_Inches" />
<ComboBoxItem x:Uid="ImageResizer_Sizes_Units_Percent" />
<ComboBoxItem x:Uid="ImageResizer_Sizes_Units_Pixels" />
</ComboBox>
<Button x:Name="RemoveButton"
x:Uid="RemoveButton"
Background="Transparent"
FontFamily="Segoe MDL2 Assets"
Width="34"
Content="&#xE74D;"
VerticalAlignment="Center"
Margin="{StaticResource SmallTopMargin}"
UseLayoutRounding="False"
Click="DeleteCustomSize"
CommandParameter="{Binding Id}">
<ToolTipService.ToolTip>
<TextBlock x:Uid="RemoveTooltip"/>
</ToolTipService.ToolTip>
</Button>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<StackPanel Orientation="Horizontal">
<AppBarButton Icon="Add"
x:Name="AddSizeButton"
Style="{StaticResource AddItemAppBarButtonStyle}"
IsEnabled="{x:Bind Mode=TwoWay, Path=ViewModel.IsEnabled}"
x:Uid="ImageResizer_AddSizeButton"
Click="AddSizeButton_Click"
Margin="{StaticResource AddItemButtonMargin}"
/>
</StackPanel>
<TextBlock x:Uid="Encoding"
Style="{StaticResource SettingsGroupTitleStyle}"
Foreground="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled, Converter={StaticResource ModuleEnabledToForegroundConverter}}"/>
<ComboBox x:Uid="ImageResizer_FallBackEncoderText"
SelectedIndex="{x:Bind Path=ViewModel.Encoder, Mode=TwoWay}"
MinWidth="240"
Margin="{StaticResource SmallTopMargin}"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}">
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_PNG" />
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_BMP" />
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_JPEG" />
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_TIFF" />
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_WMPhoto" />
<ComboBoxItem x:Uid="ImageResizer_FallbackEncoder_GIF" />
</ComboBox>
<muxc:NumberBox x:Uid="ImageResizer_Encoding"
Minimum="0"
Maximum="100"
Value="{x:Bind Mode=TwoWay, Path=ViewModel.JPEGQualityLevel}"
MinWidth="240"
Margin="{StaticResource SmallTopMargin}"
SpinButtonPlacementMode="Compact"
HorizontalAlignment="Left"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"
AutomationProperties.LabeledBy="{Binding ElementName=ImageResizer_Encoding}"
/>
<ComboBox x:Uid="ImageResizer_PNGInterlacing"
SelectedIndex="{x:Bind Mode=TwoWay, Path=ViewModel.PngInterlaceOption}"
MinWidth="240"
Margin="{StaticResource SmallTopMargin}"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}">
<ComboBoxItem x:Uid="Default"/>
<ComboBoxItem x:Uid="On"/>
<ComboBoxItem x:Uid="Off"/>
</ComboBox>
<ComboBox x:Uid="ImageResizer_TIFFCompression"
SelectedIndex="{x:Bind Mode=TwoWay, Path=ViewModel.TiffCompressOption}"
MinWidth="240"
Margin="{StaticResource SmallTopMargin}"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}">
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_Default"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_None"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_CCITT3"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_CCITT4"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_LZW"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_RLE"/>
<ComboBoxItem x:Uid="ImageResizer_ENCODER_TIFF_Zip"/>
</ComboBox>
<TextBlock x:Uid="File"
Style="{StaticResource SettingsGroupTitleStyle}"
Foreground="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled, Converter={StaticResource ModuleEnabledToForegroundConverter}}"/>
<TextBox Text="{x:Bind Mode=TwoWay, Path=ViewModel.FileName}"
HorizontalAlignment="Left"
MinWidth="240"
2020-10-14 03:30:57 +08:00
x:Uid="ImageResizer_FilenameFormatPlaceholder"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"
Margin="{StaticResource SmallTopMargin}"
AutomationProperties.LabeledBy="{Binding ElementName=ImageResizer_FilenameFormatHeader}"
AutomationProperties.HelpText="{Binding ElementName=FileFormatTextBlock, Path=Text}"
>
<TextBox.Header>
<StackPanel Orientation="Horizontal">
<TextBlock Name="ImageResizer_FilenameFormatHeader"
x:Uid="ImageResizer_FilenameFormatHeader"
Margin="0,0,0,0"
Foreground="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled, Converter={StaticResource ModuleEnabledToForegroundConverter}}"/>
<TextBlock Text="&#xE946;"
FontFamily="Segoe MDL2 Assets"
Margin="4,4,0,0"/>
</StackPanel>
</TextBox.Header>
<ToolTipService.ToolTip>
<TextBlock x:Name="FileFormatTextBlock">
<Run x:Uid="ImageResizer_FileFormatDescription"/>
<LineBreak/>
<LineBreak/>
<Run Text="%1" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_Filename" />
<LineBreak/>
<Run Text="%2" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_Sizename"/>
<LineBreak/>
<Run Text="%3" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_SelectedWidth"/>
<LineBreak/>
<Run Text="%4" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_SelectedHeight"/>
<LineBreak/>
<Run Text="%5" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_ActualWidth"/>
<LineBreak/>
<Run Text="%6" FontWeight="Bold" />
<Run Text=" - "/>
<Run x:Uid="ImageResizer_Formatting_ActualHeight"/>
</TextBlock>
</ToolTipService.ToolTip>
</TextBox>
<CheckBox x:Uid="ImageResizer_UseOriginalDate"
IsEnabled="{x:Bind Mode=OneWay, Path=ViewModel.IsEnabled}"
Margin="{StaticResource SmallTopMargin}"
IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.KeepDateModified}"/>
</StackPanel>
<RelativePanel x:Name="SidePanel"
HorizontalAlignment="Left"
Width="{StaticResource SidePanelWidth}"
Grid.Column="1">
<StackPanel x:Name="DescriptionPanel">
<TextBlock x:Uid="About_ImageResizer" x:Name="AboutTitle" Grid.ColumnSpan="2"
Style="{StaticResource SettingsGroupTitleStyle}"
Margin="{StaticResource XSmallBottomMargin}"/>
<TextBlock x:Uid="ImageResizer_Description"
TextWrapping="Wrap"
Grid.Row="1" />
</StackPanel>
<Border x:Name="AboutImage"
CornerRadius="4"
Grid.Row="2"
MaxWidth="240"
HorizontalAlignment="Left"
Margin="{StaticResource SmallTopBottomMargin}"
RelativePanel.Below="DescriptionPanel">
<HyperlinkButton x:Uid="ImageResizer_ImageHyperlinkToDocs">
<Image x:Uid="ImageResizer_Image" Source="ms-appx:///Assets/Modules/ImageResizer.png" />
</HyperlinkButton>
</Border>
<StackPanel x:Name="LinksPanel"
Margin="0,1,0,0"
RelativePanel.Below="AboutImage"
Orientation="Vertical" >
<HyperlinkButton x:Uid="ImageResizer_ImageHyperlinkToDocs">
<TextBlock x:Uid="Module_overview" />
</HyperlinkButton>
2020-08-07 01:09:50 +08:00
<HyperlinkButton NavigateUri="https://aka.ms/powerToysGiveFeedback">
<TextBlock x:Uid="Give_Feedback" />
</HyperlinkButton>
<TextBlock
x:Uid="AttributionTitle"
Style="{StaticResource SettingsGroupTitleStyle}"/>
<HyperlinkButton Margin="0,-3,0,0"
NavigateUri="https://github.com/bricelam/ImageResizer/">
<TextBlock Text="Brice Lambson's ImageResizer" TextWrapping="Wrap" />
</HyperlinkButton>
</StackPanel>
</RelativePanel>
</Grid>
</Page>