mirror of
https://github.com/ChrisTitusTech/winutil.git
synced 2026-08-12 02:51:16 +10:00
Turn the Install category filters into toggle chips (#4926)
* Turn the Install category filters into toggle chips - Replace the filter buttons with toggles that show which ones are active - Add ctrl click to select more than one category - Keep the search box and the category filter independent of each other - Expand matching categories while a filter is active * Fix the filter interactions the category chips missed - Pass the selected categories to the lazy rendering batches, the old call used a parameter that no longer exists and threw while typing - Keep the category filter when switching tabs, the chips stayed checked while the filter itself was dropped - Put a category back to collapsed once the filter that expanded it is gone * Document the Install category filters - Add a guide section for the chips, ctrl click and clearing the filter - Note that search and the category chips apply together * Correct the category filter guide wording - Clearing by clicking the chip only applies when it is the only one selected - Only categories with matches expand, and only auto expanded ones re-collapse
This commit is contained in:
+55
-16
@@ -997,6 +997,44 @@
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
<!-- Category filter chips. A toggle rather than a button, so the active filter is visible
|
||||
on the chip itself instead of only in the results below. -->
|
||||
<Style x:Key="FilterChipToggleStyle" TargetType="ToggleButton">
|
||||
<Setter Property="Margin" Value="2"/>
|
||||
<Setter Property="Padding" Value="12,4,12,4"/>
|
||||
<Setter Property="Cursor" Value="Hand"/>
|
||||
<Setter Property="FontSize" Value="{DynamicResource ButtonFontSize}"/>
|
||||
<Setter Property="FontFamily" Value="{DynamicResource ButtonFontFamily}"/>
|
||||
<Setter Property="Foreground" Value="{DynamicResource ButtonForegroundColor}"/>
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonBackgroundColor}"/>
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="ToggleButton">
|
||||
<Border Name="ChipBorder"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{DynamicResource BorderColor}"
|
||||
BorderThickness="1"
|
||||
CornerRadius="{DynamicResource ButtonCornerRadius}"
|
||||
Padding="{TemplateBinding Padding}">
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"
|
||||
TextBlock.Foreground="{TemplateBinding Foreground}"
|
||||
TextBlock.FontSize="{TemplateBinding FontSize}"/>
|
||||
</Border>
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsMouseOver" Value="True">
|
||||
<Setter TargetName="ChipBorder" Property="Background" Value="{DynamicResource ButtonBackgroundMouseoverColor}"/>
|
||||
</Trigger>
|
||||
<!-- Only colours change on check. Anything affecting text width, bold for
|
||||
instance, would resize the chip and shift every chip after it. -->
|
||||
<Trigger Property="IsChecked" Value="True">
|
||||
<Setter TargetName="ChipBorder" Property="Background" Value="{DynamicResource ButtonBackgroundSelectedColor}"/>
|
||||
<Setter TargetName="ChipBorder" Property="BorderBrush" Value="{DynamicResource LabelboxForegroundColor}"/>
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<Grid Background="{DynamicResource MainBackgroundColor}" ShowGridLines="False" Name="WPFMainGrid" Width="Auto" Height="Auto" HorizontalAlignment="Stretch">
|
||||
<Grid.RowDefinitions>
|
||||
@@ -1313,26 +1351,27 @@
|
||||
<RowDefinition Height="*"/>
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- Quick Category Search Chips -->
|
||||
<!-- Category filters. Click one to filter, ctrl click to combine several. -->
|
||||
<WrapPanel Grid.Row="0" Orientation="Horizontal" Margin="5,5,5,5" Name="WPFSearchChips">
|
||||
<TextBlock Text="Filters"
|
||||
FontSize="{DynamicResource HeaderFontSize}"
|
||||
FontFamily="{DynamicResource HeaderFontFamily}"
|
||||
<TextBlock Text=""
|
||||
FontFamily="Segoe MDL2 Assets"
|
||||
FontSize="{DynamicResource IconFontSize}"
|
||||
Foreground="{DynamicResource LabelboxForegroundColor}"
|
||||
Background="Transparent"
|
||||
VerticalAlignment="Center"
|
||||
Margin="15,0,8,0"/>
|
||||
<Button Name="WPFSearchChipAll" Content="All" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipBrowsers" Content="Browsers" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipCommunications" Content="Communications" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipDevelopment" Content="Development" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipDocument" Content="Document" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipGames" Content="Games" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipMicrosoftTools" Content="Microsoft Tools" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipMultimediaTools" Content="Multimedia Tools" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipProTools" Content="Pro Tools" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipSelfhostedTools" Content="Selfhosted Tools" Style="{StaticResource FilterChipStyle}"/>
|
||||
<Button Name="WPFSearchChipUtilities" Content="Utilities" Style="{StaticResource FilterChipStyle}"/>
|
||||
Margin="10,0,10,0"
|
||||
ToolTip="Filter by category. Ctrl click to select more than one."/>
|
||||
<ToggleButton Name="WPFSearchChipAll" Content="All" Style="{StaticResource FilterChipToggleStyle}" IsChecked="True"/>
|
||||
<ToggleButton Name="WPFSearchChipBrowsers" Content="Browsers" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipCommunications" Content="Communications" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipDevelopment" Content="Development" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipDocument" Content="Document" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipGames" Content="Games" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipMicrosoftTools" Content="Microsoft Tools" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipMultimediaTools" Content="Multimedia Tools" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipProTools" Content="Pro Tools" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipSelfhostedTools" Content="Selfhosted Tools" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
<ToggleButton Name="WPFSearchChipUtilities" Content="Utilities" Style="{StaticResource FilterChipToggleStyle}"/>
|
||||
</WrapPanel>
|
||||
|
||||
<Grid Grid.Row="1" Margin="{DynamicResource TabContentMargin}">
|
||||
|
||||
Reference in New Issue
Block a user