chuan/Ursa.Avalonia
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: polish list theme.

Browse Source
This commit is contained in:
Dong Bin
2025-01-18 16:56:44 +08:00
parent d63a0f6bea
commit 2c14d1b9e8
2 changed files with 198 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

213
demo/Ursa.Demo/Pages/PathPickerDemo.axaml
View File

@@ -1,114 +1,137 @@
<UserControl xmlns="https://github.com/avaloniaui" <UserControl
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="Ursa.Demo.Pages.PathPickerDemo"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns="https://github.com/avaloniaui"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:u="https://irihi.tech/ursa" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:vm="using:Ursa.Demo.ViewModels" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450" xmlns:u="https://irihi.tech/ursa"
x:Class="Ursa.Demo.Pages.PathPickerDemo" xmlns:vm="using:Ursa.Demo.ViewModels"
x:DataType="vm:PathPickerDemoViewModel"> d:DesignHeight="450"
<Grid ColumnDefinitions="*,*" d:DesignWidth="800"
RowDefinitions="7*,3*"> x:DataType="vm:PathPickerDemoViewModel"
<ScrollViewer Grid.Column="0" Grid.Row="0"> mc:Ignorable="d">
<Grid ColumnDefinitions="*,*" RowDefinitions="7*,3*">
<ScrollViewer Grid.Row="0" Grid.Column="0">
<StackPanel> <StackPanel>
<HeaderedContentControl Theme="{DynamicResource GroupBox}" <HeaderedContentControl
Header="Functionality and Usage" Content="PathPicker aggregates a file selector and provides a Command property. The Command is triggered solely after opening the file selector and selecting a file, whereupon the Command receives an IReadOnlyList&lt;string&gt; parameter."
Content="PathPicker aggregates a file selector and provides a Command property. The Command is triggered solely after opening the file selector and selecting a file, whereupon the Command receives an IReadOnlyList&lt;string&gt; parameter."> Header="Functionality and Usage"
</HeaderedContentControl> Theme="{DynamicResource GroupBox}" />
<u:Form LabelAlignment="Left" LabelPosition="Left" LabelWidth="*" HorizontalAlignment="Stretch"> <u:Form
<TextBox Name="Title" u:FormItem.Label="Title" Text="选择文件"></TextBox> HorizontalAlignment="Stretch"
<TextBox Name="SuggestedFileName" u:FormItem.Label="SuggestedFileName" LabelAlignment="Left"
Watermark="filename(not have file extension)"> LabelPosition="Left"
</TextBox> LabelWidth="*">
<TextBox Name="SuggestedStartPath" u:FormItem.Label="SuggestedStartPath" <TextBox
Watermark="D:\Win7 Help\win-x64"> Name="Title"
</TextBox> u:FormItem.Label="Title"
<TextBox Name="FileFilter" u:FormItem.Label="FileFilter" Text="选择文件" />
Watermark="[Name,Pattern] like this [123,*.exe,*.pdb] or [All][ImageAll][11,*.txt]"> <TextBox
</TextBox> Name="SuggestedFileName"
<TextBox Name="DefaultFileExtension" u:FormItem.Label="DefaultFileExtension" u:FormItem.Label="SuggestedFileName"
Watermark="json"> Watermark="filename(not have file extension)" />
</TextBox> <TextBox
<CheckBox Name="AllowMultiple" Content="AllowMultiple" u:FormItem.NoLabel="True" Name="SuggestedStartPath"
> u:FormItem.Label="SuggestedStartPath"
</CheckBox> Watermark="D:\Win7 Help\win-x64" />
<CheckBox Name="IsOmitCommandOnCancel" Content="Do not trigger the command after unselecting." <TextBox
u:FormItem.NoLabel="True" Name="FileFilter"
> u:FormItem.Label="FileFilter"
</CheckBox> Watermark="[Name,Pattern] like this [123,*.exe,*.pdb] or [All][ImageAll][11,*.txt]" />
<CheckBox Name="IsClearSelectionOnCancel" Content="Clear the selection when unselecting." <TextBox
u:FormItem.NoLabel="True" Name="DefaultFileExtension"
> u:FormItem.Label="DefaultFileExtension"
</CheckBox> Watermark="json" />
<u:EnumSelector Name="UsePickerType" EnumType="u:UsePickerTypes" u:FormItem.Label="UsePickerType"></u:EnumSelector> <CheckBox
<u:ControlClassesInput Name="ClassInput" u:FormItem.Label="Style Class" HorizontalAlignment="Left"></u:ControlClassesInput> Name="AllowMultiple"
u:FormItem.NoLabel="True"
Content="AllowMultiple" />
<CheckBox
Name="IsOmitCommandOnCancel"
u:FormItem.NoLabel="True"
Content="Do not trigger the command after unselecting." />
<CheckBox
Name="IsClearSelectionOnCancel"
u:FormItem.NoLabel="True"
Content="Clear the selection when unselecting." />
<u:EnumSelector
Name="UsePickerType"
u:FormItem.Label="UsePickerType"
EnumType="u:UsePickerTypes" />
<u:ControlClassesInput
Name="ClassInput"
HorizontalAlignment="Left"
u:FormItem.Label="Style Class" />
</u:Form> </u:Form>
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>
<ScrollViewer Grid.Column="0" Grid.Row="1"> <ScrollViewer Grid.Row="1" Grid.Column="0">
<StackPanel Spacing="2"> <StackPanel Spacing="2">
<HeaderedContentControl Header="Default"> <HeaderedContentControl Header="Default">
<u:PathPicker Title="{Binding #Title.Text}" <u:PathPicker
u:ControlClassesInput.Source="{Binding #ClassInput}" Title="{Binding #Title.Text}"
SuggestedFileName="{Binding #SuggestedFileName.Text}" u:ControlClassesInput.Source="{Binding #ClassInput}"
SuggestedStartPath="{Binding #SuggestedStartPath.Text}" AllowMultiple="{Binding #AllowMultiple.IsChecked, Mode=TwoWay}"
FileFilter="{Binding #FileFilter.Text}" Command="{Binding SelectedCommand}"
DefaultFileExtension="{Binding #DefaultFileExtension.Text}" DefaultFileExtension="{Binding #DefaultFileExtension.Text}"
AllowMultiple="{Binding #AllowMultiple.IsChecked, Mode=TwoWay}" FileFilter="{Binding #FileFilter.Text}"
UsePickerType="{Binding #UsePickerType.Value}" IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"
SelectedPathsText="{Binding Path,Mode=OneWayToSource}" IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}"
SelectedPaths="{Binding Paths,Mode=OneWayToSource}" SelectedPaths="{Binding Paths, Mode=OneWayToSource}"
Command="{Binding SelectedCommand}" SelectedPathsText="{Binding Path, Mode=OneWayToSource}"
IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}" SuggestedFileName="{Binding #SuggestedFileName.Text}"
IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"> SuggestedStartPath="{Binding #SuggestedStartPath.Text}"
</u:PathPicker> UsePickerType="{Binding #UsePickerType.Value}" />
</HeaderedContentControl> </HeaderedContentControl>
<HeaderedContentControl Header="ButtonPathPicker"> <HeaderedContentControl Header="ButtonPathPicker">
<u:PathPicker Theme="{DynamicResource ButtonPathPicker}" <u:PathPicker
Title="{Binding #Title.Text}" Title="{Binding #Title.Text}"
SuggestedFileName="{Binding #SuggestedFileName.Text}" AllowMultiple="{Binding #AllowMultiple.IsChecked}"
SuggestedStartPath="{Binding #SuggestedStartPath.Text}" Command="{Binding SelectedCommand}"
FileFilter="{Binding #FileFilter.Text}" DefaultFileExtension="{Binding #DefaultFileExtension.Text}"
DefaultFileExtension="{Binding #DefaultFileExtension.Text}" FileFilter="{Binding #FileFilter.Text}"
AllowMultiple="{Binding #AllowMultiple.IsChecked}" IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"
UsePickerType="{Binding #UsePickerType.Value}" IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}"
SelectedPathsText="{Binding Path,Mode=OneWayToSource}" SelectedPaths="{Binding Paths, Mode=OneWayToSource}"
SelectedPaths="{Binding Paths,Mode=OneWayToSource}" SelectedPathsText="{Binding Path, Mode=OneWayToSource}"
Command="{Binding SelectedCommand}" SuggestedFileName="{Binding #SuggestedFileName.Text}"
IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}" SuggestedStartPath="{Binding #SuggestedStartPath.Text}"
IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"> Theme="{DynamicResource ButtonPathPicker}"
</u:PathPicker> UsePickerType="{Binding #UsePickerType.Value}" />
</HeaderedContentControl> </HeaderedContentControl>
<HeaderedContentControl Header="PathPickerForListView"> <HeaderedContentControl Header="ListPathPicker">
<u:PathPicker Theme="{DynamicResource PathPickerForListView}" <u:PathPicker
Title="{Binding #Title.Text}" Title="{Binding #Title.Text}"
SuggestedFileName="{Binding #SuggestedFileName.Text}" AllowMultiple="{Binding #AllowMultiple.IsChecked}"
SuggestedStartPath="{Binding #SuggestedStartPath.Text}" Command="{Binding SelectedCommand}"
FileFilter="{Binding #FileFilter.Text}" DefaultFileExtension="{Binding #DefaultFileExtension.Text}"
DefaultFileExtension="{Binding #DefaultFileExtension.Text}" FileFilter="{Binding #FileFilter.Text}"
AllowMultiple="{Binding #AllowMultiple.IsChecked}" IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"
UsePickerType="{Binding #UsePickerType.Value}" IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}"
SelectedPathsText="{Binding Path,Mode=OneWayToSource}" SelectedPaths="{Binding Paths, Mode=OneWayToSource}"
SelectedPaths="{Binding Paths,Mode=OneWayToSource}" SelectedPathsText="{Binding Path, Mode=OneWayToSource}"
Command="{Binding SelectedCommand}" SuggestedFileName="{Binding #SuggestedFileName.Text}"
IsOmitCommandOnCancel="{Binding #IsOmitCommandOnCancel.IsChecked}" SuggestedStartPath="{Binding #SuggestedStartPath.Text}"
IsClearSelectionOnCancel="{Binding #IsClearSelectionOnCancel.IsChecked}"> Theme="{DynamicResource ListPathPicker}"
</u:PathPicker> UsePickerType="{Binding #UsePickerType.Value}" />
</HeaderedContentControl> </HeaderedContentControl>
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>
<ScrollViewer Grid.Column="1" Grid.Row="0" Grid.RowSpan="2"> <ScrollViewer
Grid.Row="0"
Grid.RowSpan="2"
Grid.Column="1">
<StackPanel Spacing="1"> <StackPanel Spacing="1">
<TextBlock Text="{Binding CommandTriggerCount,StringFormat='Command Trigger Count:{0}'}"></TextBlock> <TextBlock Text="{Binding CommandTriggerCount, StringFormat='Command Trigger Count:{0}'}" />
<HeaderedContentControl Header="SelectedPathsText"> <HeaderedContentControl Header="SelectedPathsText">
<TextBox Name="SelectedPath" u:FormItem.Label="SelectedPath" IsReadOnly="True" <TextBox
Text="{Binding Path}"> Name="SelectedPath"
</TextBox> u:FormItem.Label="SelectedPath"
IsReadOnly="True"
Text="{Binding Path}" />
</HeaderedContentControl> </HeaderedContentControl>
<HeaderedContentControl Header="SelectedPaths"> <HeaderedContentControl Header="SelectedPaths">
<ListBox Name="SelectedPaths" <ListBox Name="SelectedPaths" ItemsSource="{Binding Paths}" />
ItemsSource="{Binding Paths}">
</ListBox>
</HeaderedContentControl> </HeaderedContentControl>
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>

102
src/Ursa.Themes.Semi/Controls/PathPicker.axaml
View File

@@ -15,15 +15,16 @@
<DockPanel> <DockPanel>
<Button <Button
Name="{x:Static u:PathPicker.PART_Button}" Name="{x:Static u:PathPicker.PART_Button}"
Content="{TemplateBinding Title}"
HorizontalAlignment="Stretch" HorizontalAlignment="Stretch"
VerticalAlignment="Center" VerticalAlignment="Center"
Content="{TemplateBinding Title}"
DockPanel.Dock="Right" /> DockPanel.Dock="Right" />
<TextBox <TextBox
Name="PART_TextBox" Name="PART_TextBox"
AcceptsReturn="{TemplateBinding AllowMultiple}" AcceptsReturn="{TemplateBinding AllowMultiple}"
DockPanel.Dock="Left" DockPanel.Dock="Left"
Text="{TemplateBinding SelectedPathsText, Mode=TwoWay}" /> Text="{TemplateBinding SelectedPathsText,
Mode=TwoWay}" />
</DockPanel> </DockPanel>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
@@ -34,9 +35,9 @@
<Style Selector="^ /template/ Button#PART_Button"> <Style Selector="^ /template/ Button#PART_Button">
<Setter Property="DockPanel.Dock" Value="Right" /> <Setter Property="DockPanel.Dock" Value="Right" />
<Setter Property="VerticalAlignment" Value="Center"></Setter> <Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={x:Static converters:CornerRadiusTakeConverter.Right}}" /> <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={x:Static converters:CornerRadiusTakeConverter.Right}}" />
<Setter Property="Margin" Value="1 0 0 0"></Setter> <Setter Property="Margin" Value="1 0 0 0" />
</Style> </Style>
<Style Selector="^ /template/ TextBox#PART_TextBox"> <Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="DockPanel.Dock" Value="Left" /> <Setter Property="DockPanel.Dock" Value="Left" />
@@ -46,7 +47,7 @@
<Style Selector="^ /template/ Button#PART_Button"> <Style Selector="^ /template/ Button#PART_Button">
<Setter Property="DockPanel.Dock" Value="Top" /> <Setter Property="DockPanel.Dock" Value="Top" />
<Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={x:Static converters:CornerRadiusTakeConverter.Top}}" /> <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={x:Static converters:CornerRadiusTakeConverter.Top}}" />
<Setter Property="Margin" Value="0 0 0 1"></Setter> <Setter Property="Margin" Value="0 0 0 1" />
</Style> </Style>
<Style Selector="^ /template/ TextBox#PART_TextBox"> <Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="DockPanel.Dock" Value="Bottom" /> <Setter Property="DockPanel.Dock" Value="Bottom" />
@@ -71,33 +72,90 @@
</Style> </Style>
</ControlTheme> </ControlTheme>
<ControlTheme x:Key="PathPickerForListView" TargetType="u:PathPicker"> <ControlTheme x:Key="ListPathPicker" TargetType="u:PathPicker">
<Setter Property="CornerRadius" Value="3" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Expander HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}"> <Expander
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
CornerRadius="{TemplateBinding CornerRadius}"
Theme="{StaticResource INTERNAL_PathPickerExpander}">
<Expander.Header> <Expander.Header>
<Button <Button
Name="PART_Button" Name="PART_Button"
HorizontalAlignment="Stretch" HorizontalAlignment="Stretch"
Content="{TemplateBinding Title}"> Content="{TemplateBinding Title}"
<Button.Theme> CornerRadius="{TemplateBinding CornerRadius,
<ControlTheme TargetType="Button"> Converter={x:Static converters:CornerRadiusTakeConverter.Left}}" />
<Setter Property="Template">
<ControlTemplate>
<TextPresenter
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Background="Transparent"
Text="{TemplateBinding Content}" />
</ControlTemplate>
</Setter>
</ControlTheme>
</Button.Theme>
</Button>
</Expander.Header> </Expander.Header>
<ListBox ItemsSource="{TemplateBinding SelectedPaths}" /> <ListBox ItemsSource="{TemplateBinding SelectedPaths}" />
</Expander> </Expander>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^ /template/ Button#PART_Button:pressed">
<Setter Property="RenderTransform" Value="{x:Null}" />
</Style>
</ControlTheme>
<ControlTheme x:Key="INTERNAL_PathPickerExpander" TargetType="Expander">
<Setter Property="Template">
<ControlTemplate>
<DockPanel>
<DockPanel DockPanel.Dock="Top" LastChildFill="True">
<ToggleButton
Name="ExpanderHeader"
Margin="1,0,0,0"
Background="{DynamicResource ToggleButtonDefaultBackground}"
CornerRadius="{TemplateBinding CornerRadius,
Converter={x:Static converters:CornerRadiusTakeConverter.Right}}"
DockPanel.Dock="Right"
IsChecked="{TemplateBinding IsExpanded,
Mode=TwoWay}"
Theme="{DynamicResource INTERNAL_PathPickerExpanderHeaderToggleButtonTheme}">
<PathIcon
Name="PART_PathIcon"
Data="{DynamicResource ExpanderIcon}"
Theme="{DynamicResource InnerPathIcon}">
<PathIcon.Transitions>
<Transitions>
<TransformOperationsTransition Property="RenderTransform" Duration="0.1" />
</Transitions>
</PathIcon.Transitions>
</PathIcon>
</ToggleButton>
<ContentPresenter Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" />
</DockPanel>
<ContentPresenter
Name="PART_ContentPresenter"
Margin="{DynamicResource ExpanderContentMargin}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Foreground="{DynamicResource ExpanderContentForeground}"
IsVisible="{TemplateBinding IsExpanded,
Mode=TwoWay}" />
</DockPanel>
</ControlTemplate>
</Setter>
<Style Selector="^:expanded /template/ PathIcon#PART_PathIcon">
<Setter Property="RenderTransform" Value="rotate(180deg)" />
</Style>
</ControlTheme>
<ControlTheme x:Key="INTERNAL_PathPickerExpanderHeaderToggleButtonTheme" TargetType="ToggleButton">
<Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
<Setter Property="Template">
<ControlTemplate TargetType="ToggleButton">
<ContentPresenter
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
Content="{TemplateBinding Content}"
CornerRadius="{TemplateBinding CornerRadius}" />
</ControlTemplate>
</Setter>
</ControlTheme> </ControlTheme>
</ResourceDictionary> </ResourceDictionary>