feat: fix separator visibility. add dropdown button.

This commit is contained in:
rabbitism
2024-04-27 00:39:50 +08:00
parent 63b9ccfe5e
commit 9cce1cc180
4 changed files with 159 additions and 45 deletions

View File

@@ -2,6 +2,7 @@
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:Ursa.Converters;assembly=Ursa"
xmlns:iri="https://irihi.tech/shared"
xmlns:u="https://irihi.tech/ursa">
<!-- Add Resources Here -->
<Design.PreviewWith>
@@ -102,6 +103,11 @@
</ControlTheme>
<ControlTheme x:Key="{x:Type u:TimePicker}" TargetType="u:TimePicker">
<Setter Property="Background" Value="{DynamicResource TextBoxDefaultBackground}" />
<Setter Property="Foreground" Value="{DynamicResource TextBoxForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
<Setter Property="BorderThickness" Value="{DynamicResource TextBoxBorderThickness}" />
<Setter Property="CornerRadius" Value="{DynamicResource TextBoxDefaultCornerRadius}" />
<Setter Property="Template">
<ControlTemplate TargetType="u:TimePicker">
<DataValidationErrors>
@@ -115,34 +121,61 @@
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}" />
<Grid ColumnDefinitions="Auto, *, Auto, Auto, Auto">
<Grid ColumnDefinitions="*, Auto, Auto">
<!-- InnerLeftContent, Text and Watermark, ClearButton, InnerRightContent, Icon -->
<ContentPresenter
Grid.Column="0"
Padding="{TemplateBinding Padding,
Converter={x:Static converters:ThicknessIncludeConverter.Right}}"
VerticalAlignment="Stretch"
VerticalContentAlignment="Center"
Content="{TemplateBinding InnerLeftContent}"
DockPanel.Dock="Left"
Foreground="{DynamicResource TextBoxInnerForeground}"
IsVisible="{Binding Path=InnerLeftContent, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static ObjectConverters.IsNotNull}}" />
<ContentPresenter
Grid.Column="3"
Padding="{TemplateBinding Padding,
Converter={x:Static converters:ThicknessIncludeConverter.Left}}"
VerticalAlignment="Stretch"
VerticalContentAlignment="Center"
Content="{TemplateBinding InnerRightContent}"
DockPanel.Dock="Right"
Foreground="{DynamicResource TextBoxInnerForeground}"
IsVisible="{Binding Path=InnerRightContent, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static ObjectConverters.IsNotNull}}" />
<TextBlock Grid.Column="1" Text="{TemplateBinding Watermark}" />
<TextBox
Name="{x:Static u:TimePicker.PART_TextBox}"
Grid.Column="1"
Grid.Column="0"
Grid.ColumnSpan="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
BorderThickness="0" />
Background="Transparent"
BorderBrush="Transparent"
BorderThickness="0"
Foreground="{TemplateBinding Foreground}"
InnerLeftContent="{TemplateBinding InnerLeftContent}"
InnerRightContent="{TemplateBinding InnerRightContent}"
IsReadOnly="{TemplateBinding IsReadonly}"
Theme="{DynamicResource NoErrorTextBox}"
Watermark="{TemplateBinding Watermark}">
<TextBox.Styles>
<Style Selector="TextBox#PART_TextBox:pointerover /template/ Border#PART_ContentPresenterBorder">
<!-- By default the TextBox has its own focused state, override this to disable it here -->
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="BorderThickness" Value="0" />
</Style>
<Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_ContentPresenterBorder">
<!-- By default the TextBox has its own focused state, override this to disable it here -->
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="BorderThickness" Value="0" />
</Style>
<Style Selector="TextBox#PART_TextBox:disabled">
<Style Selector="^ /template/ Border#PART_ContentPresenterBorder">
<!-- By default the TextBox has its own disabled state, override this to make the border background show through -->
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
</Style>
</Style>
</TextBox.Styles>
</TextBox>
<Button
Name="ClearButton"
Grid.Column="1"
Padding="0,0,8,0"
Command="{Binding $parent[iri:IClearControl].Clear}"
Content="{DynamicResource IconButtonClearData}"
Focusable="False"
IsVisible="False"
Theme="{DynamicResource InnerIconButton}" />
<Button
Name="{x:Static u:TimePicker.PART_Button}"
Grid.Column="2"
Padding="0,0,8,0"
Content="{DynamicResource TimePickerIconGlyph}"
Focusable="False"
Theme="{DynamicResource InnerIconButton}" />
<Popup
Name="{x:Static u:TimePicker.PART_Popup}"
Grid.Column="0"
@@ -151,10 +184,21 @@
Mode=TwoWay}"
Placement="BottomEdgeAlignedLeft"
PlacementTarget="Background">
<Border Theme="{DynamicResource CardBorder}">
<Border
Margin="0,4"
HorizontalAlignment="Stretch"
Background="{DynamicResource ComboBoxPopupBackground}"
BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
ClipToBounds="True"
CornerRadius="6">
<DockPanel>
<StackPanel DockPanel.Dock="Bottom" IsVisible="{TemplateBinding NeedConfirmation}">
<Button Content="Confirm" Command="{Binding $parent[u:TimePicker].Confirm}"></Button>
<Button
HorizontalAlignment="Right"
Command="{Binding $parent[u:TimePicker].Confirm}"
Content="Confirm" />
</StackPanel>
<u:TimePickerPresenter
Name="{x:Static u:TimePicker.PART_Presenter}"
@@ -169,5 +213,37 @@
</DataValidationErrors>
</ControlTemplate>
</Setter>
<Style Selector="^.clearButton, ^.ClearButton">
<Style Selector="^:pointerover /template/ Button#ClearButton">
<Setter Property="IsVisible" Value="{Binding $parent[u:TimePicker].SelectedTime, Converter={x:Static ObjectConverters.IsNotNull}}" />
</Style>
</Style>
<Style Selector="^:pointerover">
<Style Selector="^ /template/ Border#Background">
<Setter Property="Background" Value="{DynamicResource CalendarDatePickerPointeroverBackground}" />
</Style>
</Style>
<!-- Disabled State -->
<Style Selector="^:disabled">
<Style Selector="^ /template/ Border#Background">
<Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
</Style>
<Style Selector="^ /template/ Button#PART_Button">
<Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerDisabledIconForeground}" />
</Style>
<Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent" />
</Style>
</Style>
<!-- Focused State -->
<Style Selector="^:focus-within /template/ Border#Background">
<Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerFocusBorderBrush}" />
</Style>
</ControlTheme>
</ResourceDictionary>